WebStorm ES6 genannt Import bekommen kann nicht Symbol Fehler

Question

Ich habe einen Fehler in WebStorm bei der Verwendung von ES6 genannt Einfuhranmeldung lösen:

import { nodes } from 'utils/dom'; 

ich „kann nicht lösen Symbol“ Fehler auf „Knoten“

Auch wenn Ich versuche, so genannten Export wie folgt zu exportieren:

export { 
    write: document.write.bind(document), 
    node: document.querySelector.bind(document), 
    nodes: document.querySelectorAll.bind(document) 
}; 

Ich bekomme Fehler auch. Ich benutze eslint mit babel-eslint Parser. Die Sache ist, dass dies in Sublime Text 3 als Charme funktioniert, aber aus irgendeinem Grund fehlschlägt Fehlerprüfung in Webstorm.

Ich nehme an, dass dies ist, weil außer eslint webstorm anderen Code überprüft.

Irgendeine Idee, wie ich das unterdrücken und nur eslint mit babel-eslint Parser verwenden kann?

werden Ratschläge

Answer 1

I "Symbol nicht lösen können" Fehler bezeichnet auf "Knoten"

ist, weil utils/dom in Standard Node Code bedeutet „finden dom.js innerhalb eines Moduls erhalten geschätzt werden Sie haben dieses Verhalten mit der moduleDirectories-Eigenschaft von webpack überschrieben, aber WebStorm weiß nicht, was das ist Damit WebStorm utils/dom korrekt auflösen kann, müssen Sie den Ordner utils als Bibliothek in Ihrer Webstorm-Projektkonfiguration hinzufügen.

Ihre export Syntax ist falsch. Die ES6-Import/Export-Syntax ist zu 100% nicht mit Objekten verknüpft, und in Ihrem Beispielexport verwenden Sie die Objektsyntax. import { nodes } fragt nach einem Export namens nodes.Es gibt mehrere Möglichkeiten, wie Sie könnten die Exporte schreiben, die Sie:

export const write = document.write.bind(document); 
export const node = document.querySelector.bind(document); 
export const nodes = document.querySelectorAll.bind(document); 

oder alternativ könnte man sie zusammenbrechen, wenn Sie mehrzeilige wie var/let/const

export const write = document.write.bind(document), 
    node = document.querySelector.bind(document), 
    nodes = document.querySelectorAll.bind(document); 

oder sogar

const write = document.write.bind(document); 
const node = document.querySelector.bind(document); 
const nodes = document.querySelectorAll.bind(document); 


export {write, node, nodes}; 

Answer 2

Hard to Sagen Sie, wenn dies direkt verwandt ist, aber für Webstorm wissen, wie Sie Ihre Importe beheben können, können Sie auchgehenund setzen Ordner als Resource Root (oder rechts/Kontextklick auf einen Ordner und legen Sie es auf diese Weise)

Dies könnte müssen beispielsweise dadurch geschehen, werden, wenn Sie Webpack zu lösen bestimmte Unterverzeichnisse konfiguriert haben , wo Sie Ihre Projektstruktur sein könnte:

import Header from '../../../components/header/Header' 

:

/ 
    /docs 
    /src 
    /containers 
     /app 
     App.js 
    /components 
     /header 
     Header.js 

in diesem Fall WebStorm würde einen Import in App.js zu wie folgt aussehen erwarten

Während bei Webpack, wenn Sie src als Modul zu lösen hinzugefügt haben, können Sie die folgenden Aktionen durchführen, die WebStorm derzeit nicht verstehen, damit sie als Ressource Root-Zugabe löst das Problem

import Header from 'components/header/Header' 

Referenz: Path aliases for imports in Webstorm