当前位置: 首页 > Web前端 > HTML5

Webpack4高手之路第二天

时间:2023-04-05 14:03:05 HTML5

Webpack基础配置02打包多个js文件延续Webpack基础配置01的内容,在./src/script目录下创建一个demo.js文件,参考main中的demo.js文件.js开发模式进行打包。npmrundev还将打包后的js文件bundle.js导入到index.html中,并打开控制台。正确输出如下:引用css文件在src路径下新建目录css,并在其下创建style。css文件内容如下:在main.js中引入css文件。webpack默认不支持css文件,所以需要安装style-loader和css-loader插件。loader是一个支持打包的工具css-loader:用于加载css文件的style-loader:支持css运行安装style-loader和css-loadernpminstallstyle-loadercss-loader--save-dev后安装成功,需要在引用css文件的地方添加如下代码:require("style-loader!css-loader!../css/style.css")注意:style-loader!css-loader!此顺序不可撤销!开始运行:这里npmrundev,打包多个js文件和css文件成功!