1. webstrom IDE 的 setting (快捷键 Ctrl + Alt  + S)
  2. Tool -- External tool (绿色 + 添加)

   3.填写 必要的项目 后 apply

   

   备注:Name: 显示的名称

      Programs: postcss.cmd 的全局安装下的路径

      Paramters: -u autoprefix -o 输出文件  输入文件 (上面表示在输入输出都在同一个文件上并添加操作)

      Working directory: 在项目下即可

   4.添加快捷键 Keymap中 找到 External tool 文件目录下 有自己添加的工具插件 点autoprefixer 鼠标右键 选 ‘Add KeyBorad shortcut’

    

    设置没有给引用的键 (或组合)即可

    5.运行 插件效果

    

    若出现没有报错:输入有效的文件列表路径 证明你的 Paramters 参数写错了!  正确: $FileDir$/$FileName$(路径  / 文件名),对这上面配置就可以了!

    前提要通过npm全局安装 下面的两个包

    (1) npm install autoprefixer  -g

    (2) npm install pastcss-cli  -g

    大功告成!

webstorm 添加 autoprefixer 工具为CSS加前缀的更多相关文章

  1. 还在手动给css加前缀?no!几种自动处理css前缀的方法简介

    原文首发于个人博客:还在手动给css加前缀?no!几种自动处理css前缀的方法简介 我们知道在写css的时候由于要兼容不同厂商浏览器,一些比较新的属性需要给它们添加厂商前缀来兼容.移动端还好,基本只要 ...

  2. webstorm 添加css前缀(兼容)自动添加

    Webstorm自动添加css前缀( 兼容) 百度了很多在webstorm中添加css前缀(兼容)自动添加,autoprefixer插件是首选,对于基本的css,还有less都支持,所以就选择了aut ...

  3. vue-loader 调用了cssLoaders方法配置了css加载器属性。

    module: { loaders: [ // 这里也是相应的配置,test就是匹配文件,loader是加载器, { test: /\.vue$/, loader: 'vue' }, { test: ...

  4. CSS 加载新方式

    Chrome 浏览器有意改变<link rel="stylesheet">的加载方式,当其出现在<body>中时,这一变化将更加明显.笔者决定在本文中进行详 ...

  5. 发布时一键添加html中的css标签和script标签版本号来防止浏览器缓存

    AppendFileVersion 是一个VSIX插件支持vs2015意以上版本 是我用来发布时一键添加html中的css标签和script标签版本号来防止浏览器缓存 分享给大家! download ...

  6. Map工具系列-05-添加业务参数工具

    所有cs端工具集成了一个工具面板 -打开(IE) Map工具系列-01-Map代码生成工具说明 Map工具系列-02-数据迁移工具使用说明 Map工具系列-03-代码生成BySQl工具使用说明 Map ...

  7. 为网格布局图片打造的超炫 CSS 加载动画

    今天,我想与大家分享一些专门为网格布局的图像制作的很酷的 CSS 加载动画效果.您可以把这些效果用在你的作品集,博客或任何你想要的网页中.设置很简单.我们使用了下面这些工具库来实现这个效果: Norm ...

  8. 百度地图API示例之添加/删除工具条、比例尺控件

    代码 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" cont ...

  9. css加载会造成阻塞吗?

    终于考试完了,今天突然想起来前阵子找实习的时候,今日头条面试官问我,js执行会阻塞DOM树的解析和渲染,那么css加载会阻塞DOM树的解析和渲染吗?所以,接下来我就来对css加载对DOM树的解析和渲染 ...

随机推荐

  1. angular4(2-2)angular脚手架引入第三方类库(swiper)

    试了好多方法,npm install 方法失败了,下载到本地是可以使用的: 将swiper文件放到assets文件下: 项目目录下:(命令行) 因为ts并不能准确识别js语法,所以需要用ts中的int ...

  2. [JZOJ 5910] [NOIP2018模拟10.18] DuLiu 解题报告 (并查集+思维)

    题目链接: https://jzoj.net/senior/#contest/show/2530/0 题目: LF是毒瘤出题人中AK IOI2019,不屑于参加NOI的唯一的人.他对人说话,总是满口垃 ...

  3. AngularJS1 学习笔记1

    什么是 AngularJS? AngularJS 使得开发现代的单一页面应用程序(SPAs:Single Page Applications)变得更加容易. AngularJS 把应用程序数据绑定到 ...

  4. 16.boost图深度优先遍历DFS

    #include <iostream> #include <boost/config.hpp> //图(矩阵实现) #include <boost/graph/adjac ...

  5. 计算label

    func getCGSize(size:CGSize,fontSize:CGFloat,text:String)->CGSize{ let attributes = [NSFontAttribu ...

  6. jqGrid的editrules参数

    原文链接:http://blog.csdn.net/mengtianyalll/article/details/13502841 editrules    editrules是用来设置一些可用于可编辑 ...

  7. 新疆大学(新大)OJ xju 1010: 四个年级 C++ STL map 将4层循环优化成2层循环可解

    1010: 四个年级 时间限制: 3 Sec  内存限制: 128 MB 题目描述 为了加强全体软件学院的同学的较量,学院想让ACM协会设计一次活动让所以软件学院的同学都加入,并且要实现高年级和低年级 ...

  8. php 添加redis扩展

    我主要是按照http://blog.163.com/fan_xy_qingyuan/blog/static/1889877482014111111283265/ 这篇博客来的,但是这篇博客里只有php ...

  9. UVa 1638 Pole Arrangement【递推】

    题意:给出n根高度为1,2,3,---n的杆子,从左边能看到l根,右边能够看到r根,问有多少种可能 看的紫书的思路 先假设已经安排好了高度为2---i的杆子, 那么高度为1的杆子的放置方法有三种情况 ...

  10. ZBrush中功能强大的插件PaintStop

    PaintStop是ZBrush®3.1的手绘插件,可以比较真实的模拟手绘风格,尤其是用水彩笔刷画水墨风格画.PaintStop插件可供用户免费使用. PaintStop是一款功能强大的插件,已经被添 ...