VS 代码自动完成/智能感知不工作

Question

Building my first React project from https://frontendmasters.com/courses/complete-react-v5/ on VS Code for Windows 10.

Have installed prettier, eslint. Using Parcel to transpile the code. The intellisense is only working on index.html file. Nothing on js files. Have looked through old answers and none of them proved to be helpful. A bit of a noob here, a step by step solution will be helpful

Screenshot Attaching project files

http://www.filedropper.com/adapt-me

Answer 1

on the right bottom change the language mode Javascript to Javascript React

Answer 2

You need to specify that the file you working on is of JavaScript React type, currently with .js it is a JavaScript file type.

You can see the file type on the bottom Status Bar

Use Change Language Mode (through command palette) command to change it manually.

Also, you can provide a config in settings.json to associate it with a file name, for example:

  "files.associations": {
    "*.react.js": "javascriptreact",
    "*.stories.js": "javascriptreact",
    "*.action.js": "javascriptreact",
    "*.reducer.js": "javascriptreact",
    "*.styles.js": "javascriptreact",
    "*.styles.react.js": "javascriptreact",
    "*.styles.jsx": "javascriptreact",
    "*.svg.js": "javascriptreact",
    "*.jsx": "javascriptreact",
    "*.js": "javascriptreact",
    ".stylelintrc": "jsonc"
  }

Answer 3

Look at this photo. Head to the settings and search for autocomplete, tick them out and you are good to go.

Answer 4

It may be a problem with your parcel setup. Can you create a Create React App project template CRA and check if the intellisense still doesn't work with the js files in it.

Another alternative is to upgrade your VS code to the latest version if any update is available or else you can download VSCode Insiders and check if the intellisense works as expected.

One other option is to checkout the code from the commit mentioned at the bottom of this page and check if the intellisense works for this code.

Answer 5

如果您的文件扩展名类似于 .js，请将其转换为 .jsx。

Answer 6

I had the same problem trying to get auto-complete using fs functions. When I switched from requiring to importing fs, the auto-complete appeared. Don't know if it's relevant though. Just a complete newbie.

Answer 7

You need to assign the extension of ".jsx" to "Javascript React" in the bottom right corner of VS Code.

Click on Configure File Association for '.jsx' :

Then select Javascript React :

Now the autocomplete will happen like if it was an html file.

Also, make sure to add ".jsx" extension to your files instead of ".js".