Primeract and nextjs webpack config

Question

How can I primereact css import to nextjs I did it according to the nextjs documentation. but it gave the error. I have to install loader.but I'm new to webpack. I dont find how to webpack config. Please produce a solution.

Answer 1

This is what worked for me in webpack.config.js file:

var webpack = require('webpack');
var path = require('path');
var nodeExternals = require('webpack-node-externals');

module.exports = {
    target: 'web',
    entry: './src/index.js',
    output: {
    path: path.resolve(__dirname, 'build'),
    filename: 'index.js',
    libraryTarget: 'commonjs2'
    },
    module: {
        rules: [
            {
                test: /\.js$/,
                include: path.resolve(__dirname, 'src'),
                exclude: /(node_modules|bower_components|build)/,
                use: {
                loader: 'babel-loader',
                options: {
                    presets: ['env']
                }
                }
            },
            {
                test: /\.css$/i,
                use: ['style-loader', 'css-loader'],
            },
            {
                test: /\.(png|jpg|woff|woff2|eot|ttf|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
                loader: 'url-loader?limit=100000'
            }
        ]
    },
    mode: 'development'
};

Actually your need correct loaders to transpile from ES6 to ES5.

This should work.