背景:
使用create-react-app搭建React开发环境后,添加config-overrides.js文件,并修改package.json中对应命令后,执行
npm start// config-overrides.js
var path = require('path')
const rewireWebpackBundleAnalyzer = require('react-app-rewire-webpack-bundle-analyzer')
const { injectBabelPlugin } = require('react-app-rewired') // 安装babel-plugin-import插件(按需加载组件代码及样式的babel插件)
const rewireLess = require('react-app-rewire-less')
const theme = require('./theme')
module.exports = function override(config, env) {
config.resolve.alias['@Components'] = resolve('src/components')
config.resolve.alias['@Page'] = resolve('src/page')
config.resolve.alias['@Services'] = resolve('src/services')
config.resolve.alias['@Store'] = resolve('src/store')
config.resolve.alias['@Utils'] = resolve('src/utils')
// 自定义主题
config = injectBabelPlugin(
['import', { libraryName: 'antd', libraryDirectory: 'es', style: true }], // change importing css to less
config
)
config = rewireLess.withLoaderOptions({
modifyVars:theme,
javascriptEnabled:true
})(config,env)
return config
}// package.json
...
"scripts": {
"start": "react-app-rewired --max_old_space_size=4096 --optimize_for_size start",
"build": "cross-env NODE_ENV=production && react-app-rewired --max_old_space_size=4096 build",
"lint": "eslint --fix src && prettier --write \"src/**/*.js\"",
"test": "react-app-rewired test --env=jsdom"
},
...
发报Erroe:Cannot find module 'react-scripts/package.json':
问题点:
缺少react-scripts插件
解决方案:
安装react-scripts插件
npm install --save react-scripts
版权声明:本文为qq_38054239原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。