如何在 Webpack 中使用 2 个 CSS 文件

【问题标题】：How to use 2 CSS files in Webpack如何在 Webpack 中使用 2 个 CSS 文件
【发布时间】：2017-08-22 16:12:06
【问题描述】：

我是 Webpack 的新手，已经安装了 "webpack": "^3.5.5" 包。这是我的 webpack.config.js。

module: {
        rules: [
            {
                test: /\.css$/,
                use: ['style-loader', 'css-loader']
            },
            {
                test: /\.js$/, exclude: /node_modules/, loader: "babel-loader"
            }
        ]
    }

它适用于一个 CSS 文件，但我想加载 2 个 CSS 文件。 1-引导 2- style.css

我尝试了一些在 Github 上找到的配置，但没有帮助。我该怎么做？

【问题讨论】：

标签： webpack webpack-2

【解决方案1】：

css 文件的加载是通过从 js 文件中导入来完成的。因此，如果您想使用文件 'style.css'，请从 js 文件中导入，例如：

import './style.css';

然后 webpack 将使用 css 加载器来引入你的样式。

【讨论】：

我已经做到了。但它不会同时加载两者。我对两者都使用了require，它只加载一个保持在上面的。
我不确定你是如何包含引导程序的。使用 bootstrap，如果要引入 html 文件，您可能只想在头部使用一个链接标签。如果您真的想通过 webpack 引入它，则必须以相同的方式导入它并引用主 css 文件无论它住在哪里。如果在 node_modules 中，则不需要完整的路径，webpack 会默认查找那里。