手把手教你如何创建vue脚手架项目(最详细!)

Vue-cli安装流程以及部分npm命令

  1. 百度Node.js下载并安装
  2. 可以一直下一步 但是要记住安装目录
  3. 进入安装目录即Node.js文件夹内
  4. 按住shift+鼠标右键
  5. 选择在此处打开命令窗口
  6. 输入node -v//检查node版本至少为4以上
  7. 输入npm config set registry http://registry.npm.taobao.org
  8. 输入npm install vue-cli -g//在全局安装vue-cli的依赖
  9. 安装完毕后输入vue检查vue是否安装完毕
  10. 输入vue list查看可安装的vue模板
  11. 输入vue init webpack XXX//创建模板为webpackvue项目名字为XXX
  12. Project name XXX//项目名
  13. Project desrciption XXX XXX//项目描述
  14. Author //创建者的名字/邮箱(可不填)
  15. 以下选项输入Y/N
  16. UseESLint to lint your code?//是否启用ESLint语法检查(推荐N)
  17. Pick an ESlint preset//填N
  18. Setup unit tests with Karma + Mocha?//是否启用单元测试(填N)
  19. Setup e2e tests with Nightwatch//填N
  20. 按提示输入cd XXX进入当前目录下(即项目目录)
  21. 输入npm install 安装项目模块依赖(较久)
  22. 安装完成
  23. 输入npm run dev //运行项目

Mac

因为系统原因
需要本机最高权限即电脑锁屏密码
安装任何软件时需要在前面加上sudo
sudo npm install vue-cli -g
否则将会报权限不足的错误

Error: EACCES: permission denied, access '/usr/local/lib/node_modules' npm ERR! at Error (native)

npm指令

  • npm -v查看npm版本
  • npm install npm -g安装npm至全局(windows)
  • cnpm install npm -g使用国内镜像安装npm至全局
  • npm run dev运行项目
  • npm run build打包项目

版权声明:本文为Baitgt原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。