时间戳

首页 > 解决方案 > 无法使用自定义 next.js 和 express 服务器加载 css

reactjs - 无法使用自定义 next.js 和 express 服务器加载 css

问题描述

拒绝应用来自“ https://www.example.com/_next/2.83c6f8132fcdb15b2703.css ”的样式，因为它的 MIME 类型（“text/html”）不是受支持的样式表 MIME 类型，并且启用了严格的 MIME 检查。

            handle(req, res);
        });


        server.get('*', (req, res) => {
            return handle(req, res);
        });```

标签： reactjsexpressnext.js

解决方案

We were not aware that extract-css-chunks-webpack-plugin can take loaction and file name as well. We were only giving file name. So it was generating css on root which is not accessible by next by _next. 

   **Old Code**
<pre>config.plugins.push(new ExtractCssChunks({
    filename: isProduction ? '[name].[hash].css' : '[name].css',
    chunkFilename: isProduction ? '[id].[hash].css' : '[id].css',
    ignoreOrder: true
}));</pre>

**New Code After Fixing the issue**
<pre>config.plugins.push(new ExtractCssChunks({
    filename: isProduction ? 'static/css/[name].[hash].css' : 'static/css/[name].css',
    chunkFilename: isProduction ? 'static/css/[id].[hash].css' : 'static/css/[id].css',
    ignoreOrder: true
}));</pre>

推荐阅读