1.安裝依賴
npm i style-loader css-loader url-loader file-loader -d
2.新建index.css
.box
3.新建index.html
<html
lang
="en"
>
<
head
>
<
title
>
title
>
head
>
<
body
>
<
div
class
="box"
>
div>
body
>
html
>
4.在main.js中引用index.css
import './css/index.css'
5.在webpack.config.js中配置
module: ,//處理路徑
]}
6.url-loader會把檔案自動進行編碼，如不需要base64可以設定limit屬性配置位元組大小小於指定數量在進行base64
7.ur-loader生成的檔案會自動重名，如不需重新命名可配置name屬性
8.如出現根目錄檔名相同覆蓋問題可在檔名增加隨即字首
學習webpack4 樣式處理
學習webpack4 基礎配置 學習webpack4 html處理 學習webpack4 樣式處理 學習webpack4 es6語法轉化 學習webpack4 第三方庫的使用 學習webpack4 抽離公共部分 持續中 注意 開始之前以下內容之前，需要配置一些webpack的基礎配置，傳送門 學習w...
學習webpack4 樣式處理
學習webpack4 基礎配置 學習webpack4 html處理 學習webpack4 樣式處理 學習webpack4 es6語法轉化 學習webpack4 第三方庫的使用 學習webpack4 抽離公共部分 持續中 注意 開始之前以下內容之前，需要配置一些webpack的基礎配置，傳送門 學習w...
學習webpack4 樣式處理
學習webpack4 基礎配置 學習webpack4 html處理 學習webpack4 樣式處理 學習webpack4 es6語法轉化 學習webpack4 第三方庫的使用 學習webpack4 抽離公共部分 持續中 注意 開始之前以下內容之前，需要配置一些webpack的基礎配置，傳送門 學習w...