Question

我下载了一些练习文件来学习如何使用 Javascript。我使用 Visual Studio Code 作为编辑器，可以在编辑器中打开练习 javascript 文件。我已经安装了扩展 Prettier - Code Formatter 和 ESlint 以及 Live Server 和 npm-install 并在课程视频中提供了建议。 ESlint 扩展似乎工作正常，即当我删除一些代码时，代码中的错误会加下划线，当我将鼠标移到错误上时，弹出窗口会指示缺少的内容。但是，在下面的代码中，我删除了单词“update”周围的开始和结束括号，并缩进了以单词“main”开头的行。并删除应该跟在第一个括号后面的分号。但是，Prettier 扩展并没有纠正这些修正，正如视频所建议的那样，我收到了错误 ["ERROR" - 14:55:15] Prettier 无法加载。有关详细信息，请参阅以前的日志。

const updateBackpack = (update) => {
  let main = document.querySelector("main"); // main is an element
  main.innerHTML = markup(backpack);
  console.info(update);
};

你知道为什么 Prettier 不工作以及我如何让它工作。请记住，我是编码和 Javascript 的新手。

谢谢，克莱夫

Answer 1

我认为你和我有完全相同的问题，同时遵循与我完全相同的课程 :D！

首先安装 prettier，使用：

<块引用>

npm 我更漂亮 -g

然后配置 VS 代码以选择下载的包。

这是我所做的：在设置中搜索“更漂亮的路径”> 选择“在 settings.json 中编辑”并添加以下配置：

    {
  "editor.minimap.enabled": false,
  "editor.fontSize": 12,
  "editor.formatOnSave": true,
  "editor.tabSize": 2,
  "liveServer.settings.donotShowInfoMsg": true,
  "editor.wordWrap": "on",
  "emmet.triggerExpansionOnTab": true,
  "emmet.showSuggestionsAsSnippets": true,
  "editor.snippetSuggestions": "top",
  "[javascript]": {
    // "editor.defaultFormatter": "esbenp.prettier-vscode",
    "editor.formatOnSave": true,
    "editor.formatOnPaste": true
  },
  "workbench.colorTheme": "Monokai",
  "window.zoomLevel": 0,
  "editor.columnSelection": false,
  "explorer.compactFolders": false,
  "typescript.updateImportsOnFileMove.enabled": "always",
  "javascript.updateImportsOnFileMove.enabled": "always",
  "liveServer.settings.donotVerifyTags": true,
  "prettier.prettierPath": "/usr/local/lib/node_modules/prettier"
}

确保 prettier 安装在给定的路径："prettier.prettierPath": "/usr/local/lib/node_modules/prettier"

您也可以通过取消注释代码来使 prettier 成为默认值："editor.defaultFormatter": "esbenp.prettier-vscode"

它具有我的自定义视觉设置，因此请查看这些设置，然后进行设置，初学者尝试按原样粘贴！

Prettier Extension 没有纠正不一致的代码格式

1 个答案: