vite快速安装vue，及项目打包发布

原文地址：https://mp.weixin.qq.com/s/xdEqyhfmW8P0R_wktymb3w

vite快速安装vue，及项目打包发布

1.下载、安装VScode，下载地址：https://code.visualstudio.com/

2.下载、安装node.js，国内下载地址：http://www.nodejs.com.cn/

3.创建空文件夹，用VScode打开，在左侧空白处点击鼠标右键，选择在集成终端打开

*通过在终端命令行输入npm -v获取到版本号，说明node.js安装成功，npm可以使用。

4.输入命令：

yarn create vite my-vue-app --template vue

5.安装vite成功后，输入：

 cd my-vue-app

yarn 安装vue

6.成功后，  输入：

yarn dev 服务端启动vue

7.ctrl+鼠标点击打开项目地址：http://localhost:5173/

8.可以使用：

yarn run build 对项目进行打包

 

9.打包完的文件在dist目录下,注意：

1.有跨域保护，所以需要放到服务器下运行；

2.路径默认为服务器根目录，因此要添加相对路径。

解决方法：

在vite.config.js文件内，添加：base:'./'

修改完成再次使用：yarn run build，对项目进行打包即可。

发布的文件在dist文件夹内，添加到服务器即可查看。

另外也可以在vite.config.js中

可以使用下面命令添加vite服务器和端口号

 server:{
 
   host:'localhost',
 
   port:3000,
 
  },

如图：

可以通过配置的服务器以及端口号直接访问：

翻译

搜索

复制