2016-06-12 4 views
5

Ich habe ein Projekt auf Webpack, mit dem ich versuche, SASS zu transpilieren. Ich glaube, dass ich ziemlich nah bin, obwohl es Probleme mit meiner Konfiguration gibt (code and details in the gist here).Wie behebt Import/no-unaufgelöste Fehler mit ESLint?

Lauf webpack mit dem Code, wie er ist, wird folgende Fehler ergibt:

/foobar/src/js/components/App.jsx 
    6:8 error Unable to resolve path to module '../../scss/components/app' import/no-unresolved 

eine Weile dafür ausgegeben haben, ich stellte fest, dass, wenn ich ersetzen die import 'scss/components/app' Linie in App.jsx mit import '../../scss/components/app.scss', die transpilation funktioniert. Dies führt mich zu glauben, dass es zwei Probleme:

  1. Meine resolve.root Webpack Konfiguration nicht funktioniert, da relativ Importe arbeiten, aber nicht Unbedingten.
  2. Meine resolve.extensions Webpack-Konfiguration wird auch nicht angewendet, da ich die Dateierweiterung .scss anhängen muss, damit es funktioniert.

Andere Anmerkungen:

  • ich webpack 1.13.1 bin mit.
  • Wenn ich absichtlich Syntaxfehler in die SCSS-Datei einführe, wird das Webpack mich korrekt über Probleme mit dieser Datei informieren.
  • Ich habe auch versucht, meine resolve.root Konfiguration als Array (d. H. [path.resolve(__dirname, './src')]) vergebens.
  • Zielweise hoffe ich, etwas Ähnliches wie this example zu erreichen.
  • Ich habe versucht, die import Pfade mit console-loader zu debuggen und bekomme undefined.

Jede Hilfe wird geschätzt, danke!

UPDATE: Ein Freund geteilt nur, dass das Problem nicht von sass-loader kommt/etc, aber von eslint.. Dies bedeutet, dass die Art dieser Frage sehr unterschiedlich sein wird (weniger Webpack, mehr Eslint).

Wie auch immer, mein .eslintrc erweitert das von AirBNB's, ich rate ich muss es basierend auf den Details in this plugin ändern.

Der Teil von Interesse ist:

settings: 
    import/ignore: 
    - node_modules  # mostly CommonJS (ignored by default) 
    - \.coffee$   # fraught with parse errors 
    - \.(scss|less|css)$ # can't parse unprocessed CSS modules, either 

Ich habe meine .eslintrc aktualisiert ähneln:

{ 
    "extends": "airbnb", 
    "settings": { 
     "import/ignore": [".scss$"] 
    } 
} 

Aber bin immer noch Fehler bekommen. Irgendwelche Ideen?

Antwort

4

Können Sie alle Dateien im Hauptfenster posten? Ich habe versucht, nach Problemen zu suchen, nur indem ich den Code ansehe, aber ein lauffähiges Beispiel mit allen Dateien und Importen in der Webpack-Konfiguration wäre hilfreicher.

Ich bin neugierig, warum Sie Eslint zu Lader anstelle von Preloaders hinzugefügt haben. Sie müssen es zu Preloadern hinzufügen.

+1

Danke für die schnelle Antwort! Das Verschieben von ESLint von 'module.loaders' nach' module.preloaders' löste das Problem in der Tat. –