webstorm创建和调试vue项目

安装node.js
官网下载安装 
https://nodejs.org/en/

cmd下创建项目
创建项目文件夹webpack-vue,并cd进入 
安装vue-cli

npm install -g vue-cli

初始化

vue init webpack

默认项enter键,其他按情况选择y/n 


安装webstorm
下载安装
https://www.jetbrains.com/webstorm/ 


这里的jar包 
license server激活地址

http://idea.iteblog.com/key.php 

导入项目
导入 


 
运行 

也可以用自带的终端运行 
菜单栏 
view->tool windows->terminal 
输入

npm run dev
经常输入命令的,打开终端窗口还是有必要的

调试
npm debug的方式开始可以,过一分钟左右就会断开连接,connection refused,放弃 
另一种方式如下,但是我觉得还是没有直接用浏览器调试方便

谷歌浏览器添加插件
下载地址如下: 
https://pan.baidu.com/s/1jHI8ugu

修改webpack.dev.conf.js
将devtool: config.dev.devtool改为 
devtool: ‘source-map’

执行JavaScript debug

è¿éåå¾çæè¿°