vue打包後修改伺服器地址

『壹』 怎麼把VUE項目部署到伺服器上面

1.使用xshell登錄到阿里雲伺服器。安裝nginx（本文安裝到/etc下）

[plain]view plain

• cd/etc

• apt-getupdate

• apt-getinstallnginx

2.首先先配置nginx，然後再根據配置文件做下一步操作

打開/etc/nginx/nginx.conf文件

[plain]view plain

• vim/etc/nginx/nginx.conf

在nginx.conf中配置如下：

[plain]view plain

• userwww-data;

• worker_processesauto;

• pid/run/nginx.pid;

• events{

• worker_connections768;

• #multi_accepton;

• }

• http{

• ##

• #BasicSettings

• ##

• tcp_nodelayon;

• keepalive_timeout65;

• types_hash_max_size2048;

• #server_tokensoff;

• #server_names_hash_bucket_size64;

• #server_name_in_redirectoff;

• include/etc/nginx/mime.types;

• default_typeapplication/octet-stream;

• ##

• #SSLSettings

• ##

• ssl_protocolsTLSv1TLSv1.1TLSv1.2;#DroppingSSLv3,ref:POODLE

• ssl_prefer_server_cipherson;

• ##

• #LoggingSettings

• ##

• access_log/var/log/nginx/access.log;

• error_log/var/log/nginx/error.log;

• ##

• #GzipSettings

• ##

• gzipon;

• gzip_disable"msie6";

• #gzip_varyon;

• #gzip_proxiedany;

• #gzip_comp_level6;

• #gzip_buffers168k;

• #gzip_http_version1.1;

• ##

• #VirtualHostConfigs

• ##

• gzipon;

• gzip_disable"msie6";

• #gzip_varyon;

• #gzip_proxiedany;

• #gzip_comp_level6;

• #gzip_buffers168k;

• #gzip_http_version1.1;

• #gzip_typestext/plaintext/cssapplication/jsonapplication/javascripttext/xmlapplication/xmlapplication/xml+rsstext/javascript;

• ##

• #VirtualHostConfigs

• ##

• include/etc/nginx/conf.d/*.conf;

• include/etc/nginx/sites-enabled/*;

• #以下為我們添加的內容

• server{

• listen80;

• server_nameyour-ipaddress;

• root/home/my-project/;

• indexindex.html;

• location/datas{

• rewrite^.+datas/?(.*)$/$1break;

• includeuwsgi_params;

• proxy_passhttp://ip:port;

• }

• }

• }

接下來就根據配置文件進行下一步工作。配置文件中的server_name後面是阿里雲伺服器的ip地址

3.配置文件中的listen是nginx監聽的埠號，所以需要在阿里雲伺服器上為80埠添加安全組規則

在本地的瀏覽器登錄阿里雲伺服器->進入控制台->點擊安全組->點擊配置規則->點擊添加安全組規則，之後配置如下（註：入方向和出方向都要配置）




4.配置文件中的root和index那兩行表示我們把項目文件夾放在/home/my-project下

例如有兩個項目文件夾分別為test1，test2，裡面都有index.html。則目錄結構如下

/home

|--my-project

|--test1

|--index.html

|--test2

|--index.html

則在瀏覽器輸入http://ip/test1/index.html

伺服器便會在/home/my-project中找到test1下的index.html執行；

如果在瀏覽器中輸入http://ip/test2/index.html

伺服器便會在/home/my-project中找到test2下的index.html執行；

這樣便可以在伺服器下放多個項目文件夾。

5.所以我們也需要在本地項目的config/index.js里的build下進行修改,如果要把項目放到test1下，則

[javascript]view plain

• assetsPublicPath:'/test1/',

如果用到了vue-router，則修改/router/index.js

[javascript]view plain

• exportdefaultnewRouter({

• base:'/test1/',//添加這行

• linkActiveClass:'active',

• routes

• });

6.nginx配置文件中的location則是針對跨域處理，表示把對/datas的請求轉發給http://ip:port,本文中這個http://ip:port下就是需要的數據，例如http://ip:port/seller,在本地項目文件中ajax請求數據的地方如下

[javascript]view plain

• consturl='/datas/seller';

• this.$http.get(url).then((response)=>{

• .....

• });

7.修改後在本地命令行下運行:cnpm run build 生成dist文件。把dist文件里的index.html和static文件上傳到伺服器的/home/my-project/test1下，目錄結構如下

/home

|--my-project

|--test1

|--index.html

|--static


8.啟動nginx

[plain]view plain

• servicenginxstart

9.至此項目部署成功，在瀏覽器下輸入: http://ip/test1/index.html 即可

『貳』 vue項目打包，路由在資料庫里，怎麼進行分割

一、使用工具：webpack、react

二、方法步驟：

1、修改你的路由

三、注意事項：[name].js這一點很重要，要是不這樣寫，就不能打包成對應的路由js。

『叄』 vue中使用vue i18n如何實現打包後後端修改國際化文件生效

你可以把這部分文件放在static文件夾地下，用的時候指向到這文件路徑地下，webpack打包的時候也配下不壓縮打包這個目錄地下，vue-cli默認集成的webpack配置有這個操作，部署的伺服器也可以直接到這個dist/static地下去修改這些文件了

『肆』 vue項目要部署在伺服器上，那麼伺服器需要安裝node.js環境嗎

最好是安裝一個。
1.如果你僅僅是打包好的vue相機，那麼要看服務端使用的是什麼語言，如果是node的話，肯定要安裝node環境的，但是如果不是node，那麼就沒有必要了。
2.如果你想在服務端跑vue的項目，也就是在遠程端做開發工作，那麼肯定是要安裝node的，畢竟vue開發環境需要node。
基本上服務端也就這兩種需求，node包其實很小，安裝一個也不費事，還可以方便開發，我覺得在遠程端按一個最好。

『伍』 如何打包vue項目加node.js後端到雲伺服器

在命令行輸入npm run build:prod，等待打包完成

項目目錄下就會多出一個dist文件夾，裡面有index.html文件和static文件夾，
直接上傳到伺服器上就行了

『陸』 Vue_cli 伺服器運行後URL變成http://localhost:8080/#/

在route/index.js文件中找到routes節點，在該節點上面同級定義
mode: 'history',
這樣，路由模式就變成了我們所熟悉的/A/B/C這種形式而沒有#在中間；

『柒』 怎樣配置才能讓vuecli build後的靜態文件放到子目錄也能訪問

項目config文件夾里index.js中的assetsPublicPath，默認是/，改成你想設置的子目錄名稱，比如： /weixin/。
然後還要配置頁面內的路由路徑就可以了。

『捌』 vue+framework7中run之後是頁面的地址一直就只有localhost:8080,哪位大神可以解決一下嗎

設置埠8080啊面加埠號默認80tomcat設置8080所80打埠放

修改tomcat埠號:
修改Server.xml文件8080埠改80
8080Tomcat伺服器默認埠號我通修改Tomcat伺服器conf目錄主配置文件server.xml更改.用記事本打server.xml文件找部:

引用內容：

<Connector port="8080" maxHttpHeaderSize="8192"
maxThreads="150" minSpareThreads="25" maxSpareThreads="75"
enableLookups="false" redirectPort="8443" acceptCount="100"
connectionTimeout="20000" disableUploadTimeout="true" />

其port="8080"更改新埠號即8080改9080等