dva(react)修改webpack配置@指向src项目上使用dva，但是一直配置webpack无效，新增webpac

项目上使用dva，但是一直配置webpack无效，新增webpack.config.js也会报错，原因是dva虽然使用了webpack，但它经过了roadhog进行配置化操作，因此部分webpack的配置会导致无效。比如平时通过配置resolve>alias的方式来处理@指向src就无法实现，因为roadhog本身的配置项只有：

{
  "entry": "src/index.js",
  "disableCSSModules": false,
  "less": false,
  "publicPath": "/",
  "extraBabelPlugins": [],
  "autoprefixer": null,
  "proxy": null,
  "env": null,
}

所以能在 .webpackrc 中添加的配置字段也只有以上这些。

解决方法

根目录下新建 webpack.config.js：

const path = require('path');

export default (webpackConfig, env) => {
  // Add alias
  webpackConfig.resolve.alias = {
    ...webpackConfig.resolve.alias,
    '@': path.resolve(__dirname, 'src')
  };

  return webpackConfig;
};

然后修改 package.json 的webpack配置应用文件：

{
    "scripts": {
        "start": "set PORT=9000 && roadhog server --config ./webpack.config.js",
        "build": "roadhog build --config ./webpack.config.js",
    },
}

到此解决！