创建vue3项目-使用@vue/cli和vite

本文档介绍了在安装Node.js和Vue CLI后,如何创建并启动Vite及Vue CLI项目。在过程中可能遇到的错误,如路径包含空格导致的npm安装失败和权限问题,提供了解决方案。通过修改npm缓存路径和以管理员权限运行命令行来解决问题,确保项目创建成功。
摘要由CSDN通过智能技术生成

一、安装

安装node.js 和安装脚手架(npm install -g @vue/cli)

二、创建项目-使用vite 

npm create vite@latest my-vue-app  //my-vue-app是项目名

npm i  安装依赖

npm run dev 启动服务

遇到报错:

npm ERR! Could not install from "Files\nodejs\node_cache\_npx\13472" as it does
not contain a package.json file.

原因:因为 node_cache 路径中有空格。

解决:

执行:  npm config get cache

结果为: D:\Program Files\nodejs\node_cache

输入:npm config set cache "D:\Program~1\nodejs\node_modules\npm\node_cache"--global 即可

三、创建项目-使用vue-cli

1.项目文件下,命令行输入

vue create 项目名称 

2.选择手动创建项目

3.选中vue-router,vuex,css Pre-processors选项

4.选择vue3.0版本

5.选择hash模式的路由

6.选择less作为预处理器

7.选择 standard 标准代码风格

8.保存代码校验代码风格,代码提交时候校验代码风格

9.依赖插件或者工具的配置文件分文件保存

10.是否记录以上操作,选择否

11.最后安装成功

遇到报错:

npm ERR! Error: EPERM: operation not permitted, open 'C:\Program Files\nodejs\node_cache\XXX

解决:要在管理员权限下进行创建项目

管理员运行,进入E盘
C:\Windows\system32>E:
切换到项目文件下
E:\>cd web-project

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值