样式达到10000个字符时被截断

Question

我正在尝试使用webpack将bootstrap CSS加载到我的应用程序中。 这是一个很大的项目，我们的引导程序文件是自定义的，因此我们无法再从NPM加载它。我们正在尝试从gulp迁移它。

我正在使用@import将其导入main.sass中。 @import '../vendor/bootstrap/css/bootstrap.css';

我在Webpack中使用以下配置：

module: {
        rules: [
            {
                test: /\.(s*)css$/,
                use: ['style-loader', 'css-loader', 'sass-loader']
            }
        ]
    }

当我检查在浏览器中加载的HTML时，bootstrap.css文件已加载到标记中，但奇怪的是，它恰好以10,000个字符结尾。如此一来，BS css规则的大部分内容都被切断了。

我在Webpack，样式加载器，css-loader文档和问题上都找不到关于Google的帮助。

任何人都有如何克服这一想法的想法吗？

设置：

webpack 4.33.0

bootstrap 3.3.7

css-loader 2.1.1

style-loader 0.23.1

sass-loader 7.1.0

Answer 1

我发现样式在那里，但是chrome不能显示所有代码。由于某种原因，它仅显示10.000个字符。

但是，如果我将内容os复制到样式标签中，然后将其扔到VSCode上，则所有CSS都在那里。

如果在控制台上选择一个元素，我也可以检查字符长度是否正确。