Mit webpack zum laden von CSS-Dateien aus node-Module

Ich versuche, einen reagieren Komponente enthält eine css-Datei. Ich bin erfordern die Komponente wie gewohnt:

var Select = require('react-select');

Ich würde gerne wissen, wie kann ich festlegen, dass die css benötigt für die Komponente.

Hab ich auch schon so probiert:

require('react-select/dist/react-select.css');

Und so:

require('react-select.css');

Und keiner gearbeitet haben.

  • Welche Fehler machen Sie? Was ist Ihr webpack config?
InformationsquelleAutor thitemple | 2016-03-24
  1. 0
    //package.json
"dependencies": {
    "my-package": "2.0.0"
}
//app.js
//Get a relative path to the installed css files:
require('../someRelativePathFromAppJs/node_modules/my-package/somePath/myNeeded.css')
    • Das funktioniert auch, aber um ehrlich zu sein mag ich das nicht müssen Dateien, die in den node_modules-Ordner
    InformationsquelleAutor Cooper Buckingham
  2. 12

    Stellen Sie sicher, dass die folgenden Pakete installiert:

    npm install style-loader css-loader --save-dev

    ist und dass Ihr webpack-Konfiguration ist diese: 

    module: {
  loaders: [
    { test: /\.css$/, loader: "style-loader!css-loader" }
  ]
}

    Dies erfordert und bündeln jede css-Datei, die Sie benötigen, und dann würde ich ziehen Sie Ihr genau, wie du es getan hast:

    require('react-select/dist/react-select.css');

    Eine andere Lösung, die funktioniert, die für bestimmte ist, dass Sie kopieren, dass die css-Datei und im html-verknüpfen Sie es durch:

    <link rel="stylesheet" href="/path/to/react-select.css">
    • Ich habe diese config auf meinem webpack Konfigurationsdatei
    • Dies ist die richtige Antwort, aber für newbies wie mich - Stellen Sie sicher, Sie haben dann die Stil-loader und css-loader-plugins installiert, damit webpack Lesen kann.
    • Für noch neuere Neulinge laufen diese npm install style-loader css-loader --save-dev und auch wenn Sie sich entscheiden, teilen Sie die CSS in eigene Datei nach dem Dokumentation achten Sie darauf, entfernen Sie die explizite css-marker, die in der erfordern, wie erwähnt, hier
    • Ich bin ein noch neuerer Neuling, und Sie haben mich gerettet aus einer sehr, sehr langen Tag.
    • so sind Sie, die Installation von Ladeschützen und css-styles nur auf die Entwicklung und nicht mit CSS in der Produktion?
    • Ich bin immer diese Fehlermeldung. Modul nicht gefunden: Error: Cannot resolve Modul 'font/VideoJS.eot - ' in /home/apurv/Downloads/Frontend-Master-master/node_modules/video.js/dist ich habe die Datei Frontlader und url-loader im Ort.

    InformationsquelleAutor minheq
Schreibe einen Kommentar