文件压缩js语法检查css加前缀babel转换实战_IT百科

本文主要通过4个点来讲述现在前端的工作开发流程

我们一般使用autoprefixer来给我们写的css自动添加前缀，来配合不同浏览器的区别。

aotoprefixer官网介绍了它是 postcss 的一个插件，所以我们可以通过postcss来使用 autoprefixer 来自动添加前缀。 postcss官网链接介绍了怎么使用autoprefixer

npm run/cli

To use PostCSS from your command-line interface or with npm scripts there is postcss-cli .

意思：

现在分别有三种可以来检查语法的插件。 jshint jslinteslint 流行的现在是 eslint

看见命令行提示我们需要使用 eslint --init 进行初始化

会在目录下面创建一个 eslintrc.js , 根据这个配置我们来检查自己的js，安装期间出现了一个问题

安装过程和问题

在配置文件里指定环境，使用 env ，指定你想启用的环境，设置它们为 true 。例如，以下示例启用了 browser 和 Node.js 的环境：

uglify官网

总结发现它并不兼容es6的语法，所以我们需要先把 es6 转换成 es5

babel官网

babel-cli 官网

可以使用 setProperty

element.style.setProperty( '-webkit-transition', 'left 5s linear' )

也可以

element.style.webkitTransform = ''

需要准备的材料分别有：电脑、html编辑器、浏览器。

1、首先，打开html编辑器，新建html文件，例如：index.html。

2、在index.html中的<script>标签，输入js代码：$('head').append('<style>div{font-size: 32px}</style>')。

3、浏览器运行index.html页面，此时发现js成功将css代码添加到<head>标签的<style>标签中。

欢迎分享，转载请注明来源：内存溢出

文件压缩js语法检查css加前缀babel转换实战