sass安装: 步骤:(window系统) 1.下载RubyInstaller(v2.4.3),运行安装,基本直接next安装,不过有个add to PATH的选项一定要勾选,这样就不用配置环境变量. 2.在开始程序中找到Start Command Prompt with Ruby,如下图 v 3.打开后命令行输入: 1 gem install sass 这时候可能会出现安装不成功的情况或者安装很慢(慢的想打人),因为国内伟大的GFW原因连接不上导致无法安装 所以就需要替换国内淘宝提供的镜像,依…

第一种方法(ruby方法) 先安装ruby,在windows/system32目录下 1.先查询源是什么 gem sources 2.移除原有的源头 gem sources -r http://xxxxx; 3.添加腾讯云地址 gem sources -a http://gems.ruby-china.org/; 4.在此目录下安装sass,   gem install sass 5.在安装ruby的目录下找到scss.bat文件配置到webstorm tool下 第二种方法(node-sass…

webstorm支持sass的同步编译,也就是即写即编译,并且可以指定编译后的css的目录. 本文使用的webstorm为8.0版本 scss安装:http://www.w3cplus.com/sassguide/install.html 打开webstorm: 点击左上角的File→Settings→File Watchers 在弹窗的窗口的右上角点击绿色的 ‘+’ 号,然后选择scss -----------------------------------------------------…

1)安装ruby 2)安装sass 3)配置webstorm 打开webstrom ->file->setting->Tools->file watcher 添加scss program:C:\Ruby22-x64\bin\scss.bat arguments:默认的是在scss目录中生成css,如果要改变路径就需要进行配置(这里配置的是父级目录的skin/view/css) --no-cache--update $fileName$:$FileParentDir$\skin\vi…

1.下载 Ruby  (安装过程中记得勾选添加到环境变量,安装结束最后可能会弹出一个cmd弹框,可以忽略) 2. cmd安装sass gem install sass 3. cmd检查是否安装 sass -v 重点是接下来 File>Setting>Tools>File Watchers ,点击右上角加号选择scss,出现以下界面 红框标示为解析器,每个人安装目录可能不一样,但最后几个目录肯定是相同的.附C盘安装默认路径   C:\Ruby24-x64\bin\scss.bat 绿框标示…

关于Autoprefixer Autoprefixer是一个后处理程序,不象Sass以及Stylus之类的预处理器.它适用于普通的CSS,可以实现css3代码自动补全.也可以轻松跟Sass,LESS及Stylus集成,在CSS编译前或编译后运行.详情见,https://github.com/postcss/autoprefixer 当Autoprefixer添加前缀到你的CSS,还不会忘记修复语法差异.这种方式,CSS是基于最新W3C规范产生: 使用方法: step1:安装node.js ste…

关于这个的问题,虽说不是很难,但还是踩了点小坑,下面就来介绍下如何使用webstorm配置编译sass的输出目录. 1.下载Ruby 2.使用Ruby安装sass 3.检测是否安装成功. 前面的几步很多教程上都有,就不详细说了. 一般来说,我们期望scss目录和css目录是单独分开的,在scss目录中建立index.scss的文件.会弹出如上提示,点击yes,如果不小心点了no的话-- 一样可以进入这个页面. 如果这样的默认路径,编译好的css文件是会直接生成在scss文件下. 但是我们可以将A…

