Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

CssSyntaxError (1:1) Unknown word > 1 | // extracted by mini-css-extract-plugin

See original GitHub issue

    mode: 'production',
    devtool: '#source-map',
    plugins: [
        new webpack.DefinePlugin({
            'process.env.NODE_ENV': JSON.stringify('production')
        }),
        new MiniCssExtractPlugin({
            filename: path.resolve(__dirname, '../dist/css/[name].[contenthash].css')
        })
    ],
    module: {
        rules: [{
            test: /\.css$/,
            use: [
                MiniCssExtractPlugin.loader,
                'css-loader'
            ]
        }]
    }

ERROR in ./src/style/style.css (./node_modules/_css-loader@2.1.0@css-loader/dist/cjs.js!./node_modules/_mini-css-extract-plugin@0.5.0@mini-css-extract-plugin/dist/loader.js!./node_modules/_css-loader@2.1.0@css-loader/dist/cjs.js!./src/style/style.css) Module build failed (from ./node_modules/_css-loader@2.1.0@css-loader/dist/cjs.js): CssSyntaxError

(1:1) Unknown word

1 | // extracted by mini-css-extract-plugin | ^

Issue Analytics

State:
Created 5 years ago
Reactions:3
Comments:17 (3 by maintainers)

Top GitHub Comments

27reactions

alexander-akaitcommented, Mar 6, 2019

@fangshuaituo you have multiple loader for css please check your configuration, see on error, css-loader again execute on extracted file

3reactions

alexander-akaitcommented, Mar 6, 2019

Looks baseWebpackConfig already contains rules for css

Top Results From Across the Web

unknown word" with webpack.config.js file - Stack Overflow

In webpack, when you list multiple loaders within a rule, they are evaluated from right to left (in your case, bottom to top), ......

MiniCssExtractPlugin - webpack

This plugin extracts CSS into separate files. It creates a CSS file per JS file which contains CSS. It supports On-Demand-Loading of CSS...

mini-css-extract-plugin - npm

extracts CSS into separate files. Latest version: 2.7.2, last published: 23 days ago. Start using mini-css-extract-plugin in your project by ...

“Unknown word” error showing after adding postcss-loader

I am trying to add postcss loader in my webpack but after adding postcss loader showing Unknown word error . I also attached...

Separating CSS | webpack surviveJS - GitHub Pages

const MiniCssExtractPlugin = require("mini-css-extract-plugin"); exports. ... build failed: CssSyntaxError: or Module build failed: Unknown word error, ...