javascript - Perf ei ole määritelty - ajetaan react-sovellusta webpack-dev-serverin kanssa

Yritän mitata Reactin suorituskykyä Perf-lisäosalla, mutta kun yritän suorittaa Perf.start() konsolissani, saan virheen: Uncaught ReferenceError: Perf is not defined(…)

On syytä mainita, että olen asentanut laajennuksen npm:n kautta ja minulla on require('react-addons-perf') pääsivustoni main.js-tiedostossa.

Minulla on arvaus, että tämä ongelma liittyy siihen, että ajan webpack-dev-serveriä ja globaalia muuttujaa ei ole asianmukaisesti altistettu, mutta valitettavasti minulla ei ole aavistustakaan, kuinka siihen pitäisi oikein suhtautua. Voiko joku auttaa minua tässä?

Tässä on webpack.config-tiedostoni sisältö codepenissä viitteeksi.

Vastaus #1

En tiedä, voisiko webpack.config-tiedostossasi olla muutoksia, jotka voisivat muuttaa scopingia tai paljastaa muuttujan, jotta se olisi käytettävissä globaalin scopen kautta, mutta yksi nopea tapa olisi yksinkertaisesti käyttää

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

Tämän pitäisi antaa sinulle pääsy konsolin kautta.

Mutta on sanottava, että sitä ei ehkä ole tarkoitettu paljastamaan globaaleja muuttujia globaalisti requireJS:ssä

Ja yritä ehkä löytää tapa laukaista Perf.start() ja Perf.stop() omasta koodistasi käsin, ei konsolista!

Vastaus #2

Löysin ratkaisun, joka toimi minulle:

  1. Asenna npm expose-loader -moduuli

  2. Lisää seuraava rivi webpack-konfiguraatiosi lataajiin:

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

Tämä expose-loader-moduuli on loistava tapa paljastaa moduulin vienti globaaliin näkyvyysalueeseen.