/ / Impossibile importare i moduli nodo nei componenti React: reactjs, npm, webpack, import, module

Impossibile importare i moduli nodo nei componenti React: reactjs, npm, webpack, import, module

Sto armeggiando con il seguente localeimpostazione drf-react. Sono davvero nuovo a reagire e javascript in generale e non ho assolutamente idea del perché non riesco a importare assiomi o altri moduli di nodo per quella materia nei miei componenti di reazione, eccetto per i moduli già forniti con il progetto cookiecutter stesso. il react-dev-utils ...? Mi piacerebbe usare il webpack, ma non riesco a configurarlo correttamente.Il mio contenitore di frontend docker non si comporterà, dicendomi di installare webpack-cli. L'aiuto è molto apprezzato.

https://github.com/moritz91/drf-react-app

risposte:

0 per risposta № 1

Dovresti eseguire il comando npm install all'interno della tua cartella di frontend:

  • Apri il terminale
  • Trova la cartella di frontend
  • Al suo interno esegui il comando npm install

Questo comando installerà le dipendenze relative al file package.json, che si trova all'interno della cartella di frontend.

All'interno dei file React verrà inserito l'intero percorso nella cartella node_modules.

L'idea di usare node_modules è di rendere più facile il controllo delle dipendenze nel progetto. Dovresti considerare di nuovo l'uso di webpack per gestire questi file da node_modules.

Wepack ha un modulo chiamato resolve che devi compilare con un elenco di directory e all'interno dei componenti di React non hai più bisogno di utilizzare l'intero percorso, perché Webpack capirà dove cercare:

// ALIAS
resolve: {
extensions: [".js", ".jsx", ".scss"],
modules: [
"YOUR SOURCE FOLDER",
"YOUR NODE MODULES FOLDER",
"ANY OTHER FOLDER"
]
}

Dai documenti:

Tell webpack what directories should be searched when resolving modules.

La documentazione: https://webpack.js.org/configuration/resolve/

Inoltre, ho un esempio di utilizzo di Webpack + Bootstrap 4. È possibile utilizzare per creare la propria configurazione Webpack per React e Redux.

https://github.com/italoborges/webpack-bootstrap4-es6