css - webpack 2.7 不会加载 blueprintjs 核心 css

Question

我正在尝试使用 blueprintjs，并且在导入它的 css 时。而且我认为我的 webpack 配置出错了，所以我看到了这个错误

有我的 webpack 配置

const ExtractTextPlugin = require('extract-text-webpack-plugin');
var webpack = require("webpack");
var path = require("path");

module.exports={
    entry: './src/index.js',
    output:{
        path: __dirname + "/public",
        filename:'bundle.js',
        publicPath: "/public/"
    },
    devServer: {
        inline: true,
        contentBase: './public',
        port: 3000
    },
    module:{
        rules: [
            {
            test: /\.js$/,
            exclude: /(node_modules)/,
            loader: "babel-loader",
            query: {
                presets: ['es2015', 'react', 'stage-0'],

            }
        }, 
        {
             test: /\.s(a|c)ss$/, 
                loader: ExtractTextPlugin.extract({loader: ['css-loader', 'sass-loader', 'style-loader']})
              },
              {
                test: /\.css$/,
                use: [
                  {
                    loader: 'style-loader',
                  },
                  {
                    loader: 'css-loader',
                  },
                ],
              },
              {
                test: /\.(|gif||svg|woff|woff2|eot|ttf)(\?v=[0-9]\.[0-9]\.[0-9])?$/, 
                loader: 'file-loader', options: {name: '[name].[ext]'}
              },  {
                test: /\.(png|jpg|)$/,
                loader: 'url-loader?limit=200000'
              },
        ] 
    },
    plugins: [
        new ExtractTextPlugin("styles.css"),
      ]

}

我正在使用 "webpack": "^2.7.0","@blueprintjs/core": "^1.34.1" 和很多加载器

我试图像这样导入我的CSS

require('!css-loader!./index.css');

就像这样

import styles from './index.css'

结果是一样的

经过额外几个小时的工作，我得到了这个错误

在这一点上，我不确定我的 webpack 有什么问题以及如何修复它，欢迎提出任何建议

Answer 1

您可以将您的 webpack 配置与 Blueprint monorepo 中的配置进行比较：https ://github.com/palantir/blueprint/tree/develop/packages/webpack-build-scripts

尝试以与基本配置相同的顺序应用加载程序：['style-loader', 'css-loader', 'sass-loader']

Answer 2

尝试使用blueprint.cssNPM 包内部的完整路径。截图中的 webpack 错误清楚地显示了 css-loader 试图加载esm/index.js一个 JS 文件，所以它当然失败了。

尝试：@import "~@blueprintjs/core/lib/css/blueprint.css";