Unexpected character - less and serverBundleConfig #960

Closed
opened 2025-08-09 17:18:20 +00:00 by fergalmoran · 0 comments
Owner

Originally created by @martinnov92 on 3/6/2017

Hello,

does anyone know, what to do with this error I am getting when running webpack?

Child
    Hash: 037809265d687cc5e570
    Time: 99627ms
             Asset     Size  Chunks                    Chunk Names
    main-server.js  10.5 MB       0  [emitted]  [big]  main-server

ERROR in ./ClientApp/components/MainMenu/main-menu.less
    Module parse failed: C:\Work\PD2\PD2_HVC_WebService\Application\PD.HVC.WebService\ClientApp\components\MainMenu\main-menu.less Unexpected character '@' (1:1)
    You may need an appropriate loader to handle this file type.
    | @import "../../css/less/_colors.less";
    |
    | .menu-bars {

I assume this error has something to do with serverBundleConfig in webpack.config.js. I am not getting this error when I am running build for client side.

My webpack.config.js loaders looks like this:

    const extractCSS = new ExtractTextPlugin('site.css');
    const extractLESS = new ExtractTextPlugin('build_less.css');
    const clientBundleConfig = merge(sharedConfig(), {
        entry: { 'main-client': './ClientApp/boot-client.tsx' },
        module: {
            rules: [
                { test: /\.css$/, use: extractCSS.extract({ use: 'css-loader' }) },
                {
                    test: /\.less$/,
                    loader: extractLESS.extract({
                        fallback: 'style-loader',
                        use: [
                            'css-loader',
                            'postcss-loader',
                            'less-loader'
                        ]
                    })
                },
                { test: /\.(png|jpg|jpeg|gif|svg)$/, use: 'url-loader?limit=25000' }
            ]
        },

Hope it makes sense.

Thanks for any help

*Originally created by @martinnov92 on 3/6/2017* Hello, does anyone know, what to do with this error I am getting when running `webpack`? ``` Child Hash: 037809265d687cc5e570 Time: 99627ms Asset Size Chunks Chunk Names main-server.js 10.5 MB 0 [emitted] [big] main-server ERROR in ./ClientApp/components/MainMenu/main-menu.less Module parse failed: C:\Work\PD2\PD2_HVC_WebService\Application\PD.HVC.WebService\ClientApp\components\MainMenu\main-menu.less Unexpected character '@' (1:1) You may need an appropriate loader to handle this file type. | @import "../../css/less/_colors.less"; | | .menu-bars { ``` I assume this error has something to do with serverBundleConfig in webpack.config.js. I am not getting this error when I am running build for client side. My webpack.config.js loaders looks like this: ``` const extractCSS = new ExtractTextPlugin('site.css'); const extractLESS = new ExtractTextPlugin('build_less.css'); const clientBundleConfig = merge(sharedConfig(), { entry: { 'main-client': './ClientApp/boot-client.tsx' }, module: { rules: [ { test: /\.css$/, use: extractCSS.extract({ use: 'css-loader' }) }, { test: /\.less$/, loader: extractLESS.extract({ fallback: 'style-loader', use: [ 'css-loader', 'postcss-loader', 'less-loader' ] }) }, { test: /\.(png|jpg|jpeg|gif|svg)$/, use: 'url-loader?limit=25000' } ] }, ``` Hope it makes sense. Thanks for any help
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github/JavaScriptServices#960
No description provided.