webStorm
WS是jetbrains家族的一员,专门设计开发前端(包括nodejs),vue,react等框架完美使用,接入了node,npm,git,svn
当然这个不是免费的,可以使用30天,需要付费,不过可以下载到破解版的,汉化版的
刚下载的应该是白色的,可以百度看一下怎么换皮肤,毕竟黑色才是装逼必备
刚下的字体很小,可以在File/setting/Editor/Font里修改
常用按键
tab键 补齐标签
代码输入xx.log
加 tab键会变成console.log(xx)
ctrl+f 搜索
ctrl+r 搜索+替换
ctrl+shift+f 搜索文件
alt+f12 命令行
alt+/ 是注释
路径跳转
// 这些引入的代码,按住ctrl键,鼠标移到 form 后面的地址上
// 这个词会变成蓝色和下划线,这是点击一下这个词,会跳转到这个文件的地址
import router from \'./router\'
// 组件也行
import HelloWorld from \'../components/HelloWorld.vue\'
// 但是webpack地址编译的不行
import HelloWorld from \'@/components/HelloWorld.vue\'
SVN
打开设置,搜索svn,设置下载好的svn.exe
文件地址
把带有.svn
关联的项目导入后,可以看到右上角会有几个图标,蓝色箭头就是更新,绿色打钩就是提交,时钟就是查看提交记录
Git
打开设置,搜索git,设置下载好的git.exe
文件地址
把带有.git
关联的项目导入后,可以看到右上角会有几个图标
蓝色箭头就是更新,绿色打钩就是提交,时钟就是查看提交记录,svn也一样,但git跟svn不同,svn点击绿色打钩就是提交服务器,git是提交本地仓库,想要提交到服务器,需要在文件栏右键整个项目的文件夹,如下图找到git/repository/push,才是真正的提交服务器
配置vue启动
在上上图的git旁边有个build:prod
就是配置好的,如果没配置过就是Add Config...
的按钮,直接点击会打开一个窗口,窗口的左上角有个加号,点击后出现一个下拉框,点击下拉框的Node.js
,然后界面如下
点击上面圈好的加号,选择run npm script
,会出现下面的框,在script
下拉框可以看到几个命令,这几个命令就是WS工具读取文件夹里的pack.json
里的所有命令,选择运行脚手架服务器的命令,一般是dev
或者service
,确定,应用,刚才的Add Config...
会变成nodejs
,旁边的灰色箭头会变成绿色的,然后点击箭头就可以启动脚手架了,就不用每次启动都alt+f12去写命令了