Vue脚手架vue-cli,亲测搭建成功

使用vue-cli需要的知识（如果你使用软件一键生成，可以不用）

• vue使用时需要webpack和npm推荐进行如下学习（推荐先往下看，等遇见不懂的，来这两个教程里针对性学习）
  • 在此教程里学会使用npm即可：https://blog.youkuaiyun.com/grd_java/article/details/105307177
  • 在此教程中，掌握webpack基本用法即可（不用全学完），这里解决了webpack报错，让你少走弯路（大量vue初学者，被webpack搭建不成功劝退）：https://blog.youkuaiyun.com/grd_java/article/details/105397169
  • 不会vue语法请看这个：https://blog.youkuaiyun.com/grd_java/article/details/105416764

供日后查阅

命令

• npm install vue-cli --save：安装脚手架到局部
• npm run vue：查看版本信息
• npm run vue init webpack：基于webpack安装vue
• npm run build：打包项目

代码块

• package.json

    {
    	"name": "testVueCli",
    	"version": "1.0.0",
    	"scripts": {
    		"test": "echo \"Error: no test specified\" && exit 1",
    		"vue":"vue",
    		"vue init webpack":"vue init webpack"
    	},
    }
  

安装vue-cli（使用npm）

• 使用软件HBuilderX创建目录（此软件可以直接创建脚手架项目，但此教程从零开始搭建），并创建一package.json文件
• 打开终端输入命令 npm install vue-cli --save
• 配置命令并运行
• 当不再使用时，可以快捷键ctrl+c关闭

脚手架目录配置解析

打包发布项目

• 编写完项目后，使用命令打包：npm run build
• 之后将项目发布到服务器或者交给后端编写后台即可