非enject create-react-app2.+ webp

2019-09-27  本文已影响0人  EasonChan94

1.安装 react-app-rewired 和 customize-cra;
2.项目根目录添加config-overrides.js进行配置,具体配置如下:

const { override, fixBabelImports, addLessLoader, addWebpackAlias, addDecoratorsLegacy, addWebpackPlugin } = require('customize-cra');
const path = require("path");
const WebpackBuildNotifierPlugin = require('webpack-build-notifier');
module.exports = override(
    addDecoratorsLegacy(), // es7装饰器配置
    fixBabelImports('import', {
        libraryName: 'antd',
        libraryDirectory: 'es',
        style: 'css',
    }),
    addLessLoader({
        strictMath: true,
        noIeCompat: true,
        localIdentName: '[local]--[hash:base64:5]' // if you use CSS Modules, and custom `localIdentName`, default is '[local]--[hash:base64:5]'.
    }),
    addWebpackAlias ({
        ["@"]: path.resolve(__dirname, "./src"),
        ["@views"]: path.resolve(__dirname, "./src/views"),
        ["@components"]: path.resolve(__dirname, "./src/components"),
        ["@assets"]: path.resolve(__dirname, "./src/assets"),
        ["@data"]: path.resolve(__dirname, "./src/data"),
        ["@service"]: path.resolve(__dirname, "./src/service"),
        ["@stores"]: path.resolve(__dirname, "./src/stores"),
        ["@utils"]: path.resolve(__dirname, "./src/utils")
    }),
    // build notifie of completed
    addWebpackPlugin(new WebpackBuildNotifierPlugin({
        title: "completed",
        logo: path.resolve(__dirname, "./src/antminer_logo.png"),
        suppressSuccess: true
    }))
);

3.修改package.json scripts

"scripts": {
    "start": "react-app-rewired start",
    "build": "react-app-rewired build",
    "test": "react-app-rewired test",
    "eject": "react-scripts eject"
  },
上一篇下一篇

猜你喜欢

热点阅读