摘要:使用屬性屬性模式告訴語(yǔ)言服務(wù)哪些文件是什么文件,而不是源代碼的一部分。這些文件會(huì)導(dǎo)致建議顯示兩次,并會(huì)降低的速度。例如,對(duì)于別名或然后使用別名或最佳實(shí)踐只要有可能,您應(yīng)該使用不屬于項(xiàng)目源代碼的文件排除文件夾。值為,,,,,顯示診斷信息。
問題源頭:webpack模板里import路徑中@符號(hào)是什么意思?
目錄中存在jsconfig.json文件表示該目錄是JavaScript項(xiàng)目的根目錄。jsconfig.json文件指定根文件和JavaScript語(yǔ)言服務(wù)提供的功能選項(xiàng)。
提示:如果您不使用JavaScript,則無需擔(dān)心jsconfig.json。為什么我需要一個(gè)jsconfig.json文件?
提示:jsconfig.json源于tsconfig.json,是TypeScript的配置文件。jsconfig.json相當(dāng)于tsconfig.json的“allowJs”屬性設(shè)置為true。
Visual Studio Code的JavaScript支持可以在兩種不同的模式下運(yùn)行:
文件范圍 - 沒有jsconfig.json:在此模式下,在Visual Studio Code中打開的JavaScript文件被視為獨(dú)立單元。 只要文件a.js沒有顯式引用文件b.ts(使用///引用指令或CommonJS模塊),兩個(gè)文件之間就沒有共同的項(xiàng)目上下文。
顯式項(xiàng)目 - 使用jsconfig.json:JavaScript項(xiàng)目是通過jsconfig.json文件定義的。 目錄中存在此類文件表示該目錄是JavaScript項(xiàng)目的根目錄。 文件本身可以選擇列出屬于項(xiàng)目的文件,要從項(xiàng)目中排除的文件,以及編譯器選項(xiàng)(見下文)。
當(dāng)您在工作空間中有一個(gè)定義項(xiàng)目上下文的jsconfig.json文件時(shí),JavaScript體驗(yàn)會(huì)得到改進(jìn)。 因此,當(dāng)您在新工作空間中打開JavaScript文件時(shí),我們提供了一個(gè)創(chuàng)建jsconfig.json文件的提示。
我們通過創(chuàng)建jsconfig.json文件將我們代碼的這一部分(我們網(wǎng)站的客戶端)定義為JavaScript項(xiàng)目。 將文件放在JavaScript代碼的根目錄下,如下所示。
在更復(fù)雜的項(xiàng)目中,您可能在工作空間中定義了多個(gè)jsconfig.json文件。 您將需要執(zhí)行此操作,以便不將一個(gè)項(xiàng)目中的代碼建議為IntelliSense以在另一個(gè)項(xiàng)目中進(jìn)行編碼。 下面的插圖是一個(gè)帶有客戶端和服務(wù)器文件夾的項(xiàng)目,顯示了兩個(gè)多帶帶的JavaScript項(xiàng)目。
默認(rèn)情況下,JavaScript語(yǔ)言服務(wù)將分析并為JavaScript項(xiàng)目中的所有文件提供IntelliSense(智能感知)。 您需要指定要排除或包含的文件,以便提供正確的IntelliSense。
exclude屬性(glob模式)告訴語(yǔ)言服務(wù)哪些文件是什么文件,而不是源代碼的一部分。 這使性能保持在較高水平。 如果IntelliSense速度很慢,請(qǐng)將文件夾添加到排除列表中(如果檢測(cè)到速度減慢,VS代碼將提示您執(zhí)行此操作)。
{ "compilerOptions": { "target": "es6" }, "exclude": [ "node_modules" ] }
提示:您將要排除由構(gòu)建過程生成的文件(例如,dist目錄)。 這些文件會(huì)導(dǎo)致建議顯示兩次,并會(huì)降低IntelliSense的速度。
或者,可以使用include屬性(glob模式)顯式設(shè)置項(xiàng)目中的文件。如果不存在include屬性,則默認(rèn)為包含目錄和子目錄中的所有文件。如果指定了include屬性,則只包括這些文件。下面是一個(gè)具有顯式include屬性的示例。
{ "compilerOptions": { "target": "es6" }, "include": [ "src/**/*" ] }
提示:exclude和include中的文件路徑是相對(duì)于jsconfig.json的位置。jsconfig選項(xiàng)
下面是jsconfig“compilerOptions”來配置JavaScript語(yǔ)言支持。
提示:不要被compilerOptions混淆。 此屬性的存在是因?yàn)閖sconfig.json是tsconfig.json的后代,后者用于編譯TypeScript。
選項(xiàng) | 描述 | 類型 | 默認(rèn) |
---|---|---|---|
noLib | 不包含默認(rèn)庫(kù)文件(lib.d.ts) | string | - |
target | 指定要使用的默認(rèn)庫(kù)(lib.d.ts)。 值是“es3”,“es5”,“es6”,“es2015”,“es2016”,“es2017”,“es2018”,“esnext”。 | string | - |
checkJs | 啟用JavaScript文件的類型檢查。 | boolean | true |
experimentalDecorators | 為擬議的ES裝飾器提供實(shí)驗(yàn)支持。 | string | - |
allowSyntheticDefaultImports | 允許從沒有默認(rèn)導(dǎo)出的模塊進(jìn)行默認(rèn)導(dǎo)入。 這不會(huì)影響代碼發(fā)出,只會(huì)影響類型檢查。 | boolean | true |
baseUrl | 用于解析非相對(duì)模塊名稱的基目錄。 | string | - |
paths | 指定相對(duì)于baseUrl選項(xiàng)計(jì)算的路徑映射。 | object | 見demo |
要使IntelliSense使用webpack別名,您需要使用glob模式指定paths鍵。
例如,對(duì)于別名"ClientApp"(或@):
{ "compilerOptions": { "baseUrl": ".", "paths": { "ClientApp/*": ["./ClientApp/*"] } } }
然后使用別名
import Something from "ClientApp/foo" // 或 import Something from "@/foo"最佳實(shí)踐
只要有可能,您應(yīng)該使用不屬于項(xiàng)目源代碼的JavaScript文件排除文件夾。
提示:如果工作空間中沒有jsconfig.json,則默認(rèn)情況下,VS Code將排除node_modules文件夾。
下面是一個(gè)將常見項(xiàng)目組件映射到其安裝文件夾的表,建議將其排除在外:
組件 | 要排除的文件夾 |
---|---|
node | 排除node_modules文件夾 |
webpack, webpack-dev-server | 排除內(nèi)容文件夾,例如dist。 |
bower | 排除bower_components文件夾 |
ember | 排除tmp和temp文件夾 |
jspm | 排除jspm_packages文件夾 |
當(dāng)您的JavaScript項(xiàng)目變得太大而性能變慢時(shí),通常是因?yàn)橄駈ode_modules這樣的庫(kù)文件夾。 如果VS Code檢測(cè)到您的項(xiàng)目變得過大,則會(huì)提示您編輯排除列表。
提示:有時(shí)無法正確選擇更改配置,例如添加或編輯jsconfig.json文件。 運(yùn)行Reload JavaScript Project命令應(yīng)重新加載項(xiàng)目并獲取更改。使用TypeScript編譯器進(jìn)行低級(jí)編譯
當(dāng)tsc用于將ES6 JavaScript向下級(jí)編譯為舊版本時(shí),jsconfig.json中的以下編譯器選項(xiàng)適用:
選項(xiàng) | 描述 |
---|---|
module | 指定模塊代碼生成。 值為“commonjs”,“system”,“umd”,“amd”,“es6”,“es2015” |
diagnostics | 顯示診斷信息。 |
emitBOM | 在輸出文件的開頭發(fā)出UTF-8字節(jié)順序標(biāo)記(BOM)。 |
inlineSourceMap | 使用源映射發(fā)出單個(gè)文件,而不是使用多帶帶的文件。 |
inlineSources | 在單個(gè)文件中將源與源圖一起發(fā)出; 需要設(shè)置--inlineSourceMap。 |
jsx | 指定JSX代碼生成:“保留”或“反應(yīng)”?。 |
reactNamespace | 指定在針對(duì)"react"JSX發(fā)出的目標(biāo)時(shí)為createElement和__spread調(diào)用的對(duì)象。 |
mapRoot | 將位置指定為字符串中的uri,其中調(diào)試器應(yīng)該找到映射文件而不是生成的位置。 |
noEmit | 不發(fā)起輸出。 |
noEmitHelpers | 不在編譯輸出中生成自定義輔助函數(shù),如__extends。 |
noEmitOnError | 如果報(bào)告任何類型檢查錯(cuò)誤,不發(fā)起輸出。 |
noResolve | 不將三斜杠引用或模塊導(dǎo)入目標(biāo)解析為輸入文件。 |
outFile | 連接并將輸出發(fā)送到單個(gè)文件。 |
outDir | 將輸出結(jié)構(gòu)重定向到目錄。 |
removeComments | 不向輸出發(fā)出注釋。 |
rootDir | 指定輸入文件的根目錄。用于通過--outDir控制輸出目錄結(jié)構(gòu)。 |
sourceMap | 生成相應(yīng)的".map"文件。 |
sourceRoot | 指定調(diào)試器應(yīng)該找到JavaScript文件而不是源位置的位置。 |
stripInternal | 不為具有"@internal"注釋的代碼發(fā)出聲明。 |
watch | 監(jiān)聽輸入文件。 |
emitDecoratorMetadata | 在源中為裝飾聲明發(fā)出設(shè)計(jì)類型元數(shù)據(jù)。 |
noImplicitUseStrict | 不在模塊輸出中發(fā)出“use strict”指令。 |
這個(gè)文檔有用么?參考:
JavaScript語(yǔ)言服務(wù)
TypeScript tsconfig.json
glob模式
glob (programming))
webpack模板里import路徑中@符號(hào)是什么意思?
翻譯:Xindot
原文:https://code.visualstudio.com...
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://m.specialneedsforspecialkids.com/yun/101393.html
摘要:如要自動(dòng)引入組件,首先需安裝拓展自動(dòng)引入組件和普通模塊在根目錄添加。使用自動(dòng)引入中的安裝拓展配置輸入命令后選擇引入包其他自動(dòng)引入組件和模塊后,按住點(diǎn)擊路徑可直接跳到該文件文章原始發(fā)布于我的博客 如要自動(dòng)引入Vue組件,首先需安裝VSCode拓展: Vetur 自動(dòng)引入Vue組件和普通Js模塊 在根目錄添加 jsconfig.json 。 每次修改jsconfig.json后需重啟該V...
先為大家介紹在vue項(xiàng)目中 jsconfig.json 官方說明:當(dāng)您在工作空間中有一個(gè)定義項(xiàng)目上下文的jsconfig.json文件時(shí),JavaScript體驗(yàn)會(huì)得到改進(jìn)。 概述 目錄中存在tsconfig.json文件表明該目錄是 TypeScript 項(xiàng)目的根目錄。該tsconfig.json文件指定編譯項(xiàng)目所需的根文件和編譯器選項(xiàng)。 JavaScript 項(xiàng)目可以使用jscon...
摘要:對(duì)文件提供語(yǔ)法高亮和自動(dòng)補(bǔ)全對(duì)小程序文件提供補(bǔ)全和語(yǔ)法高亮只需要鍵入就會(huì)有微信的提示使用做路徑感知當(dāng)我們?cè)陧?xiàng)目中集成的時(shí)候,經(jīng)常會(huì)使用。 在日常開發(fā)中,我使用的編輯器是 VS CODE。不僅界面簡(jiǎn)潔好看,而且插件豐富,是前端開發(fā)的首選工具之一。這些插件和工具的目的是為了提高我們的開發(fā)效率,下面就我日常開發(fā)切身使用到和感受到有幫助的插件和方法做個(gè)總結(jié)。 VS CODE 常用的個(gè)人在用的插...
摘要:當(dāng)你處于文件管理器中,你可以像在的中那樣用相同的快捷鍵進(jìn)行常規(guī)操作,比如用方向鍵導(dǎo)航用鍵給文件或文件夾重命名用打開當(dāng)前文件等。 原文地址:Tips to use VSCode more efficiently 原文作者:sudolabs 譯文出自:掘金翻譯計(jì)劃 本文永久鏈接:github.com/xitu/gold-m… 譯者:Baddyo 校對(duì)者:xionglong58, hzdaqo ...
摘要:但是在下編輯有點(diǎn)問題智能路徑提示不能用了解決方案添加定位模塊解決方案使用插件然后使用相當(dāng)于 一 問題 路徑結(jié)構(gòu) 0 0-1 0-1-0 0-1-2 0-1-2-0 0-1-2-0-0 0-2 0-2-0 如過0-1-2-0-0里面的文件引用0-2-0里面的文件:(1)相對(duì)路徑寫法 ....
閱讀 3326·2021-11-08 13:12
閱讀 2766·2021-10-15 09:41
閱讀 1459·2021-10-08 10:05
閱讀 3306·2021-10-08 10:04
閱讀 2114·2021-09-29 09:34
閱讀 2487·2019-08-30 15:55
閱讀 2984·2019-08-30 15:45
閱讀 2593·2019-08-29 14:17