1.安裝webpack.
npm install webpack -g
2.創建一個文件夾app.
3.新建文件test.js.
require("!style-loader!css-loader!./style.css");
document.write(require('./test2'));
4.新建文件test2.js
module.exports = "I'm from test2.js.";
5.新建style.css.
body{ background:red; }
6.新建一個html頁面
<html> <head> <meta charset="utf-8"> </head> <body> <script type="text/javascript" src="bundle.js" charset="utf-8"></script> </body> </html>
7.現在開始打包js和css.
npm i css-loder style-loader //打包之前先確保這個兩個庫已經安裝
webpack test.js bundle.js
至此,我發現文件夾中多了一個bundle.js的文件。在html頁面中引用后就可以正常使用。
*注意 打包的CSS是這樣開頭: !style-loader!css-loader!