你可能注意到在引入 React JS 到你的項(xiàng)目之后,給你的應(yīng)用重新合并會(huì)花費(fèi)太多的時(shí)間吃谣。在開(kāi)發(fā)環(huán)境中,最理想的是編譯最多 200 到 800 毫秒的速度,取決于你在開(kāi)發(fā)的應(yīng)用夏醉。
注意!這個(gè)是設(shè)置一個(gè)壓縮和發(fā)布的 React 版本涌韩,結(jié)果你可能會(huì)失去 propTypes 基礎(chǔ)類(lèi)型檢查畔柔!
為了不讓 Webpack 去遍歷 React JS 及其所有依賴(lài),你可以在開(kāi)發(fā)中重寫(xiě)它的行為臣樱。
webpack.config.js
var path = require('path');
var node_modules = path.resolve(__dirname, 'node_modules');
var pathToReact = path.resolve(node_modules, 'react/dist/react.min.js');
config = {
entry: [
'webpack/hot/dev-server',
path.resolve(__dirname, 'app/main.js')
],
resolve: {
alias: { 'react': pathToReact }
},
output: {
path: path.resolve(__dirname, 'build'),
filename: 'bundle.js',
},
module: {
loaders: [{ test: /\.jsx?$/, loader: 'babel' }],
noParse: [pathToReact]
}
};
module.exports = config;
我們?cè)谂渲弥凶隽藘杉拢?/p>
每當(dāng) "react" 在代碼中被引入靶擦,它會(huì)使用壓縮后的 React JS 文件,而不是到 node_modules 中找雇毫。
每當(dāng) Webpack 嘗試去解析那個(gè)壓縮后的文件玄捕,我們阻止它,因?yàn)檫@不必要棚放。