创建一个vue3+uniapp+vite的项目
时间: 2023-11-25 21:42:58 浏览: 89
1. 首先安装 Node.js,可以从其官网下载对应的版本。
2. 安装 Vue CLI 4.x 版本,打开终端输入以下命令:
```
npm install -g @vue/cli
```
3. 创建项目,打开终端输入以下命令:
```
vue create my-project
```
其中,my-project 为你的项目名称。
4. 选择项目配置,根据需要选择配置,可以使用默认配置也可以手动配置。
5. 安装 uniapp 和 vite,打开终端进入项目目录,输入以下命令:
```
npm install uniapp
```
```
npm install vite
```
6. 配置 vite,打开项目根目录下的 vite.config.js 文件,添加以下内容:
```
const { defineConfig } = require('vite')
const vue = require('@vitejs/plugin-vue')
module.exports = defineConfig({
plugins: [vue()],
resolve: {
alias: {
'@': path.resolve(__dirname, './src')
}
},
server: {
port: 8080,
open: true
}
})
```
其中,plugins 是插件配置,resolve 是别名配置,server 是启动服务器的配置。
7. 修改 package.json 文件,添加以下内容:
```
"scripts": {
"serve": "vite",
"build": "vite build"
}
```
其中,serve 是启动开发服务器的命令,build 是打包命令。
8. 运行项目,打开终端输入以下命令:
```
npm run serve
```
9. 在浏览器中访问 http://localhost:8080,查看项目是否正常运行。
至此,一个 vue3 uniapp vite 的项目就创建完成了。
阅读全文