Quasar CLI 带 Webpack - @quasar/app-webpack
强烈建议使用代码 linter（如 ESLint）以确保代码的可读性。它还能帮助您在运行代码之前捕获一些错误。
当您搭建 Quasar 项目文件夹时，它会询问您是否需要 linter 以及您想要为 ESLint 使用哪种设置
将创建两个点文件
- .eslintrc.cjs – ESLint 配置，包括规则
- .eslintignore – ESLint 在 linting 时应忽略的内容
可以进一步扩展上述 Eslint 设置中的一个。默认情况下，您的项目将使用 eslint-plugin-vue 处理您的 Vue 文件。请快速查看 .eslintrc.cjs 并注意它
extends: [
// https://eslint.vuejs.ac.cn/rules/#priority-a-essential-error-prevention-for-vue-js-3-x
// consider switching to `plugin:vue/strongly-recommended` or `plugin:vue/recommended` for stricter rules.
'plugin:vue/strongly-recommended'
]content_paste
如果您在创建项目文件夹时选择了 ESLint，您还会注意到 /quasar.config 文件为您将 eslint-loader 添加到 Webpack 配置中
build: {
chainWebpack (chain) {
chain.plugin('eslint-webpack-plugin')
.use(ESLintPlugin, [{ extensions: [ 'js', 'vue' ] }])
}
}content_paste
Lint 规则
可以移除、更改或添加 linting 规则。请注意一些事项
- 一些规则用于 Standard、Airbnb 或 Prettier 标准（您在创建项目时选择的标准）。例如：‘brace-style’。
- 一些规则用于 eslint-plugin-vue。例如：‘vue/max-attributes-per-line’。
您可以先访问 https://eslint.org.cn/docs/rules/ 或 https://eslint.vuejs.ac.cn/rules 来添加/移除/更改规则。
以下是 ESLint 规则的示例
'rules': {
'brace-style': [2, 'stroustrup', { 'allowSingleLine': true }],
'vue/max-attributes-per-line': 0,
'vue/valid-v-for': 0,
// allow async-await
'generator-star-spacing': 'off',
// allow paren-less arrow functions
'arrow-parens': 0,
'one-var': 0,
'import/first': 0,
'import/named': 2,
'import/namespace': 2,
'import/default': 2,
'import/export': 2,
'import/extensions': 0,
'import/no-unresolved': 0,
'import/no-extraneous-dependencies': 0,
// allow debugger during development
'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0
}content_paste
禁用 Linter
为了以后禁用 ESLint，您只需从 /quasar.config 文件中注释掉（或删除）以下代码
build: {
chainWebpack (chain) {
/*
* we comment out this block
*
chain.plugin('eslint-webpack-plugin')
.use(ESLintPlugin, [{ extensions: [ 'js', 'vue' ] }])
*/
}
}content_paste