webpack 插件之 extract-text-webpack-plugin

extract-text-webpack-plugin 的作用是分離項目中的css文件,常用配置代碼如下

{
  test: /\.css$/,
  use:extractTextPlugin.extract({
  fallback:'style-loader',
  use: 'css-loader'
  })
{

plugins: {
  new extractTextPlugin('css/[name].css')
}

解釋一下fallback 的意思: 一般對css文件打包用到loader如下:

use: ['style-loader','css-loader']

css-loader 的作用是處理css文件中 @import,url之類的語句,style-loader則是將css文件內(nèi)容放在style標(biāo)簽內(nèi)并插入head中,既然使用了extract-text-webpack-plugin,按理說就沒必要配置style-loader了,實際上你不配置也可以,可是如果你不想分離css文件,可設(shè)置disable:ture來關(guān)閉該插件,這時fallback:'style-loader'就派上用場了

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 無意中看到zhangwnag大佬分享的webpack教程感覺受益匪淺,特此分享以備自己日后查看,也希望更多的人看到...
    小小字符閱讀 8,367評論 7 35
  • 版權(quán)聲明:本文為博主原創(chuàng)文章,未經(jīng)博主允許不得轉(zhuǎn)載。 webpack介紹和使用 一、webpack介紹 1、由來 ...
    it筱竹閱讀 11,458評論 0 21
  • 學(xué)習(xí)流程 參考文檔:入門Webpack,看這篇就夠了Webpack for React 一. 簡單使用webpac...
    Jason_Zeng閱讀 3,257評論 2 16
  • 目錄第1章 webpack簡介 11.1 webpack是什么? 11.2 官網(wǎng)地址 21.3 為什么使用 web...
    lemonzoey閱讀 1,828評論 0 1
  • 文科生的日子,似乎永遠是在老師的鄙視下度過的,這沒有辦法,大部分高中永遠是重理輕文的。直到我在那一天,遇上一個人。...
    大狐貍的副官閱讀 319評論 0 0

友情鏈接更多精彩內(nèi)容