<?xml version="1.0" encoding="utf-8" standalone="yes"?><rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom"><channel><title>Visual-Studio-Code on Time Friend</title><link>https://time-friend.com/zh/tags/visual-studio-code/</link><description>Recent content in Visual-Studio-Code on Time Friend</description><generator>Hugo</generator><language>zh-CN</language><lastBuildDate>Tue, 08 Jan 2019 19:33:33 +0000</lastBuildDate><atom:link href="https://time-friend.com/zh/tags/visual-studio-code/index.xml" rel="self" type="application/rss+xml"/><item><title>Visual-Studio-Code 下的 jsconfig.json</title><link>https://time-friend.com/zh/archive/vscode-jsconfig/</link><pubDate>Tue, 08 Jan 2019 19:33:33 +0000</pubDate><guid>https://time-friend.com/zh/archive/vscode-jsconfig/</guid><description>&lt;p&gt;今天聊聊 Visual-Studio-Code 的jsconfig.json配置小技巧.&lt;/p&gt;
&lt;h1 id="jsconfigjson-是什么"&gt;jsconfig.json 是什么?&lt;/h1&gt;
&lt;p&gt;如果你的项目中有一个 &lt;code&gt;jsconfig.json&lt;/code&gt;文件的话,这个文件的配置可以对你的文件所在目录下的所有js代码做出个性化支持.&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;Tip: 如果你在项目中新加了这个文件,记得重启一下vscode哦~&lt;/p&gt;
&lt;/blockquote&gt;
&lt;h1 id="例子"&gt;例子&lt;/h1&gt;
&lt;h2 id="exclude-属性"&gt;exclude 属性&lt;/h2&gt;
&lt;p&gt;当vscode扫描项目代码的时候,如果遇到了node_module的话是会变得很慢的.&lt;/p&gt;
&lt;p&gt;如果想要编辑器的性能有一个提升的话,我们应该排除这个文件夹.&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-text-size-adjust:none;"&gt;&lt;code class="language-json" data-lang="json"&gt;&lt;span style="display:flex;"&gt;&lt;span&gt;{
&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt; &lt;span style="color:#f92672"&gt;&amp;#34;exclude&amp;#34;&lt;/span&gt;: [
&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt; &lt;span style="color:#e6db74"&gt;&amp;#34;node_modules&amp;#34;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt; ]
&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt;}
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;h2 id="include-属性"&gt;include 属性&lt;/h2&gt;
&lt;p&gt;当然还有相对的&lt;code&gt;include&lt;/code&gt;属性&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-text-size-adjust:none;"&gt;&lt;code class="language-json" data-lang="json"&gt;&lt;span style="display:flex;"&gt;&lt;span&gt;{
&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt; &lt;span style="color:#f92672"&gt;&amp;#34;include&amp;#34;&lt;/span&gt;: [
&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt; &lt;span style="color:#e6db74"&gt;&amp;#34;src/**/*&amp;#34;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt; ]
&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt;}
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;h2 id="webpack-aliases-的支持"&gt;webpack aliases 的支持&lt;/h2&gt;
&lt;p&gt;如果我们在我们的webpack里面配置的路径的别名,心细的小朋友就发现了.
我们的vscode不能根据别名路径导入的包跳转文件了.所以我们还需要&lt;code&gt;jsconfig.json&lt;/code&gt;的支持.&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-text-size-adjust:none;"&gt;&lt;code class="language-json" data-lang="json"&gt;&lt;span style="display:flex;"&gt;&lt;span&gt;{
&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt; &lt;span style="color:#f92672"&gt;&amp;#34;compilerOptions&amp;#34;&lt;/span&gt;: {
&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt; &lt;span style="color:#f92672"&gt;&amp;#34;baseUrl&amp;#34;&lt;/span&gt;: &lt;span style="color:#e6db74"&gt;&amp;#34;.&amp;#34;&lt;/span&gt;,
&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt; &lt;span style="color:#f92672"&gt;&amp;#34;paths&amp;#34;&lt;/span&gt;: {
&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt; &lt;span style="color:#f92672"&gt;&amp;#34;@component&amp;#34;&lt;/span&gt;: [&lt;span style="color:#e6db74"&gt;&amp;#34;./src/component&amp;#34;&lt;/span&gt;]
&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt; }
&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt; }
&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt;}
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;&lt;code&gt;jsconfig.json&lt;/code&gt;的配置是&lt;code&gt;tsconfig.json&lt;/code&gt;的子集,&lt;/p&gt;
&lt;p&gt;以后有机会的话聊一聊&lt;code&gt;tsconfig.json&lt;/code&gt;.&lt;/p&gt;
&lt;p&gt;今天就到这里~&lt;/p&gt;</description></item></channel></rss>