摘要:家族的新版等工具都已支持,不需要自己再安装插件,对单文件组件支持挺好。当前里同时包含的另一个项目是使用模板新建的一个空项目,这个项目的里有,有了这个以后项目里文件支持语法提示了。
jetbrains家族的新版webStorm、phpStorm等工具都已支持vue,不需要自己再安装Vue.js插件,对vue单文件组件支持挺好。
但是在html文件中直接引入的方式使用vue时IDE可能默认不支持vue的代码提示补全,还会有 "Attribute v-xxx is not allowed here"这样的提示,如下图这样
参考jetbrains的vue.js插件源码说明里面这段话:
If you’re using IntelliJ IDEA Ultimate, PhpStorm, PyCharm, or RubyMine, install Vue.js plugin in Preferences | Plugins - Install JetBrains plugins.
Open your Vue project.
Make sure that you have Vue.js library files in your project (for example, in the node_modules folder).
看上面第3条,就是说当前IDE项目里需要有vue的库文件,比如在node_modules目录里。
我们分别使用下面两种方法实现:
1.下载vue源文件,适合本机没有git,npm,vue-cli环境的
前往github下载vue源文件, 放到项目目录里就可以了。(如果下载的是zip请先解压)2.新建一个vue-cli项目,适合本机有npm, vue-cli环境的
新建一个vue-cli项目, 比如:vue init webpack vue-cli-test,根据提示创建完并npm install完成之后在同一个ide窗口中打开刚刚新建的vue-cli项目即可。
不管哪种方法目的都是为了让当前ide窗口中有vue库文件,然后问题就解决了,v-xxx属性不支持的提示已经没有了,v-for之类的指令里的js代码也支持高亮了。
(这里所谓项目指的只是在phpStorm同一个窗口中打开的多个目录而已,只要这些目录中任意一个里有包含vue的node_modules就可以,比如我这里普通项目是html-project, 这个项目里vue是在html文件中通过直接引入使用的。当前phpStrom里同时包含的另一个项目vue-cli-test是vue-cli使用webpack模板新建的一个空项目,这个项目的node_modules里有vue,有了这个以后html-project项目里html文件支持vue语法提示了。)
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/51635.html
摘要:家族的新版等工具都已支持,不需要自己再安装插件,对单文件组件支持挺好。当前里同时包含的另一个项目是使用模板新建的一个空项目,这个项目的里有,有了这个以后项目里文件支持语法提示了。 jetbrains家族的新版webStorm、phpStorm等工具都已支持vue,不需要自己再安装Vue.js插件,对vue单文件组件支持挺好。但是在html文件中直接引入的方式使用vue时IDE可能默认不...
这篇文章主要讲述compileToFunctions的作用。 我们现在就compileToFunctions 的真弄明白为什么要弄的这么复杂?现在我们看看下面完整代码。 compileToFunctions是如何把模板字符串template编译成渲染函数render的。 Vue.prototype.$mount函数体 回归到Vue.prototype.$mount函数体内。 varr...
前言 学习中有一种方式就是错题汇总,在学习代码,日常书写代码中对于遇到报错,也要汇总,这样可以在以后编码过程中避免或解决这些问题。 一、报错结构 首先对于报错分为:错误类型、错误位置、错误描述、错误规则和问题数量。 如上图: 报错类型为编译错误; 错误位置在D:\myel\src\views\admin\AdminView.vue中的第四行第2个字符;(报错位置不一定每次都是准确的...
摘要:表达式的计算值和属性的值与指定名称的元素有关根据下面的规则在的表达总是返回一个字符串。在没有命名空间这将只是一个标识符。 本文不是w3c翻译 保留原文的基础上 做出自己的理解为主 参考 http://www.w3.org/TR/2015/CR-css-values-3-20150611/#attr-notation attr函数介绍 The attr() fun...
摘要:是一个极其好用的代码提示及补全工具,可以给编写代码带来极大的便利。例如事件将返回一个对象,利用文件您可以调用并且它将自动完成的方法。提示您可能需要重启使文件生效。 showImg(https://segmentfault.com/img/remote/1460000014528926); Laravel IDE Helper 是一个极其好用的代码提示及补全工具,可以给编写代码带来极大的...
阅读 1856·2021-11-22 15:25
阅读 1222·2021-11-19 09:40
阅读 1797·2021-09-27 13:57
阅读 966·2021-09-22 15:10
阅读 942·2021-08-16 11:01
阅读 2917·2021-07-23 17:51
阅读 725·2019-08-30 15:55
阅读 796·2019-08-30 13:58