Perf未定義 - 運行與webpack-dev-server的反應應用程序

Question

我試圖測量與Perf addon的反應性能，但是當我嘗試在控制檯中運行Perf.start（）時出現錯誤：Uncaught ReferenceError: Perf is not defined(…)

值得一提的是，我已經通過npm安裝了插件，並且在我的main.js文件中有一個require('react-addons-perf')。

我有一個猜測，這個問題涉及到我運行一個webpack-dev-server和全局變量沒有正確公開的事實，但不幸的是，我不知道如何正確地接近它。任何人都可以幫助我嗎？

這是我的webpack.config文件內容codepen供參考。

Answer 1

我不知道是否有可能是您的webpack.config內的變化可能會改變作用域或暴露一個變種是通過在全球範圍內訪問，但一個快速的方法是簡單地使用

global.Perf = require('react-addons-perf'); 

這應該授予您通過控制檯訪問。

但是，我們必須說，這也許是不希望暴露在全球瓦爾global variables in requireJS

也許試圖找到一種方法，從你的代碼中觸發Perf.start（）和Perf.stop（），不控制檯！

Answer 2

找到了解決方案，爲我工作：

1. 安裝npm expose-loader module

2. 以下行添加到您的WebPack配置裝載機：

   { test: require.resolve("react-addons-perf"), loader: "expose?Perf" } 
   

這暴露裝載機模塊是將模塊導出顯示到全局範圍的好方法。