Shulou(Shulou.com)06/01 Report--

This article mainly introduces how to add browser compatibility knowledge to the CSS3 style in webpack3, the content is detailed and easy to understand, the operation is simple and fast, and has a certain reference value, I believe you will have something to gain after reading this webpack3 article on how to add browser compatibility to the CSS3 style, let's take a look.

1. To deal with css in webpack, you must first install the following two loader

Npm install-save-dev css-loader style-loader

two。 To handle sass and add browser prefixes, you need to download the following plug-ins and loader

/ / sass-loader depends on node-sass, so install node-sass//postcss-loader autoprefixer postcss to handle browser compatibility

Npm install-save-dev sass-loader node-sass postcss-loader autoprefixer postcss

The configuration in 3.webpack is as follows

This is an example provided on the official website that can be used. There is no need to create a separate configuration file.

Click to enter the official website address

{

Test: /\ .scss $/

Exclude: / node_modules/

Use: [

'style-loader'

{loader: 'css-loader',options: {importLoaders: 2}}, / / 2 represents a few more loader after css-loader

{loader: 'postcss-loader',options: {plugins: [require ("autoprefixer") ("last 100 versions")]}}

'sass-loader'

]

}

This is the end of the article on "how to add browser compatibility to CSS3 styles in webpack3". Thank you for reading! I believe that everyone has a certain understanding of the knowledge of "how to add browser compatibility to CSS3 style in webpack3". If you want to learn more, you are welcome to follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.