javascript - Perf nu este definit - rularea aplicației react cu webpack-dev-server

Încerc să măsor performanța React cu addon-ul Perf, dar când încerc să rulez Perf.start() în consola mea primesc o eroare: Uncaught ReferenceError: Perf is not defined(…)

Merită menționat că am instalat pluginul prin npm și am un require('react-addons-perf') în fișierul meu main.js.

Am o presupunere că această problemă este legată de faptul că rulez un webpack-dev-server și variabila globală nu este expusă corespunzător, dar, din păcate, nu am idee cum să abordez problema corect. Poate cineva mă poate ajuta cu asta?

Iată conținutul fișierului meu webpack.config pe codepen pentru referință.

Răspuns #1

Nu știu dacă ar putea exista modificări în webpack.config-ul tău care să schimbe scoping-ul sau să facă o variabilă accesibilă prin scope-ul global, dar o modalitate rapidă ar fi să folosești pur și simplu

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

Acest lucru ar trebui să vă acorde acces prin consolă.

Dar trebuie să spunem că poate nu este intenționat să expună variabilele global global în requireJS

Și poate încearcă să găsești o modalitate de a declanșa Perf.start() și Perf.stop() din interiorul codului tău, nu din consolă!

Răspunsul #2

Am găsit o soluție care a funcționat pentru mine:

  1. Instalează modulul npm expose-loader

  2. Adaugă următoarea linie la încărcătoarele din configurația ta webpack:

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

Acest modul expose-loader este o metodă excelentă de a expune exporturile modulului la nivel global.