react-refresh

921 阅读1分钟

react-refresh

  • 安装

npm install @pmmmwh/react-refresh-webpack-plugin react-refresh
  • webpack.config.js中的配置

const ReactRefreshWebpackPlugin = require("@pmmmwh/react-refresh-webpack-plugin");
const isDev = process.evn.NODE_EVN!=="production";
module.exports={
plugins:[
  //最好配置在开发环境中
  isDev && new ReactRefreshWebpackPlugin(),
],
modules:{
 rules:[{
 	 test: /\.(tsx|ts)$/,
 	 use:[{
 	  loader: "babel-loader",
        options:{
           plugins:[
             isDev&&require.resolve("react-refresh/babel")
           ].filter(Boolean)
         }
 	 },
 	 //其他loader
 	 	...
 	 ]
 },{
     test: /\.(js|jsx)$/,
     use: [{
       loader:"babel-loader",
       options:{
         plugins:[
           isDev&&require.resolve("react-refresh/babel")
         ]
       }
       },
       //其他loader
       ...
       ]
 }]
}
}

注意:按上述配置了之后重新启动服务,在更新过程中我的会报错,RefreshRegRefreshReg is not defined ,issues 连接。版本要求react-dom@16.9+

github.com/pmmmwh/reac…