2017-09-27 73 views
0

我需要將現有的css文件與webpack 2捆綁在一起。以前這些捆綁了ASP.NET MVC。當我閱讀關於網絡包支持的文獻時,我發現你需要使用css加載器和解壓縮文本插件,並且你需要從Javascript獲得CSS。webpack捆綁現有的css

我想要做的就是定義一堆CSS文件,將其捆綁在一起並縮小,而不必從Javascript文件開始。

我該怎麼做?我需要使用特殊的裝載機嗎?

回答

0

爲什麼不從index.js導入樣式?

或者,你可以設置像一飲而盡一個任務運行到雖然這似乎是多餘的考慮到的WebPack已經能夠處理這個給你看你的風格的文件夾中。

配合提取文本插件,反正你也會得到相同的最終結果。

0

我終於做了什麼就是讓每個我想擁有一個js文件。

例如

  • /src/content/legacy.css.js
  • /src/content/main.css.js
  • ...(其它舊包,我需要繼續支持)

每個[name] .css.js文件只包含一些導入語句: eg

import "~/content/compact.css"; 
import "~/content/responsive.css"; 
// for the ~ character I used an alias in webpack 

然後在webpack.config文件中我指向那些css.js文件。 然後我使用css-loader,style-loader和extract-text-plugin在dist文件夾中創建一個單獨的css文件。

使用自定義npm package.json腳本清理生成的js文件。

這樣我就可以得到我可以再次暴露的CSS捆綁。

請注意,我的特定項目包含分佈在多個應用程序的CSS,所以它不是一個內部應用程序的CSS。

我只關注以下文章: https://webpack.js.org/loaders/css-loader/