nodejs前端初探，一些常见问题解决

1. 首先安装cnpm（由于 node很多三方依赖包是外国服务器，较慢），具体可参考：https://www.cnblogs.com/cythia/p/10985080.html

    使用阿里定制的cnpm命令行工具替代npm。安装：

    npm install -g cnpm --registry=https://registry.npm.taobao.org

    再进行单次使用安装（等到node_modules）：

    npm install --registry=https://registry.npm.taobao.org

2. vue项目工程运行：cnpm run dev

    前面的安装是安装了webpack框架中package.json中所需要的依赖；安装完成后，需要启动整个项目运行，cnpm run其实执行了package.json中的script脚本，cnpm run dev的执行可查找package.json script中的"dev"部分

3. 样式处理，局部样式（设置鼠标形状、颜色等）

<template>

  <div>

    <li>

      ...

    </li>

  </div>

</template>

 <style lang="scss" scoped>
  li {
   padding: 7px 15px;
   border-bottom: 1px solid #E4E7ED;
   cursor: pointer;
   list-style: none;
   color: #505458;

   &:hover {
    background-color: rgba(0, 0, 0, 0.07);
   }
  }
  li.active {
   /*注意这个是.不是冒号:*/
   background-color: rgba(0, 0, 0, 0.1);
  }
</style>

4. 绘图，使用echarts

1）在vue项目使用echarts碰到的问题是，在mounted()中不能触发图形显示，用console.log打印显示取到id或者ref为undefined（使用douument.getElementById()和this.$refs.都如此）：

    F12进去查看到：

     “TypeError: Cannot read property 'getAttribute' of null

      at zi (echarts.min.js:22)..."

     经检查发现，该图形是写在一个modal中，默认是不显示状态，也就是这个div是undefined的；

     将图形显示的调用从mounted移致updated()中，问题解决。

2）导入echarts方式也会有影响

      import echarts from 'echarts/lib/echarts'

      会提示“Error in updated hook: "Error: Componet series.line not exists. Load it first."

     改为：

     import echarts from 'echarts'