代码检验

你可能有疑问，在 .vue 文件中你怎么检验你的代码，因为它不是 JavaScript。我们假设你使用 ESLint (如果你没有使用话，你应该去使用！)。

你还需要官方的 eslint-plugin-vue，它支持同时检查你 .vue 文件中的模板和脚本。

请确保在你的 ESLint 配置中使用了该插件自身的配置：

  1. {
  2.   "extends": [
  3.     "plugin:vue/essential"
  4.   ]
  5. }

在命令行这样使用：

  1. eslint --ext js,vue MyComponent.vue

别一种方法是使用 eslint-loader，这样你的 .vue 文件会在开发期间每次保存时自动检验。

  1. npm install eslint eslint-loader --save-dev

请确保它应用在了 pre-loader 上：

  1. // webpack.config.js
  2. module.exports = {
  3.   // ... other options
  4.   module: {
  5.     rules: [
  6.       {
  7.         enforce: 'pre',
  8.         test: /\.(js|vue)$/,
  9.         loader: 'eslint-loader',
  10.         exclude: /node_modules/
  11.       }
  12.     ]
  13.   }
  14. }

原文: https://vue-loader-v14.vuejs.org/zh-cn/workflow/linting.html