How to return real URL of styles on the SSR

[mustaqball]

I don't know how to make webpack5 use real URL of styles on the server-side. When I launch the application on a node, I see an error - unexpected token (less file). How do I get it to work?

I am using the following webpack configuration:

> module.exports = {
>   target: 'node',
>   externals: [webpackNodeExternals()],
>   mode: 'production',
>   devtool: 'source-map',
>   context: path.resolve(__dirname, '..'),
>   entry: {
>     main: [
>       './src/client.js'
>     ]
>   },
>   output: {
>     chunkLoading: false,
>     wasmLoading: false,
>     path: assetsPath,
>     filename: '[name].[fullhash].js',
>     chunkFilename: '[name].[chunkhash].chunk.js',
>     publicPath: '/dist/'
>   },
>   performance: {
>     hints: false
>   },
>   optimization: {
>     minimize: false,
>     minimizer: [
>       new TerserPlugin({
>         parallel: true,
>         terserOptions: {
>           output: {
>             comments: false
>           }
>         }
>       })
>     ]
>   },
>   module: {
>     rules: [
>       {
>         test: /\.jsx?$/,
>         use: [
>           {
>             loader: 'babel-loader',
>             options: {
>               exclude: /node_modules/
>             }
>           }
>         ]
>       },
>       {
>         test: /\.css$/,
>         use: [
>           {
>             loader: MiniCssExtractPlugin.loader
>           },
>           {
>             loader: 'css-loader',
>             options: {
>               importLoaders: 1,
>               sourceMap: true
>             }
>           },
>           {
>             loader: 'postcss-loader',
>             options: {
>               sourceMap: true
>             }
>           }
>         ]
>       },
>       {
>         test: /\.less$/,
>         use: [
>           {
>             loader: MiniCssExtractPlugin.loader
>           },
>           {
>             loader: 'css-loader',
>             options: {
>               modules: {
>                 localIdentName: 'k_[hash:base64:5]'
>               },
>               importLoaders: 2,
>               sourceMap: true
>             }
>           },
>           {
>             loader: 'postcss-loader',
>             options: {
>               sourceMap: true
>             }
>           },
>           {
>             loader: 'less-loader'
>           }
>         ]
>       },
>       {
>         test: /\.scss$/,
>         use: [
>           {
>             loader: MiniCssExtractPlugin.loader
>           },
>           {
>             loader: 'css-loader',
>             options: {
>               modules: {
>                 localIdentName: 'k_[hash:base64:5]'
>               },
>               importLoaders: 2,
>               sourceMap: true
>             }
>           },
>           {
>             loader: 'postcss-loader',
>             options: {
>               sourceMap: true
>             }
>           },
>           {
>             loader: 'sass-loader',
>             options: {
>               sourceMap: true
>             }
>           }
>         ]
>       },
>       {
>         test: /\.woff?(\?v=\d+\.\d+\.\d+)?$/,
>         type: 'asset/inline'
>       },
>       {
>         test: /\.woff2?(\?v=\d+\.\d+\.\d+)?$/,
>         type: 'asset/inline'
>       },
>       {
>         test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
>         type: 'asset/inline'
>       },
>       {
>         test: /\.(png|jpg|gif)$/i,
>         type: 'asset/inline'
>       }
>     ]
>   },
>   resolve: {
>     modules: [
>       'src',
>       'node_modules'
>     ],
>     fallback: {
>       "assert": false,
>       "buffer": false,
>       "net": false,
>       "http": require.resolve("stream-http"),
>       "https": false,
>       "zlib": false,
>       "tty": false,
>       "url": false,
>       "util": false,
>       "stream": false,
>       "os": false,
>       "process": require.resolve("process/browser"),
>       "path": require.resolve("path-browserify")
>     },
>     alias: {
>       process: "process/browser"
>     },
>     extensions: ['.json', '.js', '.jsx']
>   },
>   plugins: [
>     new webpack.ProgressPlugin(),
>     new CleanWebpackPlugin(),
>     new MiniCssExtractPlugin({
>       filename: '[name].[fullhash].css',
>       chunkFilename: '[name].[chunkhash].chunk.css',
>     }),
>     new webpack.DefinePlugin({
>       'process.env.NODE_ENV': '"production"',
> 
>       __CLIENT__: true,
>       __SERVER__: false,
>       __DEVELOPMENT__: false,
>       __DEVTOOLS__: false
>     }),
>     new webpack.IgnorePlugin(/\/moment$/),
>     new TerserPlugin(),
>     new LoadablePlugin(),
>     new HtmlWebpackPlugin({
>       filename: 'index.html',
>       template: 'src/pwa.js'
>     }),
>     new WebpackManifestPlugin({
>       seed: {
>         name: '',
>         short_name: '',
>         theme_color: '#B5E5F8',
>         background_color: '#B5E5F8',
>         display: 'standalone',
>         orientation: 'landscape',
>         start_url: '/'
>       }
>     }),
>     new BundleAnalyzerPlugin({
>       analyzerMode: 'static',
>       openAnalyzer: false
>     })
>   ]
> };
> ```

[alexander-akait]

Can you put your configuration and code in github repo?