Electron Vue 脚手架 pnpm vite如何使用
时间: 2024-05-05 21:22:44 浏览: 224
vite-vue-admin::party_popper::party_popper:使用Vite + Vue3 + TypeScript + Element-plus + Mock开发的后台管理系统:party_popper::party_popper:
首先,Electron Vue 脚手架使用 pnpm 作为默认的包管理工具,可以通过以下命令安装:
```
npm install -g pnpm
```
接下来,使用 pnpm 安装依赖:
```
pnpm install
```
然后,如果要使用 Vite 作为开发服务器,需要进行一些配置。
首先,安装 Vite:
```
pnpm install vite --save-dev
```
然后,在 `package.json` 文件中添加以下配置:
```json
{
"scripts": {
"dev": "vite",
"build": "vite build"
}
}
```
最后,在项目根目录创建一个 `vite.config.js` 文件,添加以下配置:
```javascript
const { defineConfig } = require('vite')
module.exports = defineConfig({
server: {
port: 3000 // 修改端口号
}
})
```
现在,可以通过以下命令启动开发服务器:
```
pnpm run dev
```
注意,使用 Vite 时,需要在 `index.html` 文件中手动引入所有需要的依赖,例如:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Electron Vue App</title>
</head>
<body>
<div id="app"></div>
<script src="/node_modules/vue/dist/vue.js"></script>
<script src="/node_modules/vue-router/dist/vue-router.js"></script>
<script src="/src/renderer/main.js"></script>
</body>
</html>
```
最后,可以使用以下命令构建应用程序:
```
pnpm run build
```
阅读全文