Webpack + eslint 替换 linting 上的源更改

Question

运行在 webpack 开发服务器上带有一个字符串替换插件，该插件基于 on a function 进行替换。我发现替换值覆盖了我的源文件。

我的开发服务器配置是这样的：

const devServer = (options) => {
  return {
    devServer: {
      hot: true,
      inline: true,
      stats: 'errors-only',
      host: options.host,
      port: options.port,
      historyApiFallback: true
    },
    plugins: [
      new webpack.HotModuleReplacementPlugin({
        multiStep: true
      })
    ]
  }
}

字符串替换插件配置为：

  const constants = (data) => {
    return {
      module: {
        loaders: [
          {
            test: /\.jsx?$/,
            loader: StringReplacePlugin.replace({
              replacements:[
                {
                  pattern:/\`CONSTANT_(.*)\`/g,
                  replacement:(match,p1,offset,string)=>{
                    console.log('MATCH '+p1)
                    const keys = p1.split('.')
                    let current = data
                    keys.forEach((key)=>{
                      current = current[key]
                    })
                    console.log('Replacing '+p1+' with '+current)
                    return `'${current}'`
                  }
                }
              ]
            })
          }
        ]
      },
      plugins: [
        new StringReplacePlugin()
      ]
    }
  }

entry/ouptut 值为：

const base = {
  entry: {
    app: path.resolve(PATHS.app, './index.jsx')
  },
  output: {
    path: PATHS.build,
    filename: 'app.js',
    publicPath: '/'
  },
  resolve: {
    extensions: ['', '.js', '.jsx', '.json']
  }
}

Webpack 开发服务器会更改源上的文件有什么原因吗？

编辑：1 添加了 JS 部分：

const js = (paths) => {
  const cacheDir = (process.env.CACHE_DIRECTORY ? process.env.CACHE_DIRECTORY : 'true')
  return {

    module: {
      loaders: [
        {
          test: /\.jsx?$/,
          exclude: /(node_modules|bower_components)/,
          loaders: [
            `babel?cacheDirectory=${cacheDir}`, // presets on .babelrc
            'eslint-loader?fix'
          ],
          include: paths
        }
      ]
    }
  }
}

编辑 2 原因似乎是 eslint-loader?fix，删除后会实现适当的行为。现在我正在寻找如何防止这种情况发生

Answer 1

在每次更改之前放置 eslint-loader?fix 可以防止这种情况发生。

Webpack + eslint 替换 linting 上的源更改

Webpack + eslint replace source change on linting

javascript

ecmascript-6

webpack-dev-server