Webpack Simple Configuration

Const Extracttextplugin = require (' Extract-text-webpack-plugin ')//packaged CSS splits, pulling a part outConst WEBPACK = require (' Webpack ');//introduction of the Webpack, using LodashConst Htmlwebpackplugin = require (' Html-webpack-plugin ')//to package HTMLConst PATH = require (' path ');//introducing node's path moduleConst Copywebpackplugin = require (' Copy-webpack-plugin ') Module.exports=function() {    return{entry:'./src/index.js ', Output: {path:path.resolve (__dirname,‘.. /dist '),//location, destination path of the output fileFileName: ' [name].js ',            //Publicpath:publicpath,            //sourcemapfilename: ' [Name].map '}, Optimization: {splitchunks: {chunks:' All '}}, resolve: {//solve, react-router-dom and other dependent react packet error missing react problemalias: {' React ': ' Nervjs ',                ' React-dom ': ' Nervjs ',                //This configuration is not necessary unless you want to use Createclass .' Create-react-class ': "Nerv-create-class"}, modules: [//Find directory for modulesPath.resolve (__dirname, ' ... /node_modules ')], extensions: [". js", ". Json", ". Jsx", ". css",//extension of the file used}, module: {rules: [{test:/\.js$/,                    //include: [                    //path.resolve (__dirname, ' src ')                    // ],Use: ' Babel-loader '                },                //CSS introduces foreign or public styles, confusing with modular CSS causes extraneous styles to not recognize                //public styles are now uniformly placed under the assets folder{test:/\.css$/, include: [Path.resolve (__dirname,‘.. /src/assets ')], Use:ExtractTextPlugin.extract ({fallback:' Style-loader ', use: [' Css-loader '                        ]                    })                },                //CSS Module retroflex suffixation configuration{test:/\.css$/, exclude: [Path.resolve (__dirname,‘.. /src/assets '),                    ],                    //Use : ' Css-loader 'use:ExtractTextPlugin.extract ({fallback:' Style-loader ', use: [{loader:' Css-loader ', Options: {modules:true, Sourcemap:true, Importloaders:1, Localidentname:' [Name]__[local]___[hash:base64:5] '                                }                            }                        ]                    }) }, {test:/\. (jpg|png|gif) $/, use: [{loader:' File-loader '//loading files based on file address}]}, {test:/\. (woff|woff2|eot|ttf|svg) $/, use: [{loader:' url-loader?limit=100000 '//} ]}],}, plugins: [ /c6>//Extracting CSS            NewExtracttextplugin (' Style.css '),            //Copy the past style files directly            NewCopywebpackplugin ([//The other files under SRC are copied directly to the Dist directory{from: ' Src/assets ', to: '. /dist/assets ' }            ]),            //the entry address here must be written correctly!            Newhtmlwebpackplugin ({filename:' Index.html ', Template:'./index.html '            })        ],    };}

Package.json

{  "Name": "IDHP",  "Version": "1.0.0",  "description": "",  "Main": "Index.js",  "Scripts": {    "Dev": "Webpack-dev-server--env." Node_env=dev--config webpack.config.js--mode Development ",    "Build": "Webpack--env." Node_env=prod--mode Production "  },  "keywords": [],  "Author": "",  "License": "ISC",  "Devdependencies": {    "@babel/core": "^7.0.0-beta.53",    "@babel/plugin-transform-react-jsx": "^7.0.0-beta.53",    "@babel/preset-env": "^7.0.0-beta.53",    "Babel-loader": "^8.0.0-beta.0",    "Copy-webpack-plugin": "^4.5.2",    "Css-loader": "^1.0.0",    "Extract-text-webpack-plugin": "^4.0.0-beta.0",    "File-loader": "^1.1.11",    "Html-webpack-plugin": "^3.2.0",    "Postcss-loader": "^2.1.6",    "Style-loader": "^0.21.0",    "Webpack": "^4.16.0",    "Webpack-cli": "^3.0.8",    "Webpack-dev-server": "^3.1.4",    "Webpack-merge": "^4.1.3"  },  "Dependencies": {    "Nervjs": "^1.3.1",    "React-router-dom": "^4.3.1",    "Swiper": "^4.3.3"  }}

Webpack Simple Configuration