In VS Code wird folgende Fehlermeldung angezeigt: 'Modul konnte nicht geladen werden. Es wurde versucht, hübscher von package.json zu laden. '

Wenn ich VS Code verwende und ein Projekt öffne, wird folgende Benachrichtigung in der unteren rechten Ecke angezeigt:

Failed to load module. If you have prettier or plugins referenced in package.json, ensure you have runnpm installierenAttempted to load prettier from package.json.

Source: Prettier Code Format (Extension)

Durch Ausführen der npm-Installation wird dies nicht behoben. Hat jemand eine Idee, warum das so ist oder was ich tun kann, um es zu beheben?

Dies ist eine Lösung, die für mich funktioniert hat

1. Installieren Sie Prettier global über npm, wenn Sie es noch nie global installiert haben

npm i prettier -g

2. Suchen und verwenden Sie die Prettier PathErweiterungseinstellungen in Ihren VS-Codeeinstellungen

// Sie können Settings > Extensions > Prettierfür alle hübscheren Erweiterungseinstellungen zu VS-Code navigieren

3. Aktualisieren Sie das Prettier Pathauf Ihren global installierten Prettier.

Zum Beispiel

/usr/local/lib/node_modules/prettier (Mac OS)

\AppData\Roaming\npm\node_modules\prettier (Windows)

Aktualisieren

Es funktioniert jetzt für mich mit prettier-vscode4.1.1 und prettier2.0.4, probieren Sie es aus. Ich kann entweder die gebündelte oder die lokal installierte Version von Prettier verwenden.

Bemerkenswerte Änderungen :

• [4.0.0] Schöner auf 2.0 aktualisiert
• [4.1.0] Konfigurationsoption mit Knotenmodulen hinzugefügt, um die Verarbeitung von Dateien im Ordner node_modules zu ermöglichen [Standard: false]
• [4.1.0] Unterstützt das Laden von Prettier aus node_modules, auch wenn es nicht als direkte Abhängigkeit in einer package.json angezeigt wird

Ursprünglicher Beitrag

Ich bin auf dieses Problem gestoßen, als ich den Quellcode eines externen Pakets unter überprüft habe node_modules.

Eine Problemumgehung besteht darin, den prettierEintrag in package.jsondiesem Paket zu entfernen - keine lokale / globale prettierInstallation erforderlich. Beispiel :

{
  "devDependencies": {
    ...
    "prettier": "^1.19.1", // remove this line completely
  },
}

Behalten Sie die package.jsonGültigkeit bei - kein nachfolgendes Komma, kommentieren Sie nicht nur die Zeile aus. Der Grund, warum es funktioniert, ist:

Die Erweiterung durchsucht den Baum, bis wir eine package.json ablegen. Wenn diese package.json hübscher enthält, verwendet die Erweiterung diese, andernfalls wird die gebündelte Version von prettier verwendet. Verknüpfung

Ich vermute, dass die Erweiterung prettieraus dem Paket verwendet werden möchte , auch wenn dies der Fall ist devDependencies.

Es sollte nicht schaden, das devDependencyaus einem Paket zu werfen node_modules. Dies ermöglicht auch die Verwendung der prettiermitgelieferten Version prettier-vscode(keine Installation erforderlich).

Ich bin gerade darauf gestoßen und habe festgestellt, dass meine Datei package.json einen Syntaxfehler enthält. In einer Zeile stand ein nachkommendes Komma, und das allein schien die Hauptursache für mich zu sein.

Ich habe dies bemerkt, weil ich beim Versuch, einige Angular-Tests auszuführen, die folgende Ausgabe gesehen habe:

C:\... [feature/migrate-away-from-angular-http +2 ~6 -0 | +0 ~5 -0 !]> ng test
10% building 3/3 modules 0 active20 11 2019 21:11:18.638:WARN [karma]: No captured browser, open http://localhost:9876/
20 11 2019 21:11:19.575:INFO [karma-server]: Karma v4.1.0 server started at http://0.0.0.0:9876/
20 11 2019 21:11:19.576:INFO [launcher]: Launching browsers Chrome with concurrency unlimited
20 11 2019 21:11:19.594:INFO [launcher]: Starting browser Chrome

ERROR in ./src/app/app.component.spec.ts
Module not found: SyntaxError: C:\...\package.json (directory description file): SyntaxError: C:\...\package.json (directory description file): SyntaxError: Unexpected token } in JSON at position 167
 @ ./src/app/app.component.spec.ts 7:31-75
 @ ./src sync \.spec\.ts$
 @ ./src/test.ts
ERROR in ./src/app/app.component.ts

Beim Einrichten von Prettier ist es wichtig, es pro Projekt zu konfigurieren. Nicht jedes Projekt verwendet denselben Codestil. Daher ist es wichtig, den Stil des Projekts zu berücksichtigen, in dem Sie gerade arbeiten.

Das Demo-Repo bahmutov/prettier-config-exampleverfügt über zwei Unterordner mit jeweils eigenem Codestil, die von Prettier erzwungen werden. In Wirklichkeit hat jedes Ihrer Repos seinen eigenen Stil. Ich verwende Unterordner, um das Beispiel einfach zu halten.

npm install --save-dev --save-exact prettier

Versuchte alle hier angebotenen Lösungen, hat nicht geholfen. Durch das Aktualisieren von Visual Studio Code wurde dieses Problem behoben.

Dieses Problem wurde npm installglobal behoben.

Ich hatte dieses Problem, als ich meine säuberte node_nodules. Ich hatte eslintzusammen mit hübscher global installiert. Und als ich das löschte, wurde node_modulesdieser Fehler angezeigt.