• 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
                }
           }
        }
    }
  • 相关阅读:
    Tab支持的DHTML Window控件
    仿新浪游戏频道js多栏目全屏下拉菜单导航条
    Jquery实现超酷的时间轴特效
    DIV+CSS专题:第一天 XHTML CSS基础知识
    网站建设:详解网页扁平化设计
    简洁的支持展开关闭的tab标签代码
    JS总结
    codevs 1296 营业额统计 (splay 点操作)
    codeforces gym 100357 H (DP 高精度)
    codeforces gym 100357 K (表达式 模拟)
  • 原文地址:https://www.cnblogs.com/xuazi-7an/p/10772606.html
Copyright © 2020-2023  润新知