customize-cra
const { override, fixBabelImports, addLessLoader, useBabelRc } = require('customize-cra');
const rewireReactHotLoader = require('react-app-rewire-hot-loader');
const addCustomize = () => (config, env) => {
config.output.publicPath = process.env.NODE_ENV === 'production' ? '' : '/';
config = rewireReactHotLoader(config, env); // 熱更新
return config;
}
require('./color.js')
module.exports = override(
fixBabelImports('import', {
libraryName: 'antd',
libraryDirectory: 'es',
style: true,
}),
addLessLoader({
javascriptEnabled: true,
modifyVars: { '@primary-color': '#1DA57A' },
}),
addCustomize(), // 自行配置
useBabelRc() // 開(kāi)啟 .babelrc
);
create-react-app 支持 reflect-matadata
- 發(fā)現(xiàn)這個(gè)東西 不支持 元數(shù)據(jù)反射 導(dǎo)致項(xiàng)目里面的依賴注入失效
__解決__ - 1腿时、開(kāi)啟 .babellrc
- 2、添加插件
- 3批糟、添加以下代碼
{
"plugins": [
"babel-plugin-transform-typescript-metadata",
["@babel/plugin-proposal-decorators", { "legacy": true }],
["@babel/plugin-proposal-class-properties", { "loose": true }]
],
"presets": [
"@babel/preset-typescript"
]
}
線上環(huán)境 組件的 displayName 消失了
- 自己寫的動(dòng)態(tài)打開(kāi)組件的方法，線上環(huán)境不能正常關(guān)閉組件
- 原因是打包后的
displayName都被干掉了
__解決__
babel增加以下配置
https://www.npmjs.com/package/babel-plugin-add-react-displayname
線上二級(jí)路由出現(xiàn)空白頁(yè)
- 公司每個(gè)項(xiàng)目放到了一個(gè)單獨(dú)的docker容器里面盛末，文件資源是容器里面的根目錄，
- 資源路徑換成絕對(duì)路徑就解決了
- config.output.publicPath = '/'
