脚本宝典收集整理的这篇文章主要介绍了

【Vue】VueCli3 + Vue + typescript 挖坑记

脚本宝典小编觉得挺不错的,现在分享给大家,也给大家做个参考,希望能帮助你少写一行代码,多一份安全和惬意。
<p><code></p> <h1 id="articleHeader0"><a href="http://www.js-code.com/tag/vue" title="Vue" target="_blank">Vue</a> + typescript 挖坑记</h1> <blockquote><p><a href="http://www.js-code.com/tag/vue" title="Vue" target="_blank">Vue</a>Cli3.0生成<a href="http://www.js-code.com/tag/vue" title="浏览关于“Vue”的文章" target="_blank" class="tag_link">Vue</a>+ts的项目组件,中间遇到了一些让我直接放弃结合ts的坑,还是等Vue3.0的发布吧,到那个时候肯定结合得会更好。</p></blockquote> <h2 id="articleHeader1">1 How to fix TSLint: " should be ' (quotemark) while doing organize imports in code editors?</h2> <p>In User Preferences set the following.</p> <div class="widget-codetool" style="display:none;"> <div class="widget-codetool--inner"> <span class="selectCode code-tool" data-toggle="tooltip" data-placement="top" title="" data-original-title="全选"></span><br /> <span type="button" class="copyCode code-tool" data-toggle="tooltip" data-placement="top" data-clipboard-text="&quot;tslint.autoFixOnSave&quot;: true" title="" data-original-title="复制"></span> </div> </p></div> <pre class="json hljs"><code class="json" style="word-break: break-word; white-space: initial;"><span class="hljs-string">"tslint.autoFixOnSave"</span>: <span class="hljs-literal">true</span></code></pre> <h2 id="articleHeader2">2 tslint Missing semicolon (semicolon)</h2> <p>分析:在vuetur的github&gt;issue中有讲,vue-tslint的代码检查不太好,强制要求每个vue单文件组件里必须要有以下代码</p> <div class="widget-codetool" style="display:none;"> <div class="widget-codetool--inner"> <span class="selectCode code-tool" data-toggle="tooltip" data-placement="top" title="" data-original-title="全选"></span><br /> <span type="button" class="copyCode code-tool" data-toggle="tooltip" data-placement="top" data-clipboard-text="<script lang=&quot;ts&quot;> </script>" title="" data-original-title="复制"></span> </div> </p></div> <pre class="xml hljs"><code class="html"><span class="hljs-tag">&lt;<span class="hljs-name">script</span> <span class="hljs-attr">lang</span>=<span class="hljs-string">"ts"</span>&gt;</span><span class="undefined"> </span><span class="hljs-tag">&lt;/<span class="hljs-name">script</span>&gt;</span></code></pre> <h2 id="articleHeader3">3 App.vue' is not a module.</h2> <p>分析:弄完第二个问题后,cli紧接着就报了这个错误。想了解的话,请戳vuecli_ts &gt; Github上的这个<a href="https://github.com/vuejs/vue-cli/issues/1104" rel="nofollow noreferrer" target="_blank">Issue</a>,下面给了一种临时性的解决方案(真的挺丑的),真正的解决还是得等vue3.0的正式发布。</p> <p>解决方法:// @ts-ignore before each import '*.vue' could be a temporary solution.</p> <div class="widget-codetool" style="display:none;"> <div class="widget-codetool--inner"> <span class="selectCode code-tool" data-toggle="tooltip" data-placement="top" title="" data-original-title="全选"></span><br /> <span type="button" class="copyCode code-tool" data-toggle="tooltip" data-placement="top" data-clipboard-text="// @ts-ignore import HelloWorld from '@/components/HelloWorld/HelloWorld.vue'; " title="" data-original-title="复制"></span> </div> </p></div> <pre class="typescript hljs"><code class="ts"><span class="hljs-comment">// @ts-ignore</span> <span class="hljs-keyword">import</span> HelloWorld <span class="hljs-keyword">from</span> <span class="hljs-string">'@/components/HelloWorld/HelloWorld.vue'</span>; </code></pre> <p></code></p>

总结

以上是脚本宝典为你收集整理的

【Vue】VueCli3 + Vue + typescript 挖坑记

全部内容,希望文章能够帮你解决

【Vue】VueCli3 + Vue + typescript 挖坑记

所遇到的程序开发问题,欢迎加入QQ群277859234一起讨论学习。如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典网站推荐给程序员好友。 本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。

80%的人都看过