vue安装、打包、发布

一.安装：

打开cmd命令行依次输入下面命令：

1. npm install -g @vue/cli
2. vue create vue-demo(项目名)
3. 运行项目 npm run serve

二.打包：

在vscode打开终端输入以下命令：

npm run build

打包成功后会生成一个dist文件夹：

三.发布：

发布有多种方式，现在介绍两种：

1.express

打开vscode，新建一个文件夹（例如：vuetest），把打包好的dist文件夹放到vuetest目录下，打开终端，输入以下命令安装express：

npm install express body-parser --save

安装好后创建一个app.js文件，输入：

运行以下命令即发布成功：

node app.js

2.nginx

a.下载nginx

http://nginx.org/en/download.html? ? ?,下载后解压，解压后如下:

b.把打包好的dist文件夹放到html目录下

c.修改nginx配置

打开nginx目录下的、conf文件夹下的nginx.conf文件

进行配置：

d.启动nginx：

有很多种方法启动nginx

(1)直接双击nginx.exe，双击后一个黑色的弹窗一闪而过

(2)打开命令窗口，切换到nginx解压目录下，输入命令 nginx.exe 或者 start nginx ，回车即可

tips:可以在cmd命令窗口输入命令 tasklist /fi "imagename eq nginx.exe" ，出现如下结果说明启动成功

测试，打开浏览器输入localhost, 注意端口号必须要跟nginx上面配置一样