vue-cli 配置vue项目环境笔记

笔记本很久没有更新node了,结果这次配置环境,竟然一波三折

Node,npm版本太久,导致webpack, vue-cli安装失败

  • 解决办法:更新node.js,
  • 更新npm命令:npm intall -g npm

接下来就是一帆风顺的时刻,安装webpack:

  • 命令:npm intall webpack -g

安装 vue-cli 脚手架

  • npm install --global vue-cli
  • 安装完成,vue -V可以查看vue版本(V是大写)

    新建文件夹 test,使用vue-cli构建一个vue项目

  • 执行命令 vue init webpack test
    接下来,会被询问一系列的操作,如下:

  1. ? Project name lnews
  2. ? Project description A Vue.js project
  3. ? Author 看着黎明丶庆幸 xanwidtf@foxmail.com
  4. ? Vue build standalone
  5. ? Install vue-router? Yes
  6. ? Use ESLint to lint your code? Yes? Pick an ESLint preset Standard
  7. ? Set up unit tests Yes
  8. ? Pick a test runner jest
  9. ? Setup e2e tests with Nightwatch? Yes
  10. ? Should we run npm install for you after the project has been created? (recommended) npm

最后,经过漫长的等待,安装完毕:
1411662-20191119215832164-804713958.png

如图所示,cd Lnews进入项目文件夹,npm run dev运行项目
1411662-20191119220009497-417179547.png

浏览器输入:localhost:8080 查看效果

1411662-20191119220110401-2010813898.png

END

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

人生莫如饥荒

如果对您有帮助,也可以给点赏钱

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值