`SyntaxError: Unexpected token 'export'` after upgrading to 5.1.0

[scott-ln]

• Operating System: Windows 10, but using Git Bash
• Node Version: 12.13.0
• NPM Version: 6.13.4
• webpack Version: 4.42.0
• file-loader Version: 5.1.0

Expected Behavior

Build succeeds.

Actual Behavior

A build error occurs. It makes reference to extract-loader, but the error is only triggered after installing file-loader 5.1.0. Downgrading to 4.3.0 removes the error. The error seems to be occurring while processing home.scss but also mentions a .woff font file so I imagine it's occurring when the stylesheet loading fonts is encountered.

$ npm run build:Release

> project@1.0.0 build:Release C:\Users\scott\project
> webpack --app=all --env=production && webpack --app=all --env=development

Hash: 271542f7375d971c6a70fbd56a5b1bcfa280fcb88239f7b135fa8523cbfc0c985150ab6f5fcdc43b8b0f0b7b33a1e932bd95
Version: webpack 4.42.0
Child
    Hash: 271542f7375d971c6a70
    Time: 9842ms
    Built at: 03/03/2020 12:13:32
     3 assets
    Entrypoint home = home.js home.js.map
     [98] ./src/styles/home.scss 2.01 KiB {0} [built] [failed] [1 error]
    [148] [successful builds snipped]
          |     + 7 hidden modules
    [149] ./src/styles/fonts/GVS_Icons.woff 64 bytes [built]
        + 147 hidden modules

    ERROR in ./src/styles/home.scss
    Module build failed (from ./node_modules/extract-loader/lib/extractLoader.js):
    C:\Users\scott\project\src\styles\fonts\GVS_Icons.woff:1
    export default __webpack_public_path__ + "fonts/GVS_Icons.woff";
    ^^^^^^

    SyntaxError: Unexpected token 'export'
        at new Script (vm.js:84:7)
        at C:\Users\scott\project\node_modules\extract-loader\lib\extractLoader.js:81:28
        at Generator.next (<anonymous>)
        at step (C:\Users\scott\project\node_modules\babel-runtime\helpers\asyncToGenerator.js:17:30)
        at C:\Users\scott\project\node_modules\babel-runtime\helpers\asyncToGenerator.js:35:14
        at new Promise (<anonymous>)
        at new F (C:\Users\scott\project\node_modules\core-js\library\modules\_export.js:36:28)
        at C:\Users\scott\project\node_modules\babel-runtime\helpers\asyncToGenerator.js:14:12
        at evalModule (C:\Users\scott\project\node_modules\extract-loader\lib\extractLoader.js:150:63)
        at C:\Users\scott\project\node_modules\extract-loader\lib\extractLoader.js:138:28
        at Generator.next (<anonymous>)
        at step (C:\Users\scott\project\node_modules\babel-runtime\helpers\asyncToGenerator.js:17:30)
        at C:\Users\scott\project\node_modules\babel-runtime\helpers\asyncToGenerator.js:28:13
        at runMicrotasks (<anonymous>)
        at processTicksAndRejections (internal/process/task_queues.js:93:5)
     @ ./src/components/home.jsx 23:0-43
     @ ./src/homePage.jsx

Code

Relevant parts of webpack config

    {
        test: /\.jsx?$/,
        exclude: /node_modules/,
        use: {
            loader: "babel-loader"
        }
    },
    {
        test: /\.(s*)css$/,
        use: [
            {
                loader: "file-loader",
                options: {
                    name: "[name].css"
                }
            },
            "extract-loader",
            "css-loader",
            {
                loader: "sass-loader",
                options: {
                    prependData: "$env:" + env + ";"
                }
            }
        ]
    },
    {
        test: /\.(woff|woff2|eot|ttf)$/,
        use: [
            {
                loader: "url-loader",
                options: {
                    // Convert images < 8kb to base64 strings
                    limit: 8000,
                    name: "fonts/[name].[ext]"
                }
            }
        ]
    }

main.scss

@import "fonts";
@import "abstracts/__abstracts-dir";
@import "base/__base-dir";
@import "dev/__dev-dir";
@import "components/__components-dir";

fonts.scss

@font-face {
    font-family: 'GVS_Icons';
    src: url('fonts/GVS_Icons.woff') format('woff')
}

How Do We Reproduce?

[alexander-akait]

It is bug on extract-loader side, please open an issue in their repo, as a workaround you can set esModule: false (please read https://github.com/webpack-contrib/file-loader#esmodule)

[scott-ln]

@evilebottnawi Will do, thank you.