cnpm run dev或npm run dev问题收集

#vue项目中遇到的问题

跟着 拯救地球好累丫的简书文章上的操作，遇到的问题

vue入门 | 使用vue.js2.0 + ElementUI开发后台管理系统详细教程（一）

vue入门 | 使用vue.js2.0 + ElementUI开发后台管理系统详细教程（二）

##1.解除端口占用方法

• 1.1首先点击开始菜单选择运行，接着在运行对话框中输入“cmd”，回车打开命令提示符窗口，然后在窗口中输入【netstat -ano】，按下回车，之后就会显示所有的端口占用情况。

C:\Users\Administrator>netstat -ano
活动连接
  协议  本地地址          外部地址        状态           PID
  TCP    0.0.0.0:135            0.0.0.0:0              LISTENING       880
  TCP    0.0.0.0:445            0.0.0.0:0              LISTENING       4
  TCP    0.0.0.0:902            0.0.0.0:0              LISTENING       4940
  TCP    0.0.0.0:912            0.0.0.0:0              LISTENING       4940
  TCP    0.0.0.0:1025           0.0.0.0:0              LISTENING       564
  TCP    0.0.0.0:1026           0.0.0.0:0              LISTENING       968
  TCP    0.0.0.0:1027           0.0.0.0:0              LISTENING       412
  TCP    0.0.0.0:1028           0.0.0.0:0              LISTENING       668
  TCP    0.0.0.0:1065           0.0.0.0:0              LISTENING       632
 TCP    [::1]:8080             [::1]:8080             ESTABLISHED     792

• 2.1如果你要查询指定的端口占用的话，可以在窗口中继续输入【netstat -aon|findstr "提示的端口"】，这里的提示的端口假设为8080，那么就输入命令为【netstat -aon|findstr "8080"】，

C:\Users\Administrator>netstat -ano|findstr "8080"
  TCP    [::1]:8080             [::1]:8080             ESTABLISHED     792

注意findstr后面有空格；

• 3.1然后根据查询的PID找到对应的进程，我么可以看到占有80这个程序的进程ID：792，继续输入命令【tasklist|findstr "792"】，792就是进程ID，现在知道是哪个进程占用的我们就可以采取相应措施进行解决了。

C:\Users\Administrator>tasklist|findstr "792"
QQ.exe                        5856 Console                    1    128,792 K
360se.exe                      792 Console                    1    132,752 K

##2.cnpm run dev 报错

• 2.1These dependencies were not found in node_modules

 ERROR  Failed to compile with 2 errors
These dependencies were not found in node_modules:
*ansi-html in ./~/.2.17.0@webpack-hot-middleware/client-overlay.js
*html-entities in ./~/.2.17.0@webpack-hot-middleware/client-overlay.js

因为package.json中"webpack-hot-middleware": "^2.16.1"，和运行的版本不一致导致，修改为“^2.17.0”，也不管用，运行

cnpm uninstall webpack-hot-middleware --save-dev

再运行

cnpm install webpack-hot-middleware@2.16.1 --save-dev

• 2.2error in ./src/main.js 检查main.js空行

 error  in ./src/main.js
  ✘  http://eslint.org/docs/rules/no-multiple-empty-lines  More than 1 blank line not allowed
  D:\download\backup\workspace\MyApp\Vuejs\my-project\src\main.js:6:1
   ^
✘ 1 problem (1 error, 0 warnings)
Errors:
 1  http://eslint.org/docs/rules/no-multiple-empty-lines
 @ multi ./build/dev-client ./src/main.js

src\main.js代码中：

<script>
  import Vue from 'vue'
  import Element from 'element-ui'
  import 'element-ui/lib/theme-default/index.css'
  Vue.use(Element)
  export default {
    name: 'app',
    data: function () {
      return {
        active: true
      }
    }
  }
</script>

• 2.3error in ./src/App.vue App.vue中<script>中必须含 import Vue from 'vue'

 error  in ./src/App.vue
✘  http://eslint.org/docs/rules/no-undef  'Vue' is not defined
  D:\download\backup\workspace\MyApp\Vuejs\my-project\src\App.vue:37:3
  Vue.use(Element)
     ^
✘ 1 problem (1 error, 0 warnings)
Errors:
  1  http://eslint.org/docs/rules/no-undef
 @ ./src/main.js 3:0-24
 @ multi ./build/dev-client ./src/main.js

src\main.js代码中：

// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import App from './App'
import router from './router'
/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,
  template: '<App/>',
  components: { App }
})

• 2.4关闭eslint检查，把不需要检查的文件名加到/.eslintignore文件中

转载于:https://my.oschina.net/u/2408149/blog/844620