vue.js + webpack + element UI项目构

仅供参考，图标插件使用echarts（电脑系统mac）
1 安装npm(下载node JS,终端检测：npm -v,node -v);
2 安装vue & vue-cli (npm install vue, npm install —global vue-cli )
3 创建项目 (vue init webpack projectName)
4 进入项目并启动（cd projectName,npm start serve<vue-cli 3 指令，可在readMe文件中查看>） 访问地址在启动成功后可查看
5 安装element UI （npm i element-ui -S <“S” <=> “save” >）
6 安装router （pm install vue-router）
7 安装 store (npm install vuex --save)
8 安装插件 echarts (npm install echarts --save)
9 项目文件配置（router/index.js :配置route ；main.js: 引入router、element ui、vuex、echarts）

10 ajax请求配置（使用axios）
npm install axios

调用方法：
- [ ] mounted () {
 axios
    .get('https://www.runoob.com/try/ajax/json_demo.json')
    .then(response => (this.info = response))
    .catch(function (error) {
        // 请求失败处理 console.log(error);
    });
}
- [ ] axios({
  method: 'post',
  url: '/user/12345',
  data: {
    firstName: 'Fred',
    lastName: 'Flintstone'
  }
});

注:安装需要获取管理员权限，在命令之前加上 sudo,回车后输入密码（mac保护，输入过程密码不可见< “·”或“*”都不会显示>）

附1：npm常用快捷键

---npm i 插件 ，会把插件安装到node_modules目录中，不会修改package.json,
---npm i 插件 --save (-S) ，项目发布上线之后还会依赖用到的插件，没有这些插件，项目不能运行
---自动更改package.json 写入dependencies 节点
---npm i 插件 -g是不会更改package中的内容 但是可以存在node_modules目录中
---没有package.json 还怎么开开心心的 clone呢
---npm i 插件 --save-dev(-D) ，安装到开发依赖中，项目上线之后不会用到的插件，例如'babel-loader',项目解析完发布
---自动更改package.json 写入devDependencies 节点

附2：iconfont 在VUE中的使用

    方法1
    main.js 引入 iconfont.css 文件；
    图标相关页面 span 中 class ="iconfont iconclassName"
    方法2
    main.js 引入 iconfont.js 文件；
    加入通用 CSS 代码（引入一次就行）：
    <style>
        .icon {width: 1em; height: 1em;  vertical-align: -0.15em;
         fill: currentColor;overflow: hidden;}
    </style>
    图标相关页面
    <svg class="icon" aria-hidden="true">
         <use xlink:href="#icon-xxx"></use>
    </svg>