zoukankan      html  css  js  c++  java
  • webpack的基本配置项

    const path = require("path");
    const HtmlWebpackPlugin = require("html-webpack-plugin");
    const PATH = {
        app:path.join(__dirname,"./src/mian.js"),//设置入口文件
        build:path.join(__dirname,"./dist")//设置出口文件
    }
     
    module.exports = {
     
        entry:{
            app:PATH.app//匹配入口文件的名字
        },
        output:{//匹配出口文件的配置
            filename:"[name].js",
            path:PATH.build
        },
    //配置需要打包的模块
    module:{
        rules:[//规则是一个数组,主要是放你需要打包的模块,使用什么打包
            {
            test:/.(css|scss)$/,
            use:["style-loader","css-loader","sass-loader"]
            },
            {
            test:/.(js|jsx)$/,
            use:{
            loader:"babel-loader",
    //将ES6的代码转换为ES5的代码
            options:{
             presets:["@babel/env","@babel/react"]
            }
            },
        exclude:__dirname+"./node_modules"//排除不用打包的文件夹
            }
        ]
    },
    //插件的使用
    plugins:[
        new HtmlWebpackPlugin({
            filename:"index.html",//使用这个插件,可以实现文件名和渲染的文件以及ejs渲染等配置
            template:"index.html",
            title:"react"
        })
    ],
    devServer:{//跨域
        proxy:{
        "/v3":{
            target:"https://mall.api.epet.com",
            changeOrigin:true
                }
           }
        }
    }
  • 相关阅读:
    C#重载操作符的那点事
    Winform最小化托盘
    C#多线程传参
    GridView事件大全
    测试2
    测试
    FindFileByContent
    JavaScriptCallCSharp js调用C#属性与方法
    GroupBy
    查询指定属性的文件
  • 原文地址:https://www.cnblogs.com/xuazi-7an/p/10772606.html
Copyright © 2011-2022 走看看