본문 바로가기

error records

[webpack error] code: 'ERR_INVALID_ARG_TYPE'

반응형

 

 

 

 

npm run build 를 실행하다가 나타난   code: 'ERR_INVALID_ARG_TYPE' 에러 메세지 

 

배포용으로 빌드할 때의 webpack.config.js 설정은 개발 설정과 다르게 plugin의 ReactRefreshWebpackPlugin 이 있으면 안된다고 한다. 

 

배포용으로 만들 때 제거해야할 것 ↓↓

ReactRefreshWebpackPlugin
React-refresh/babel 

 

개발일 때는 가능 / 배포용일 때는 주석처리하기 

->아래처럼 주석처리를 하고 다시 npm run build를 하니깐 되었다 ! 

const path = require('path')
//const RefreshwebpackPlugin = require('@pmmmwh/react-refresh-webpack-plugin')  //   1 
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const webpack = require('webpack')
// const mode = 'production'
// const devtool = 'hidden-source-map'
const mode = 'development'
const devtool = 'eval'
const isDevelopment = mode === 'production';
const refresh = isDevelopment ? [] : ['react-refresh/babel']

module.exports = {
    name:'ingoo',
    mode:mode,
    devtool:devtool,

    resolve:{
        extensions:['.js', '.jsx']
    },

    entry:{
        app:['./index.jsx']
    },
    module:{
        rules:[
            {
                test:/\.jsx?$/,
                loader:'babel-loader',
                options:{
                    presets:[
                        ['@babel/preset-env',{
                            targets:{browsers:['last 2 chrome versions']}
                        }],
                        '@babel/preset-react'
                    ],
                    plugins:refresh
                },
            },
            {
                test:/\.css$/,
                use:[MiniCssExtractPlugin.loader,'css-loader']
            }
        ],
    },

    plugins:[
        //new RefreshwebpackPlugin(),                             //   2
        new webpack.LoaderOptionsPlugin({debug:true}),
        new MiniCssExtractPlugin({ filename: 'app.css' })
    ],
    output:{
        path:path.join(__dirname,'dist'),
        filename:'app.js',
        publicPath:'/dist',
    },

    devServer:{
        publicPath:'/dist',
        hot:true,
        proxy: {
            '/api': 'http://localhost:3000',
        },
        host: '0.0.0.0',
    }
}

 

 

반응형