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:
- Meine
resolve.root
Webpack Konfiguration nicht funktioniert, da relativ Importe arbeiten, aber nicht Unbedingten. - 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 mitconsole-loader
zu debuggen und bekommeundefined
.
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?
Danke für die schnelle Antwort! Das Verschieben von ESLint von 'module.loaders' nach' module.preloaders' löste das Problem in der Tat. –