vue安装、打包、发布

发布时间:2024年01月17日

一.安装:

打开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上面配置一样

文章来源:https://blog.csdn.net/a646796992/article/details/135649783
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。