构建vue项目出错

第一步
1、 执行 npm install -g vue-cli 全局安装vue脚手架
2、执行vue init webpack '项目名称’初始化项目,产生报错
在这里插入图片描述
解决方案: (1) 先执行上面提示的命令 npm install -g @vue/cli-init
(2) 再重新全局安装脚手架 npm install -g vue-cli
(3) 初始化项目: npm init webpack ‘项目名称’
又出现报错:
在这里插入图片描述
然后就是各种百度,找解决方法:看了很多文章都说是安装nodejs的时候,环境变量的路径没有配置好。
解决方案:
以下是重新配置路径的具体操作
(1)确保nodejs已安装
(2)找到nodejs目录,我的是放在了D盘,如下
在这里插入图片描述
(3)修改全局路径,需要把默认的安装包路径改成nodejs里面这两个新建的文件

配置全局路径:npm config set prefix “C:\Program Files\nodejs\node_global”
配置缓存路径:npm config set cache “C:\Program Files\nodejs\node_cache”
(4) 修改系统的环境变量

桌面–> 我的电脑 --> 右击 属性 --> 高级系统设置 --> 环境变量(或者直接打开控制面板)
(系统变量)
在这里插入图片描述
(环境变量)
在这里插入图片描述
最后不要忘记点击确定
(5)全局安装webpack
npm install webpack -g
注意: 如果安装的是较高版本的webpack,(现在安装的版本都比较高),还需要安装webpack-cli
npm install webpack-cli -g
安装的时候可能有一些warn警告,不影响,只要安装好包就可以
安装之后你可以到nodejs的文件夹下看下是否有webpack包了
在这里插入图片描述
注意: 安装之后如果没关闭运行窗口,直接webpack-v,还是会报’webpack’不是内部或外部命令…,一定要把运行窗口关闭后,重新打开运行,项目中也是,先把运行窗口关闭在使用webpack的命令.我安装的时候没关闭窗口,结果一直报错,我删了安装了好几遍,坑死了


好了!!! 回归正题~~~~~~
第二步
初始化项目
vue init webpack ‘项目名称’
一路回车和yes
然后是漫长的等待过程在这里插入图片描述
出现下图就证明安装成功了
在这里插入图片描述
第三步
cd deno
npm run dev
在这里插入图片描述
运行链接,OK
在这里插入图片描述
项目构造完!!!

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值