如何将vue项目部署到腾讯云服务器
Ⅰ 小白研究项目部署-关于vue项目部署遇到的一些问题
在搞清root，alias，try_files的基本用法后，我开始尝试vue项目的部署。
（用法我之前的文章也研究过）
此前，听说挺多小伙伴会遇到vue-router-history模式种种问题，比如路径无法匹配，找不到静态资源，刷新页面404，etc...
不急，只要找到原因，问题是可以迎刃而解的。
项目部署环境一般可以分为三种：生产环境，测试环境，开发环境。
开发环境 ：开发环境时程序员专门用于开发的服务器，配置可以比较随意，为了开发调试方便，一般打开全部错误报告和测试工具，是最基础的环境。
生产环境 ：生产环境是指正式提供对外服务的，一般会关掉错误报告，打开错误日志，是最重要的环境。部署分支一般为master分支。
测试环境 ：一般是克隆一份生产环境的配置，一个程序在测试环境工作不正常，那么肯定不能把它发布到生产服务器，是开发环境到生产环境的过渡环境。
测试环境的分支存在bug，一般不会让用户和其他人看到，并且测试环境会尽量与生产环境相似。
如何区分生产环境和开发环境？
process.env.NODE_ENV 是 node 的全局变量 process 的一个属性，它的作用是区分当前环境是生产环境还是开发环境，
可以参考学习： 理解webpack中的process.env.NODE_ENV
其实一般的vue单页面应用项目中，遇到路径无法匹配，或者资源引用错误问题都是由于以下几个属性造成的，如果你经常翻官网文档，那看到这里应该就已经会意，他们分别是：
接下来我将讲解以下这几个属性的使用。
依照官网的解释，贴一张用法图：
当使用基于 HTML5 history.pushState 的路由时，“相对 publicPath” 会受到限制，即是说在使用history模式时，publicPath需要设置为绝对路径。那么在vue.config.js文件中，你应该这样配置：
在nginx配置文件中你就需要这样配置：
假设我的项目名为history，并且放在/usr/local/webserver/nginx/myProject 目录下，如tree图
示例贴一下： 珂朵莉的服务器 (点击about会使用路由跳转)
如果你的配置出现页面空白，或者404访问错误，资源引用问题（F12可观察），这时你就要检查publicPath，assetsDir甚至是nginx有没有配置正确了。
我觉得原因是页面刷新时，服务器找不到任何的静态资源，就报404，那么解决办法就简单了： 你要在服务端增加一个覆盖所有情况的候选资源：如果 URL 匹配不到任何静态资源，则应该返回同一个 index.html 页面，这个页面就是你 app 依赖的页面。即使用try_files 寻找index.html。
可以参考本项目的nginx配置：
但如此配置后，你的服务器就不再返回 404 错误页面，因为对于所有路径都会返回 index.html 文件。为了避免这种情况，你应该在 Vue 应用里面覆盖所有的路由情况，然后在给出一个 404 页面。
参考官网例子：
另一方面,有可能是Vue-Router没有配置好，需要注意初始化Router时候的base参数:
如此项目部署就完成了。
感谢博哥指出之前文章错误之处，已经修正，谢谢
Ⅱ vue项目要部署在服务器上，那么服务器需要安装node.js环境吗
最好是安装一个。
1.如果你仅仅是打包好的vue相机，那么要看服务端使用的是什么语言，如果是node的话，肯定要安装node环境的，但是如果不是node，那么就没有必要了。
2.如果你想在服务端跑vue的项目，也就是在远程端做开发工作，那么肯定是要安装node的，毕竟vue开发环境需要node。
基本上服务端也就这两种需求，node包其实很小，安装一个也不费事，还可以方便开发，我觉得在远程端按一个最好。
Ⅲ 如何将自己写的web项目用腾讯云服务器来运行新手求教！
先在腾讯云买个云主机，然后搭建好对应的Web环境，再上传本地源码就可以了。
如果是PHP的代码，可以用护卫神PHP套件，一键安装配置好。
Ⅳ 怎么部署到腾讯云服务器
这个需要jsp环境的，需要一个系统的配置。在这里简单两句说不完。
Ⅳ 如何把本地网站部署到云服务器上
一、购买云服务器，这里以腾讯云为例。
如何购买这里就不废话了，购买成功后腾讯云会给你一个站内信，告诉你登录服务器的用户名和密码(我这里买的是centos7.2版本的)
二、配置服务器
如果你购买的是学生版的，它的默认配置是没有数据盘的，只有一个系统盘，所以也不需要你进行分盘、格式化盘、挂载等操作。如非学生，请参考如下:
https://cloud.tencent.com/document/proct/213/2042
三、环境配置
如果运行自己本地开发好的网站需要一定的运行环境，那么云服务主机当然也要配置相应的运行环境，下面以lamp运行环境为例。通过yum命令安装Mysql和PHP，注意，在centos7.x版本里已经没有MySQL的集成包了(因为oracle想把MySQL闭源，社区人员开发出来maridb,也就是MySQL的衍生版)。具体细节请参考腾讯云官方文档：https://cloud.tencent.com/document/proct/213/2125
四、把本地文件上传到云端服务器上
上传位置为 /root/var/www/html
五、上传数据库文件。
a、首先通过腾讯云的控制台或其他软件都可以登录到腾讯云的服务器上，登录MySQL数据库，然后创建数据库。
b、把sql文件放到指定目录下，然后通过source命令导入数据库文件。
source命令导入SQL文件详解链接
导入sql的命令行如下：
source “路径名”+/mytest_emp_dept.sql
==================================
六、如果有域名，将自己的域名绑定到服务器的公网ip上。
Ⅵ 如何使用docker部署vue项目
熟悉vue项目的开发朋友应该了解，对于vue项目来说，上线其实就是执行npm run build 命令，然后将build出的dist文件夹上传到服务器上就可以了，对于现在的前后端分离项目来说，就是把dist放到nginx的html文件夹即可。
上传的过程既可以手动实现，也可以通过jenkins这类在线编译软件，总之，殊途同归。
除了上面两种还有一种现在比较火的部署方式，就是docker部署，当然正如上面说的，docker也是要实现上面的操作，只不过有些差异而已。
针对docker部署需要了解的是，一般我们只需要拉取nginx镜像，把dist文件夹写入镜像即可，不需要去镜像里面执行拉取代码、执行编译、打包等操作。这些操作一般在写入镜像执行。
这样做的目的跟docker的理念是一致的，功能解耦，方便维护，而且对于一些大公司来说，可能还需要将编译后的代码进行扫描等操作，如果在docker镜像内编译的话如果出现错误是不好定位问题的。
那么如何实现docker部署vue项目呢，操作如下参考：
文件目录如下：
在vueProject 根目录下新建Dockerfile文件，注意没有后缀，nginx镜像默认服务器的目录在/usr/share/nginx/html，内容如下：
build项目：
Build完成后会生成dist目录
然后在vueProject根目录下打开命令行执行如下命令生成镜像：
注意最后是一个点，代表在当前目录执行Dockerfile
如果没报错说明执行成功，此时可以在docker镜像列表看到该镜像。
启动镜像：
—name vp 代表自定义启动的镜像名称
-dp 是-d,-p的简写
8088:80 代表在宿主机的8088端口映射镜像的80端口，因为nginx默认的服务器端口就是80
最后就是之前生成的镜像名称。
大功告成。
更多详情：javascript技术分享
Ⅶ 怎么把VUE项目部署到服务器上面
1.使用xshell登录到阿里云服务器。安装nginx（本文安装到/etc下）
[plain]view plain
cd/etc
apt-getupdate
apt-getinstallnginx
vim/etc/nginx/nginx.conf
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;
}
}
}
assetsPublicPath:'/test1/',
exportdefaultnewRouter({
base:'/test1/',//添加这行
linkActiveClass:'active',
routes
});
consturl='/datas/seller';
this.$http.get(url).then((response)=>{
.....
});
servicenginxstart
2.首先先配置nginx，然后再根据配置文件做下一步操作
打开/etc/nginx/nginx.conf文件
[plain]view plain
在nginx.conf中配置如下：
[plain]view plain
接下来就根据配置文件进行下一步工作。配置文件中的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
如果用到了vue-router，则修改/router/index.js
[javascript]view plain
6.nginx配置文件中的location则是针对跨域处理，表示把对/datas的请求转发给http://ip:port,本文中这个http://ip:port下就是需要的数据，例如http://ip:port/seller,在本地项目文件中ajax请求数据的地方如下
[javascript]view plain
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
9.至此项目部署成功，在浏览器下输入: http://ip/test1/index.html 即可
Ⅷ vue如何将项目部署到服务器上并且使外网能够访问到
你的服务器是什么系统啊 ，，，linux LINUX、WINDOWS、NETWARE、UNIX。。
在linux
首先服务器安装node git nginx vue-cli
安装好nginx 用你的公网ip访问就可以看到 下面的页面
这就可以了
还有 用express 部署这个 简单些
Ⅸ 如何打包vue项目加node.js后端到云服务器
在命令行输入npm run build:prod，等待打包完成
项目目录下就会多出一个dist文件夹，里面有index.html文件和static文件夹，
直接上传到服务器上就行了
Ⅹ vuejs怎么在服务器部署
用vue-cli搭建的做法
1、npm run build
2、把dist里的文件打包上传至服务器 例 /data/www/，我一般把index.html放在static里
所以我的文件路径为：
/data/www/static
|-----index.html
|-----js
|-----css
|-----images
....
3、配置nginx监听80端口， location /static alias 到 /data/www/static，重启nginx
location /static {
alias /data/www/static/;
}
4、浏览器访问即可