在/src目录下创建一个名为demo的应用
[root@localhost ~]# cd /src/
[root@localhost src]# npm create vue@latest
Vue.js - The Progressive JavaScript Framework
✔ 请输入项目名称： … demo
✔ 是否使用 TypeScript 语法？ … 否 / 是[直接回车即可]
✔ 是否启用 JSX 支持？ … 否 / 是[直接回车即可]
✔ 是否引入 Vue Router 进行单页面应用开发？ … 否 / 是[直接回车即可]
✔ 是否引入 Pinia 用于状态管理？ … 否 / 是[直接回车即可]
✔ 是否引入 Vitest 用于单元测试？ … 否 / 是[直接回车即可]
✔ 是否要引入一款端到端（End to End）测试工具？ › 不需要[直接回车即可]
✔ 是否引入 ESLint 用于代码质量检测？ … 否 / 是[直接回车即可]
正在构建项目 /src/demo...
项目构建完成，可执行以下命令：
cd demo
npm install
npm run dev
[root@localhost src]#
进入项目根目录，开始安装依赖
[root@localhost ~]# cd /src/demo/
[root@localhost demo]# npm install
added 28 packages, and audited 29 packages in 7s
4 packages are looking for funding
run `npm fund` for details
found 0 vulnerabilities
[root@localhost demo]#
修改项目配置文件
[root@localhost demo]# vim vite.config.js
import { fileURLToPath, URL } from 'node:url'
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// https://vitejs.dev/config/
export default defineConfig({
server: {
host: '0.0.0.0', // 允许任意客户端访问
port: 5173, // 服务端口号
cors: true, // 允许跨域请求
},
plugins: [
vue(),
],
resolve: {
alias: {
'@': fileURLToPath(new URL('./src', import.meta.url))
}
}
})
[root@localhost demo]#
启动服务器
[root@localhost demo]# npm run dev
> demo@0.0.0 dev
> vite
VITE v5.1.4 ready in 302 ms
➜ Local: http://localhost:5173/
➜ Network: http://192.168.*.*:5173/
➜ press h + enter to show help
在浏览器访问“http://192.168.*.*:5173/”看服务是否正常。