一.主题配色 主题设置方法:File -> Settings -> Appearance & Behavior -> Appearance ->Theme. webstorm-setting-02.jpg 配色设置方法:File -> Settings -> Editor -> Colors & Fonts->Scheme.(注:如果你是从从Sublime text3转过来的朋友,比较偏好monokia配色的,可以参见此文 webstorm入…

一.前提条件: 1.安装ruby,如果我没记错的话,mac自带ruby,终端输入 ruby -v ,回车,如果显示ruby的版本号,则说明ruby环境已经安装好了.如果没有,自行安装ruby.例如我的mac显示: ruby 2.0.0p648 (2015-12-16 revision 53162) [universal.x86_64-darwin15] 2.安装sass,过程与win系统的一样,安装好后,终端输入 sass -v,回车,若显示sass版本号,说明已经安装好了. 例如我的mac显示…

项目中经常用到eslint语法,结合个人经验,用webstorm配置eslint "文件"->"默认设置"->"语言&框架"->"Code Quality Tools"->"ESLint" 如图片所示操作后,在"项目目录"或"相应的文件上"或"代码区域块"右键可看到"Fix ESLint Problems&…

开始刚学的时候一直用命令行来运行Node.js,网上找了些配置Node.js IDE配置的贴子,说WebStorm配置IDE最简单,自己就试了下. 1.首先安装Node这步就不说了 2.下载WebStorm并安装,一步一步的安装这个也很简单. 3.密钥注册  这个百度上可以搜一下也有好多,看自己的造化了 4.下载Node.js IDE,http://www.jetbrains.com/webstorm/download/,然后一步一步下去就配置完成,这样就会在新建项目时多一个下面的选项 具体参考…

[02]webstorm配置babel转换器+截图(by魔芋)   [02]魔芋的安装过程     01,配置babel.   02,用webstorm.注意webstorm的版本号.   03,使用webStorm自带的file watcher中的babel自动编译.需要安装一些babel库.     04,全局安装bable-cli.(实际上新的babel已经集成在babel-cli里面了.)     npm install -g babel-cli npm install--save-de…

Webstorm配置运行React Native 1.选择配置 2.选择npm,设置package等参数 3.添加拓展工具 4.配置拓展工具(核心啊) 5.运行测试,ok的.…

安装Sass和Compass sass基于Ruby语言开发而成,因此安装sass前需要安装Ruby.(注:mac下自带Ruby无需在安装Ruby!) window下安装SASS首先需要安装Ruby,先从官网下载Ruby并安装.安装过程中请注意勾选Add Ruby executables to your PATH添加到系统环境变量.如下图: 安装完成后需测试安装有没有成功,运行CMD输入以下命令: ruby -v //如安装成功会打印 ruby -- revision ) [i386-mingw3…

一.下载安装WebStorm,我的是 二.在WebStorm 中安装go插件 三.在本机安装go开发环境,直接装pkg文件,https://golang.org/doc/install 四.在WebStorm中配置SDK,GOPATH等.preferences中 五.配置运行环境, 选中Edit Configurations 配置完保存. 结束. 参考: 1. http://www.01happy.com/develop-golang-in-webstorm/ 2. http://studygo…

目录: 1.主题设置 2.模板设置 3.代码段设置 4.快捷键设置 5.显示行号+自动换行 6.配置github 7.常用快捷键 8.软件下载(破解版及汉化包) 1.主题设置 1)ctrl+alt+s 打开Settings界面,Editor > Colors&Fonts > Font. 2)Default scheme是亮色调,但我想定制一套暗背景的环境,所以在右侧Scheme name下拉框中选择Monokai,以此作为修改的基础,然后点击Save as,给自己新建的Scheme起个…

web前端开发IDE一直喜欢用WebStorm,这里简单介绍如何用WebStorm搭建一个Node.js开发环境. 首先,需要在本地安装好node.js,以及npm包管理工具.你也可以吧node.js配置到系统的环境变量中更方便. 然后,启动WebStorm,打开Edit Configurations窗口,可以点击工具栏Run—>Edit Configurations,也可以右上角 打开服务配置窗口,在左侧添加服务,右侧配置属性. 回到入口文件:mian.js,这里跟模块管理工具require.…

核心提示: WebStorm 是jetbrains公司旗下一款JavaScript 开发工具.被广大中国JS开发者誉为“Web前端开发神器”.“最强大的HTML5编辑器”.“最智能的JavaSscript IDE”等.与IntelliJ IDEA同源,继承了IntelliJ IDEA强大的JS部分的功能. WebStorm 是jetbrains公司旗下一款JavaScript 开发工具.被广大中国JS开发者誉为“Web前端开发神器”.“最强大的HTML5编辑器”.“最智能的JavaSscript…

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

最近因为工作关系,一直在做node.js的开发,学习了koa框架,orm框架sequelize,以及swagger文档的配置.但是,最近因为swagger文档使用了es6的修饰器那么个东西(在java中被称作注解),所以,node.js无法编译项目,所以就需要使用babel对es6进行转换.因为这篇文章是想写一下,如何配置使用了babel转换器的debug方法,至于怎么配置koa-swagger-decorator,我会在短期内,写篇文章专门来做这个插件的介绍. 其实,node在6版本的时候,已…

