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等