webpack解決css兼容性問題小結
更新時間：2024年05月15日 09:39:05 作者：小強有個dream
這篇文章主要介紹了webpack解決css兼容性問題小結,本文通過實例代碼給大家介紹的非常詳細,需要的朋友可以參考下
webpack解決css兼容性示例
npm install --save-dev postcss-loader autoprefixer
webpack.config.js
module.exports = {
entry: './src/index.js',
output: {
filename: 'main.js',
},
// mode: 'production', // 或者 'production'
module: {
rules: [{
test: /\.css$/i,
use: [
'style-loader',
'css-loader',
'postcss-loader'
]
}]
},
}創(chuàng)建postcss.config.js文件
postcss.config.js
module.exports = {
plugins: {
'autoprefixer': {
browsers: [
'> 1%',
'last 2 versions',
'not ie <= 8'
]
}
}
}src/index.js
import './module.css'
src/module.css
body {
display: flex;
}在打包的js文件中搜索webkit 或在瀏覽器打包審查元素， 可以看到前綴是有生效的
到此這篇關于webpack解決css兼容性示例：的文章就介紹到這了,更多相關webpack解決css兼容性內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！
相關文章
JavaScript操作XML實例代碼（獲取新聞標題并分頁，并分頁）
XML 代碼部分 這是一個新聞的XML 文件，如果 NBody部分包含 XML 和Html 不可識別部分， 就 包含在DATA 表示附中。2010-05-05
這篇文章主要為大家詳細介紹了JS實現拖拽元素時與另一元素碰撞檢測，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-08-08
這篇文章主要介紹了js如何給json對象添加、刪除、修改屬性問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2023-10-10
本篇文章主要介紹了webpack處理 css\less\sass 樣式的方法，小編覺得挺不錯的，現在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-08-08
TypeScript最大的一個特點就是變量是強類型的,也就是說在聲明變量的時候我們必須給他一個類型,下面這篇文章主要給大家介紹了關于TypeScript語法詳解之類型操作的補充,需要的朋友可以參考下2022-08-08
TypeScript 憑借其強大的類型系統,提供了一項稱為泛型的功能,它使開發(fā)人員能夠編寫可重用和類型安全的代碼,泛型允許您創(chuàng)建可以處理多種類型（而不是單個類型）的組件,本文深入探討了 TypeScript 泛型,提供了詳盡的解釋和代碼示例來說明它們的用法和好處2024-02-02
這篇文章主要為大家詳細介紹了微信小程序自定義單項選擇器樣式，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-07-07
這篇文章主要給大家介紹了關于利用jsonp解決js讀取本地json跨域的問題，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2018-12-12
今天小編就為大家分享一篇防止Layui form表單重復提交的實現方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09
chinaz利用了ajax實現評論的讀取操作，下面我們參考chinaz的代碼2008-05-05