1. 首先安装vue插件,安装方法: setting  -->  plugin  ,点击plugin,在内容部分的左侧输入框输入vue,会出现两个关于vue的插件,点击安装即可.安装完成后,就可以看到,新建文件时,会有vue文件的提示. 如下图所示: 2. 设置vue新建文件模板. 步骤: settings  -->  file and code templates .在内容区域左侧点击vue file,修改对应的模板内容即可. 如下图所示: 3. 设置vue文件支持的编码格式(例如:支持的缩

1. 首先安装vue插件,安装方法: setting  -->  plugin  ,点击plugin,在内容部分的左侧输入框输入vue,会出现两个关于vue的插件,点击安装即可.安装完成后,就可以看到,新建文件时,会有vue文件的提示. 如下图所示: 2. 设置vue新建文件模板. 步骤: settings  -->  file and code templates .在内容区域左侧点击vue file,修改对应的模板内容即可. 如下图所示: 3. 设置vue文件支持的编码格式(例如:支持的缩

虽然最新版的前端开发利器WebStorm支持了Vue,但是大部分人的WebStorm依然是默认不支持Vue的老版本(比如之前的我),所以需要手动添加WebStorm对Vue的支持.要想让WebStorm支持Vue主要分两步,第一步是安装Vue.js插件,使得WebStorm能够对Vue语法进行提示:第二步是配置Vue模板,即快速创建Vue文件. 1.安装Vue.js插件 点击Preferences进入WebStorm的配置页面,然后点击Plugins设置插件. 点击Browse Reposito

vue中npm run dev运行项目不能自动打开浏览器!以及 webstorm跑vue项目jshint一直提示错误问题的解决方法! 1.上个项目结束就很久没有使用vue了,最近打算用vue搭建自己的个人站点就准备先创建项目. 然后就出现了一系列问题,可能是很久没用吧,太生疏了,之前又不小心把环境变量删除了,结果各种不是内部或外部命令. 这里要说的问题就是一个让我很不爽的问题: I  Your application is running here: http://localhost:8080

sass语法.使用它带来的好处,就不再这里做介绍了,主要看怎么在webstorm里配置自动编译. sass编译是需要Ruby环境的,可以到这里去下载  :  https://rubyinstaller.org/downloads/    ,安装时选择加入Path 安装完成后需测试安装有没有成功,运行CMD输入以下命令: ruby -v //如安装成功会打印 ruby -- revision ) [i386-mingw32] 如上已经安装成功,Ruby自带一个叫做RubyGems的系统,用来安装基

通过配置路由,可以设置vue项目启动后默认显示的页面.路由的path设置为path:"/",启动项目后就会显示默认的组件页面. import Vue from 'vue' import Router from 'vue-router' Vue.use(Router) import Home from '../components/Home.vue' import View from '../components/View.vue' import ViewTwo from '../com

下载路径: https://github.com/virtoolswebplayer/ReactNative-LiveTemplate 本插件可以配合Webstorm设置代码提示. Mac下安装 Webstorm2016.1为例安装路径 在终端:$ cd ~/Library/Preferences/ $ ls 找到Webstorm版本 $ open WebStorm2016.1 先将ReactNative.xml复制到options文件夹里一份 为确保万无一失,再创建一个templates文件夹

Webstorm是一个很牛叉的IDE,现在工作每天都是用它了. 最近开始用SASS,LESS等来写CSS,而在Webstorm中,它自带一个File Watchers功能,设置一下,即可实时编译SASS,LESS等. LESS的实时编译很简单,在node平台安装一下即可. 而在折腾SASS在Webstorm上的实时编译时,花了我一点时间.因为按照网上的教程设置都不成功,最后自己把设置改来改去终于折腾好了. 下面就是在WebStorm设置SASS的File Watchers的步骤: 1. 安装Ru

一.IntelliJ IDEA支持.vue文件 安装vue.js file --> settings --> plugins,输入vue,点击搜索结果里的vue.js右边的install按钮,安装成功后重启idea,这样idea就能识别.vue文件了 设置vue新建文件模板 file-->setting-->editor-->file and code Templates,选择Vue File,然后可以在右边框中编辑默认模板内容,编辑完点击"ok". 这样

彻底解决eslint与webstorm针对vue的script标签缩进处理方式冲突问题 2018年12月08日 21:58:26 Kevin395 阅读数 1753   背景不多介绍了,直接上代码. 打开项目根上下的.eslintrc.js,将rules节点中添加以下配置项. rules: { 'vue/script-indent': ['error', 2, {'baseIndent': 1}] } 其中第1个2是指统一缩进2个空格,第2个1是指1倍缩进. 另外需要添加以下节点,与rules同

平时看视频,发现好多老师使用 Typora 时,界面跟我的不一样,好看一些,后来查了下才知道老师使用了Vue主题,接下来我就记录下设置Vue主题的步骤吧 一.下载Vue主题 地址:http://theme.typora.io/theme/Vue/ 二.添加主题 1.打开Typora,点击左上角 "文件" ->"偏好设置" -> "打开主题文件夹" 2.解压下载后的Vue主题zip包,并把里面的vue文件夹.vue.css.vue-da

WebSorm是一款优秀的前端开发工具,而Vue项目可以使用Node进行编译运行,平常我们可以通过命令行部署项目进行调试. 本文介绍设置Webstorm进行快速部署Vue项目. 第一步 点击启动快捷按钮旁边的向下小箭头,在列表中选择Edit选项: 第二步 打开启动设置页面后,点击左上角的加号添加新的运行方式: 第三步 在弹出的选择框中,选择node.js启动模式: 第四步 在新打开的设置页面中,在红色圈中的地方设置如图路径的文件: 至此设置成功,直接点启动按钮就可以部署项目.

今天安装了Node.js,配置了vue需要的框架,发现原有的wenstorm新建文件的时候没有vue文件选项,因此,学习了一下webstorm如何配置创建vue文件 具体过程如下: 第一步,打开webstorm , 然后File-->settings-->plugin 第二步,Show 选择 All plugins,然后在搜索框中输入vue,这时候点击右下角的apply 第三步:打开file-->settings-->editor-->File and Code Templa

现在已经有vue.js的插件啦,setting --> plugins 就可以咯 ------------------------------------------------ Mac端WebStorm用户. command + , 打开偏好设置,选择plugins,,点击下方的browse repositories... 在打开窗口的搜索栏里打"vue". 有两个插件 但是都不是官方的. 如果想要高亮显示*.vue文件,可以在File Types 选项里找到HTML,然后在下

一.首先安装 node.js 安装成功后在cmd里面使用:node -v 命令查看安装是否成功 下载链接: 链接:https://pan.baidu.com/s/1CL9J4Ryp3sL0zPYKJyS-3A 提取码:d8gl 安装国内的npm镜像源:npm install -g cnpm --registry=https://registry.npm.taobao.org 安装完成后使用:npm -v 或者cnpm -v (推荐使用cnpm 这样更快) 安装vue脚手架:vue-clinpm

本文转自:http://www.lred.me/2016/01/07/webstorm%E6%B7%BB%E5%8A%A0-vue%E6%96%87%E4%BB%B6%E6%94%AF%E6%8C%81/ webstorm是前端开发神器,但我一直都不喜欢webstorm,就因为那很挫的配色和那大光标. 上阵子开始玩 Vuejs,在 Vue 中,可以 .vue 文件实现组件化,但各种编辑器都支持不好,作者也给sublime开发了相关的vue插件.我觉得用sublime就是在浪费生命啊,花那么多时间

用Jade模板引擎写html确实方便,元素不用闭合,很多种简写的方法. 为了要知道自己写的对不对,就要用到jade -w命令监控jade文件,只要变化就编译. 现在用webstorm写代码的超多,可以通过其中的Filewatcher的方式关联jade命令做到自动化编译生成html文件. 步骤: 1.当然是安装jade,装过的就忽略. npm install -g jade 2.设置Webstorm,添加filewatcher for jade 点击菜单项“File->Settings...”,在

启动webStorm之后,点击“FIle"菜单,选择其下的”Settings" 2.在左侧的菜单中选择“Editor/Colors & Fonts/Font 在右侧Scheme Name后侧的”Save as...“按钮,另存一个设置,然后可以修改字体大小和字体.

前端开发中,经常需要将做好的页面给其他同事预览或手机测试,之前一直用的第三方本地服务器usbwebserver,偶然了解到WebStorm内置服务器也可以满足此需求,来看看如何设置吧~~ 1.端口更改和允许外部:更改端口号“63342”为“8080”,并“√”可以接受外部链接,如下 2.在部署中增加一条规则 3.设置规则名称和方式 4.设置文件地址(前端页面本地文件夹路径)和访问路径(本机IP和8080端口): 5.第二个选项卡中的地址与前面保持一致(前端页面本地文件夹路径) OK,设置完成,现

新建Scheme + 修改字体 ctrl+alt+s打开Settings界面,Editor > Colors&Fonts > Font. Default scheme是亮色调,但我想定制一套暗背景的环境,所以在右侧Scheme name下拉框中选择Monokai,以此作为修改的基础,然后点击Save as,给自己新建的Scheme起个名字吧,如下图: 这里面可以设置字体(我一般选择Consolas),字体大小,行间距. 自定义语法高亮 用ctrl+alt+s打开Settings界面,E