标签:div add 相关配置 geo import path config 按需加载 rewrite
1.需要引入 react-app-rewired与customize-cra包配合使用
npm install react-app-rewired customize-cra
2.在src目录下创建config-overrides.js文件
module.exports = function override(config, env) {
// 关于webpack的相关配置
return config;
};
3.引入antd框架按需加载
npm install babel-plugin-import
3.1 在config-overrides.js里配置
const {override,fixBabelImports} = require(‘customize-cra‘)
module.exports = override(
/**
* @Descripttion: 按需加载antd
* @param {type}
* @return:
*/
fixBabelImports("import",{
libraryName:"antd",
libraryDirectory:‘es‘,
style:‘css‘,
}),
)
4.引入less配置
npm install less less-loader
4.1 在config-overrides.js里配置
const {override,fixBabelImports,addLessLoader} = require(‘customize-cra‘)
module.exports = override(
/**
* @Descripttion: 按需加载antd
* @param {type}
* @return:
*/
fixBabelImports("import",{
libraryName:"antd",
libraryDirectory:‘es‘,
style:true,
}),
/**
* @Descripttion: 配置less
* @modifyVars: 主题配置
* @return:
*/
addLessLoader({
javascriptEnabled: true,
modifyVars: { ‘@primary-color‘: ‘#1DA57A‘ },
})
)
5. 解决跨域问题
npm install http-proxy-middleware
5.1 需要在src 目录下创建 setupProxy.js文件
const proxy = require(‘http-proxy-middleware‘)
module.exports = function(app) {
app.use(
proxy.createProxyMiddleware(‘/api‘, {
target: ‘http://xxxxx:12306/‘,
changeOrigin: true,
pathRewrite: {
‘^/api‘: ‘‘
}
})
)
}
react不适用npm run eject生成隐藏配置文件来配置
标签:div add 相关配置 geo import path config 按需加载 rewrite
原文地址:https://www.cnblogs.com/wangyisu/p/13195989.html