使用样式加载器加载一些CSS,并在Webpack 2中加载一些带有to-string-loader的CSS

Question

我正在开发一个Angular 2应用程序,目前正在尝试用Webpack 2构建它(这是我第一次涉足Webpack).

我明白之间的差style-loader和to-string-loader,前者增加了CSS到DOM,后者产生一个字符串数组角为2至经由消耗styles特性.

我的问题是,我可以同时拥有两个吗？换句话说,如果我在文件中有全局样式site.css,那么在不改变组件样式(to-string-loader,css-loader)的行为的情况下,将这些样式与Webpack捆绑在一起的正确方法是什么？

只是要求或导入它们main.ts似乎不足以让Webpack弄清楚要做什么.

Answer 1

装载机可以重写为特定模块的请求：

require("!!style!css!./global-styles/site.css");

或者可以为不同的条件定义不同的加载器：

module: {
    loaders: [
        {
            test: /\.css$/,
            include: [path.resolve(__dirname, "global-styles")],
            loaders: ['style', 'css']
        },
        {
            test: /\.css$/,
            exclude: [path.resolve(__dirname, "global-styles")],
            loaders: ['to-string', 'css']
        },
    ...