sublim安装Autoprefixer插件

 有时候在写css样式的时候,分不清哪些属性需要前缀,哪些不需要写前缀,sublime text这款编辑器下安装autoprefixer这款插件可以省去很多问题,写起来也很方便。

1 确保系统已经安装node.js
可直接去官网上下载并安装,我的系统是win7只能安装低版本的node.js
官网:https://nodejs.org/en/download
老版本:https://nodejs.org/en/about/previous-releases
我下载版本的是v13.14.0 https://nodejs.org/download/release/v13.14.0/
根据自己系统选择 我的是64位直接选择node-v13.14.0-x86.msi 下载 根据提示安装即可。
安装成功后在命令行执行node -v和npm -v 查看当前版本
在这里插入图片描述
2 sublime text下安装插件autoprefixer
打开sublime text编辑器,Ctrl + shift + p,选择Install package,然后输入autoprefixer,即可开始安装。安装完后,并不能立即使用,还得配置一下快捷键,选择Preferences =》 Key Bindings,添加如下代码:

[
	{ 
		"keys": ["ctrl+alt+shift+p"], 
		"command": "autoprefixer" 
	}
]

选择Preferences => Package Settings => Autoprefixer,在文件右侧添加如下代码

{
  "browsers": ["last 20 versions", "> 5%", "Firefox >= 10", "ie 6-11"],
  "cascade": true,
  "remove": true
}

其中last 20 versions表示浏览器最近的20个版本(这个数据可随意更改), 5%表示市场份额大于5%(百分比可随意),Firefox >= 10表示火狐浏览器版本大于或等于10

编辑代码:

 .demo { display: flex; } 

ctrl+alt+shift+p 会提示错误如下图:
在这里插入图片描述
找到sublim安装插件的目录 找到autoprefixer目录进入之后删除node_modules目录和package-lock.json文件,删除之后进入命令行cd到autoprefixer插件目录 按照提示执行npx browserslist@latest --update-db ,执行完之后还是会报错根据提示执行npm install caniuse-lite
这时候在测试代码再次执行 ctrl+alt+shift+p

.box {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}

最终sublim会根据CSS样式自动补上前缀

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/298152.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

网络实训模拟考察题目和答案(华为eNSP综合实验考试)

拓扑中四个交换机五个路由器,共九个设备 答案是对应的九个脚本(从设备命名到保存) 全部复制粘贴后,从PC1、PC2都是能Ping通服务器的(保及格),其他要求没检查 题目 VLAN信息 设备名称端口链路…

【设计模式之美】面向对象分析方法论与实现(一):需求分析方法论

文章目录 一. 需求举例二. 对案例进行需求分析1. 第一轮基础分析2. 第二轮分析优化3. 第三轮分析优化4. 第四轮分析优化5. 最终确定需求 三. 小结 本文主要描述: 面向对象的需求分析方法论 一. 需求举例 假设,你正在参与开发一个微服务。微服务通过 HTT…

软件测试|SQL JOIN的用法,你会了吗?

SQL JOIN 是在关系型数据库中常用的操作,用于将两个或多个表中的数据合并起来,以满足查询需求。本文将介绍 SQL JOIN 的基本概念、不同类型的 JOIN,以及使用示例。 SQL JOIN 的概念 在关系型数据库中,数据通常分布在多个表中&am…

【C语言】关闭socket需要包含的头文件

一、问题 linux系统&#xff0c;包含了头文件<sys/socket.h>&#xff0c; 警告 warning: implicit declaration of function ‘close’; did you mean ‘pclose’? [-Wimplicit-function-declaration] close(sockclient); ^~~~~ pclose 二、解决 在 Linux 系统下…

网络安全是什么?一文认识网络安全

一、网络安全 1.概念 网络安全从其本质上讲就是网络上的信息安全&#xff0c;指网络系统的硬件、软件及数据受到保护。不遭受破坏、更改、泄露&#xff0c;系统可靠正常地运行&#xff0c;网络服务不中断。 &#xff08;1&#xff09;基本特征 网络安全根据其本质的界定&#…

labview 与三菱FX 小型PLC通信(OPC)

NI OPC服务器与三菱FX3U PLC通讯方法 一、新建通道名称为&#xff1a;MIT 二、选择三菱FX系列 三、确认端口号相关的参数&#xff08;COM端&#xff1a;7.波特率&#xff1a;9600&#xff0c;数据位&#xff1a;7&#xff0c;校验&#xff1a;奇校验&#xff0c;停止位&#xf…

码农的周末日常---2024/1/6

上周总结 按照规划进行开发&#xff0c;处事不惊&#xff0c;稳稳前行 2024.1.6 天气晴 温度适宜 AM 睡觉前不建议做决定是真的&#xff0c;昨天想着睡到中午&#xff0c;今天九点多醒了&#xff0c;得了&#xff0c;不想睡了 日常三连吧&#xff0c;…

面试官:String为什么要设计为不可变类

程序员的公众号&#xff1a;源1024&#xff0c;获取更多资料&#xff0c;无加密无套路&#xff01; 最近整理了一份大厂面试资料《史上最全大厂面试题》&#xff0c;Springboot、微服务、算法、数据结构、Zookeeper、Mybatis、Dubbo、linux、Kafka、Elasticsearch、数据库等等 …