1.点开preferences 2.搜索找到“File Types” 3.找到"HTML",点击“+”按钮,添加“*.wxml”然后“apply” 4.和3一样,再找到 ‘cascading style sheet’,添加“*.wxss”,然后“apply” 5.完成3和4步骤.这时候你的小程序代码,会以你常用的html和css样式展示.如果还要配置提醒功能 需要下载配置包(下载地址: https://github.com/miaozhang9/wecharCodejar). 下载完成…

1. node.js 安装包    https://nodejs.org/en/download/ 1) 安装js解析器node.js.直接下一步就ok了. 2) 将npm压缩包解压,找到里面的lessc.cmd文件,放到c盘下一个没有中文路径的目录下,我们假如是 C:\Users\admin\AppData\Roaming\npm   2.打开webstorm→file→settings→Tools→file watching 点击“+”→less文件→Program右侧点击“...”弹出对话…

话说又开始新项目了,刚好今天学习的es6新语法可以试试手,回到家后开始继续学习,然后只是学习es6没有必要弄个gulp,总觉得浪费. 那么前端开发神器的webStorm是一定会支持es6的,于是百度了一下,期间遇到几个小坑,但好在还是弄出来了,做个笔记吧,也希望可以帮助到其他人. 1.首先就是win+r输入cmd,安装全局babel. npm install -g babel-cli babel-preset-es2015 2.安装完后新建项目. 进入项目目录后:webStorm里可以选择新建p…

下载及安装请移步   https://www.cnblogs.com/specter45/p/github.html 用webstorm上传代码时,首先要先下载git,网址一搜就可以搜到,然后开始配置webstorm,打开webstorm,在file-settings中直接搜索github,然后输入自己github的账号密码 点击test,之后就会出来了 connection successful的提示框,说明已经可以连接到你的github账户了. 连接成功之后还需要连接下载的git,还是直接在…

1.打开Webstorm的Setting 搜索,watch 找到 File watch,点击右侧加号添加Less. 2.配置, working directory. Output paths…

1.安装nodejs和eslint 2.在 webstorm 的 file - setting搜索eslint,配置eslint路径 3.在项目目录下新建.eslintrc文件 4.配置eslint ESLint 的配置分为六大块,分别是: Parser Options(解析器选项).涉及语言版本等参数.ESLin t默认只支持 ES5,如果需要支持 ES6,需要在这配置. Parser(解析器选择).可以让你自己选择ESLint的解析器.ESLint 默认使用Espress作为作为解析器,强烈…

1.下载 SlikSVN.   2.安装.路径 D:\Program Files\slik\bin.   3.在WebStorm中配置 file->settings->Version Contorl->subversion->with conmand line client       设置成你的 D:\Program Files\slik\bin\svn.exe.       安装了phpstorm之后,想配置svn,结果在file->settings->Versio…

module.exports = { /* 部署生产环境和开发环境下的URL:可对当前环境进行区分,baseUrl 从 Vue CLI 3.3 起已弃用,要使用publicPath */ publicPath: process.env.NODE_ENV === 'production' ? '/public/' : '/', /* 输出文件目录:在npm run build时,生成文件的目录名称 */ outputDir: process.env.VUE_APP_FLAG, /* 放置生成的静态…

1.下载最新的webStrom11安装包安装 https://confluence.jetbrains.com/display/WI/Previous+WebStorm+Releases/ 2.破解webStorm11 注册时选择"License server"输入"http://15.idea.lanyus.com/"点击"OK"即可快速激活JetBrains系列产品 3.百度下载git.exe,并安装.ps:记住安装路径 4.cmd 打开命令…

引入相关的node包 npm install --save style-loader sass-loader node-sass file-loader 安装好之后,为了可以在.vue和.scss中使用,需要在vue.config.js中配置对应的解析器 module.exports = { entry: ['./src/entry.js'], output: { path: __dirname, filename: 'build/main.js' }, resolve: { alias: {…