搭建react环境

安装步骤

新建文件夹

初始化 npm init，会出现三个文件夹

安装webpack： npm i webpack-cli webpack webpack-dev-server -D

安装babel：npm i babel-loader @babel/core @babel/preset-env @babel/preset-react -D

安装react： npm ireact react-dom

安装css：npm icss-lodaer style-loader需在配置文件配置

ant design组件库：npm i antd需在使用组件内引入

配置文件

module.exports导出

mode设置开发环境或生产环境

enter设置入口文件

output设置出口文件

rules里设置匹配名称与匹配规则

module.exports={
    mode:"development",
    entry:"./components/app.js",
    output:{
        path:__dirname,
        filename:"index.js"
    },
    devServer:{
        static:"./",
        historyApiFallback:true
    },
    module:{
        rules:[{
            test:/\.(js|jsx)$/,
            exclude:/node_modules/,
            use:{
                loader:"babel-loader",
                options:{
                    presets:["@babel/preset-env","@babel/preset-react"]
                }
            }
        },{
            test:/\.css$/,
            use:["style-loader","css-loader"]
        }]
    }
}