@JsonFormat与@DateTimeFormat

JsonFormat注解很好的解决了后端传给前端的格式&#xff0c;我们通过使用 JsonFormat可以很好的解决&#xff1a;后台到前台时间格式保持一致的问题 其次&#xff0c;另一个问题是&#xff0c;我们在使用WEB服务的时&#xff0c;可 能会需要用到&#xff0c;传入时间给后台&am…

数据处理四 基于图像hash进行数据整理(删除重复图片、基于模版查找图片)

一、背景知识 1.1 什么是hash Hash&#xff0c;一般翻译做“散列”&#xff0c;也有直接音译为“哈希”的&#xff0c;基本原理就是把任意长度的输入&#xff0c;通过Hash算法变成固定长度的输出。这个映射的规则就是对应的Hash算法&#xff0c;而原始数据映射后的二进制串就…

如何使用免费的ZeroSSL证书保护您的网站

使用 ZeroSSL 在您的站点上轻松实施 SSL。我们的指南涵盖了免费证书设置&#xff0c;确保安全和加密的用户连接。 如今&#xff0c;保护您的网站不仅是一种建议&#xff0c;而且是一种必需品。这就是SSL证书发挥作用的地方。它们对用户浏览器和网站之间传输的数据进行加密&…

Golang高质量编程与性能调优实战

1.1 简介 高质量&#xff1a;编写的代码能否达到正确可靠、简洁清晰的目标 各种边界条件是否考虑完备异常情况处理&#xff0c;稳定性保证易读易维护 编程原则 简单性 消除多余的重复性&#xff0c;以简单清晰的逻辑编写代码不理解的代码无法修复改进 可读性 代码是写给人看…

云原生学习系列之基础环境准备(单节点安装kubernetes)

一、环境要求 操作系统CentOS 7.x-86_x64 硬件配置&#xff1a;内存2GB或2G&#xff0c;CPU 2核或CPU 2核&#xff0c;需要在虚拟机中提前设置好&#xff0c;不然后续会报错 二、系统初始化 1、设置主机名 # 在master节点执行 hostnamectl set-hostname master01 2、配置主…

时间序列预测 — LSTM实现多变量多步负荷预测(Tensorflow):多输入多输出

目录 1 数据处理 1.1 导入库文件 1.2 导入数据集 ​1.3 缺失值分析 2 构造训练数据 3 LSTM模型训练 4 LSTM模型预测 4.1 分量预测 4.2 可视化 1 数据处理 1.1 导入库文件 import time import datetime import pandas as pd import numpy as np import matplotlib.p…

Kafka消息阻塞:拯救面试的八大终极解决方案!

大家好&#xff0c;我是小米&#xff0c;一个对技术充满热情的90后程序员。最近在准备社招面试的过程中&#xff0c;遇到了一个超级有挑战性的问题&#xff1a;“Kafka消息阻塞怎么解决&#xff1f;”今天&#xff0c;我就来和大家一起深入剖析这个问题&#xff0c;分享我在解决…

Python从入门到网络爬虫(MySQL链接)

前言 在实际数据分析和建模过程中&#xff0c;我们通常需要从数据库中读取数据&#xff0c;并将其转化为 Pandas dataframe 对象进行进一步处理。而 MySQL 数据库是最常用的关系型数据库之一&#xff0c;因此在 Python 中如何连接 MySQL 数据库并查询数据成为了一个重要的问题…

【MySQL四大引擎,数据库管理,数据表管理,数据库账号管理】

一. MySQL四大引擎 查看存储引擎 SHOW ENGINES support 字段说明 defaulti的为默认的引擎 为YES表示可以使用 为NO表示不能使用 四大引擎 InnoDB InnoDB表类型可以看作是对MyISAM的进一步更新产品&#xff0c;它提供了事务、行级锁机制和外键约束的功能&#xff0c;也是目前…

Python中的cls语法

在Python中&#xff0c;cls 是一个用于指代类本身的约定性名称&#xff0c;通常用作类方法&#xff08;class method&#xff09;中的第一个参数。cls 类似于 self&#xff0c;它是对类的引用&#xff0c;而不是对实例的引用。cls 通常在类方法中用于访问类级别的属性和方法。举…

智能门锁人脸识别好用监控不好用是怎么回事?

智能门锁的人脸识别和监控所用的主要硬件都是摄像头&#xff0c;如果二个功能都共用同一摄像头的话&#xff0c;所拍出来的图像清晰度应该是一样的&#xff0c;但有些智能锁可能并非如此&#xff0c;况且它们是两个不同的功能&#xff0c;所以成像的清晰度可能并不一样&#xf…

栅极驱动芯片三种隔离技术

栅极驱动芯片三种隔离技术 1.栅极驱动器概述2.隔离栅极驱动芯片2.1隔离驱动器重要指标 3.三种常见隔离技术3.1光隔离3.2变压器隔离/磁隔3.3电容隔离 4.三种隔离器性能对比 1.栅极驱动器概述 栅极驱动器&#xff0c;在任何功率水平为任何应用高效可靠地驱动任何功率开关。 比如M…