最近在背單詞學(xué)英語,感覺市面上的單詞軟件都,所以打算自己寫一個移動端的web app網(wǎng)頁吧,用react+ant design瞎寫寫
利用create-react-app初始化項目后,看到package.json里面有下面的東西
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
}
很明顯,start就是跑起來,build就是打包,test是測試,eject查了一下,翻譯為彈射的意思,create-react-app會把webpack的配置封裝起來,eject就是反編譯,把那些全部釋放出來,獲得webpack的的控制權(quán),但是這是一個不可逆的操作,eject彈射了之后就不能恢復(fù)了,但是有時候確實需要修改或者是配置一些東西,于是衍生出了一些方法.
React-app-rewired方案
網(wǎng)上有響應(yīng)的配置方案,按照步驟設(shè)置好后就可以在config-overrides.js里面配置一些東西
例如我想引入less,用less去寫css還是十分方便的
/* config-overrides.js */
const { injectBabelPlugin } = require('react-app-rewired');
const rewireLess = require('react-app-rewire-less');
module.exports = function override(config, env) {
config = injectBabelPlugin(['import', { libraryName: 'antd', style: true }], config);
//添加了下面這一段
config = rewireLess.withLoaderOptions({})(config, env);
return config;
};
