webstorm中vue语法的支持

俗话说，要想攻其玉，必先利其器。工作中老是在用angular开发，但慢慢会有vue的业务，所以需要学习学习vue。今天开始折腾vue，我是用webstorm开发前端的，当使用vue-cli创建好一个项目后，使用webstorm打开简直不能入目啊，倒是没有啥错误提示，倒是一大堆的各种编辑器警告，无奈，还得去搞好IDE对vue的支持啊。

前提

vue的官方文档上建议新手是先不要使用vue-cli，而是直接先用类似于JQuery一样的方式引入vue来学习。鉴于前面已经搞过了angular的cli，所以我还是直接从cli入手。

假定我们已经安装好了node和npm。

全局安装vue-cli

在终端中运行命令：

npm install --global vue-cli

全局安装vue-cli。然后使用vue-cli创建我们的项目：

vue init webpack my-project

这样我们就有个完整的项目，并且里面会有个示例的组件，运行：

npm run dev

然后在浏览器里面访问http://localhost:8081/就可以看到项目的运行情况。

折腾webstorm

在webstorm打开vue项目的时候，差点就想放弃vue了，实在不忍直视，但还是得发扬一贯的探索精神啊，遇到问题就要解决呗！