vue全家桶之（一）使用 vue-cli 创建模板项目

        最近学习vue，学的我是头昏脑涨，作为一个前端萌新选手，前端大佬无疑是我现在的目标，那么脚踏实地，记录一点一滴，我觉得是我现在有必要做的，前几天公司做大屏，我被echarts搞的要眼瞎，但还好，都挺过来了，前几篇里介绍了echarts里面的圆环，个人觉得还是比较详细，还是有借鉴之处，都是自己走过的坑。

        之前面试其他公司面试官问过我一个问题，react的运行环境怎么搭？

        我：**，还有问这个的（后来才知道面试官是个后端小哥，前端的东西他也实在是不知道问啥。要么就问我ajax）

        那么在这里，我觉得有必要记录记录vue怎么创建模板项目（vue-cli）

        vue-cli是vue官方提供的一种脚手架工具

        vue官网：https://cn.vuejs.org/v2/guide/installation.html（官网写的更详细，我萌新就不做过多介绍，来干货！）

        创建vue项目

    

    npm install -g vue-cli        //全局安装cli（node就不用说了，自己装）
   vue init webpack vue_demo     //vue_demo为创建的项目名称，前面固定写法
   cd vue_demo                   //进入到项目里
   npm install                   //下载依赖
   npm run dev                   //运行环境，npm start也可以 npm install -g vue-cli        //全局安装cli（node就不用说了，自己装）
   vue init webpack vue_demo     //vue_demo为创建的项目名称，前面固定写法
   cd vue_demo                   //进入到项目里
   npm install                   //下载依赖
   npm run dev                   //运行环境，npm start也可以

      还有就是如果想下载路由之类的，直接下载，还有什么axios啊，vuex啊，下就完了，这些在以后的文章里都会慢慢介绍，把我的经验和一些亲自踩过的坑都记录下来。

   npm install vue-router --save  

    --save参数的作用：在包配置文件 package.json 文件添加对应的配置-save参数的作用：在包配置文件 package.json 文件添加对应的配置

   

  模板项目结构（这只是最初搭建完的结构）

    |-- build : webpack相关的配置文件夹(基本不需要修改)
        |-- dev-server.js :通过 express 启动后台服务器
    |-- config: webpack相关的配置文件夹(基本不需要修改)
        |-- index.js: 指定的后台服务的端口号和静态资源文件夹
    |-- node_modules
    |-- src :源码文件夹
        |-- components: vue组件及其相关资源文件夹
        |-- App.vue:应用根主组件
        |-- main.js:应用入口 js
    |-- static:静态资源文件夹
    |-- .babelrc: babel 的配置文件
    |-- .eslintignore: eslint 检查忽略的配置
    |-- .eslintrc.js: eslint 检查的配置
    |-- .gitignore: git 版本管制忽略的配置
    |-- index.html: 主页面文件
    |-- package.json: 应用包配置文件

    |-- README.md: 应用描述说明的 readme 文件

        另外webstorm自带cmd（Terminal），就不用再shift+鼠标右键打开命令行了，webstorm中Alt+F12调出控制台直接npm run dev，然后访问访问: http://localhost:8080/  非常好用！、

        下期见，希望各位大佬批评指正。