Umi: 请问在umi中如何增加eslint-loader实现代码动态检测？

[luoboding]

我已经参照官网提示在.umirc.js中增加对chainWebpack的配置：

chainWebpack(config, { webpack }) {
    config.module
      .rule('lint')
      .test(/\.js$/)
      .pre()
      .include
      .add('src')
      .end()
    // Even create named uses (loaders)
      .use('eslint')
      .loader('eslint-loader')
      .options({
        rules: {
          semi: 'off'
        }
      });
  },

但是在执行yarn start的时候 并没有动态的检测eslint的error. 求帮助..

[luoboding]

问题已经解决了. 配置的问题.
`const path = require('path');
const fs = require('fs');
// ref: https://umijs.org/config/
const eslintFormatter = require('react-dev-utils/eslintFormatter');

const appDirectory = fs.realpathSync(process.cwd());
const resolveApp = relativePath => path.resolve(appDirectory, relativePath);

export default {
plugins: [
// ref: https://umijs.org/plugin/umi-plugin-react.html
['umi-plugin-react', {
antd: true,
dva: true,
dynamicImport: false,
title: 'post-management-frontend',
dll: false,
routes: {
exclude: [],
},
hardSource: false,
}],
],
chainWebpack(config, { webpack }) {
config.module
.rule('lint')
.test(/.(js|jsx|mjs)$/)
.pre()
.include
.add(resolveApp('src'))
.end()
// Even create named uses (loaders)
.use('eslint')
.loader(require.resolve('eslint-loader'))
.options({
formatter: eslintFormatter,
eslintPath: require.resolve('eslint'),
});
},
theme: "./src/utils/theme.js",
}
`
关掉了哈.

[Spaceman007]

在 npm-scripts 中配钩子也可以

{
  "scripts": {
     "prebuild": "eslint src",
     "build": "umi build"
  }
}

[luoboding]

@Spaceman007 是的 但是这样的话，不能在代码编写的时候动态提示一些eslint的错误了.

[ChieveiT]

问题已经解决了. 配置的问题.
`const path = require('path');
const fs = require('fs');
// ref: https://umijs.org/config/
const eslintFormatter = require('react-dev-utils/eslintFormatter');

const appDirectory = fs.realpathSync(process.cwd());
const resolveApp = relativePath => path.resolve(appDirectory, relativePath);

export default {
plugins: [
// ref: https://umijs.org/plugin/umi-plugin-react.html
['umi-plugin-react', {
antd: true,
dva: true,
dynamicImport: false,
title: 'post-management-frontend',
dll: false,
routes: {
exclude: [],
},
hardSource: false,
}],
],
chainWebpack(config, { webpack }) {
config.module
.rule('lint')
.test(/.(js|jsx|mjs)$/)
.pre()
.include
.add(resolveApp('src'))
.end()
// Even create named uses (loaders)
.use('eslint')
.loader(require.resolve('eslint-loader'))
.options({
formatter: eslintFormatter,
eslintPath: require.resolve('eslint'),
});
},
theme: "./src/utils/theme.js",
}
`
关掉了哈.

配置有点乱，我自己实测，主要是include的路径要注意，其他改动都不是必须的，这里说一下，方便后来者看出区别。