Home >Web Front-end >JS Tutorial >How VSCode introduces Vue components and Js modules

How VSCode introduces Vue components and Js modules

不言
不言Original
2018-07-18 17:42:169114browse

This article shares with you how VSCode can automatically introduce Vue components and Js modules. Friends in need can refer to it.

Automatically introduce Vue components and ordinary Js modules

Add jsconfig.json in the root directory.
Every time you modify jsconfig.json, you need to restart the VSCode window

{  "include": [    "./src/**/*"
  ],
}

Support Webpack alias path

Same as above, need to updatejsconfig.json

{  "compilerOptions": {    "baseUrl": ".",    "paths": {      "@/*": [        "./src/*"
      ]
    },
  },  "include": [    "./src/**/*",
  ],
}

Automatically introduce JS in node_modules into JS

  1. Take lodahs as an example to install lodash: npm install lodash

  2. Add jsconfig.json in the root directory

{  "compilerOptions": {    "checkJs": true,
  },  "include": [    "node_modules/lodash/*"
  ],
}
  1. After entering the keyword, click Prompt light bulb (shortcut key: Ctrl/Command .), select the JS module

Note: checkJs may cause some The project syntax reports an error. If an error occurs, you can use the following method as an alternative.

Use Npm IntellisenseAutomatically introduce JS in node_modules

  1. Install VSCode extension: Npm Intellisense

  2. ConfigurationNpm Intellisense

{  "npm-intellisense.scanDevDependencies": true,  "npm-intellisense.importES6": true,  "npm-intellisense.importQuotes": "'",  "npm-intellisense.importLinebreak": ";\r\n",  "npm-intellisense.importDeclarationType": "const",
}
  1. VSCode input command (Ctrl/Command Shift P): Npm Intellisense: Import module, select the imported package

Others

After automatically introducing Vue components and JS modules, hold down Ctrl/Command and click the path to jump directly to the file

Related recommendations:

Introducing external js method examples into vue

Detailed examples of vue-cli vscode configuration eslint

The above is the detailed content of How VSCode introduces Vue components and Js modules. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn