vue参考---vue-cli介绍

一、总结

一句话总结：

vue-cli实质是一个vue前端模板项目：vue init webpack vue_demo 相当于从 https://github.com/vuejs-templates 下载vue模板项目中的webpack项目

1、vue-cli的实际作用是什么？

vue-cli实质是一个vue前端模板项目：vue init webpack vue_demo 相当于从 https://github.com/vuejs-templates 下载vue模板项目中的webpack项目

2、vue-cli如何安装？

npm install -g vue-cli：就是普通的npm安装插件的方式，-g是全局而已

3、vue-cli安装好了的标志？

可以直接在命令行输入vue，或者vue -V查看vue的版本

4、如何使用vue-cli创建vue项目？

1、安装vue-cli：npm install -g vue-cli

2、下载webpack项目：vue init webpack vue_demo

3、运行项目：npm run dev

npm install -g vue-cli
vue init webpack vue_demo
cd vue_demo
npm install
npm run dev
访问:http://localhost:8080/

5、vue-cli 2.x 创建的 Official Templates？

比如webpack - A full-featured Webpack + vue-loader setup with hot reload, linting, testing & css extraction.

Current available templates include:
webpack - A full-featured Webpack + vue-loader setup with hot reload, linting, testing & css extraction.
webpack-simple - A simple Webpack + vue-loader setup for quick prototyping.
browserify - A full-featured Browserify + vueify setup with hot-reload, linting & unit testing.
browserify-simple - A simple Browserify + vueify setup for quick prototyping.
pwa - PWA template for vue-cli based on the webpack template
simple - The simplest possible Vue setup in a single HTML file

6、vue-cli版本更替？

Vue CLI 的包名称由 vue-cli 改成了 @vue/cli。如果你已经全局安装了旧版本的 vue-cli (1.x 或 2.x)，你需要先通过 npm uninstall vue-cli -g 或 yarn global remove vue-cli 卸载它。

7、npm run dev 和 npm start的关系？

package.json里面，可以看到这两个是一样的："start": "npm run dev"

"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
"start": "npm run dev",

8、使用前端框架的最直接的好处是什么？

一个页面对应的html、js、css在一个页面，这就非常方便了

二、vue-cli介绍

博客对应课程的视频位置：