使用webpack捆绑CSS
我有几个NPM mudules,我试图捆绑webpack,所以我不必使用CDN。
我能弄清楚如何使.js
文件工作,但我不明白如何获得相同模块的.css
文件。
例如我有Bootstrap
有一个NPM模块。 在我的entry.js文件中,我require('bootstrap');
但只有给我的JavaScript文件。
我已经看到其他npm模块像bootstrap-webpack
等,但我不明白为什么我需要下载另一个模块,如果我已经有我的node_modules
引导部分。 与“font-awesome”,“animate.css”,“select2”
我错过了什么?
据我所知,Bootstrap支持commonJS模块加载器。 所以你可以使用require()加载引导js文件。
当你使用require('bootstrap')时,引导程序的入口文件被加载,然后入口文件加载库的另一个文件部分。 (其实引导入口文件只加载一个文件/dist/js/bootstrap.js
)[检查官方]回购( https://github.com/twbs/bootstrap/tree/master/dist/js ))。
在这个过程中,如果引导程序使用require('some.css')
加载css,webpack尝试加载css。 但是require('some.css')不是泛化的方法。 没有webpack或browserify或其他构build系统,CSS不能通过require()加载。 这就是为什么你一定需要bootstrap-webpack
。
另外,bootstrap不仅可以用在webpack中,还可以用在requirejs(AMD)或<script>
标签中。 所以你必须手动或通过bootstrap-webpack
加载css。