webpack打包高级es语法示例:

默认情况下,webpack打包js不会做任何转换和编译 而至原样输出,所以让浏览器支持es高级语法需要用babel来转换。

javascript 复制代码
npm install --save-dev @babel/preset-env 
@babel/core 
babel-loader
javascript 复制代码
webpack.config.js
const miniCssExtractPlugin = require('mini-css-extract-plugin')

module.exports = {
    entry: './src/index.js',
    output: {
        filename: 'main.js',
    },
    mode: 'development', // 或者 'production'
    module: {
        rules: [
            {
                test: /\.js/,
                exclude: /(node_modules)/,
                use: {
                    loader: 'babel-loader',
                    options: {
                        presets: ['@babel/preset-env']
                    }
                }
            }
    ]
    }
}
javascript 复制代码
src/index.js
const fn = (a) => {
    console.log('fn')
    return a+1
}
fn(2)

const promise = () => {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            console.log('promise')
            resolve('success')
        }, 2000);
    })
}
(async()=>{
    await promise()
    console.log('aaa')
})()
相关推荐
阿成学长_Cain2 小时前
Linux dirs命令详解|Bash目录堆栈管理快速切换目录实战教程
linux·运维·前端·数据库
yqcoder2 小时前
httpOnly 是什么,又有什么用?
开发语言·前端·javascript
IT_陈寒2 小时前
Java的Stream.parallel()把我CPU跑爆了,这种优化要谨慎
前端·人工智能·后端
小皮虾3 小时前
小程序首页性能优化实战:从 4 秒到 1.8 秒
前端·微信小程序
山河木马3 小时前
GPU自动处理专题1-裁剪到底在裁什么(裁剪)
前端·webgl·计算机图形学
奔跑的蜗牛ing3 小时前
CentOS Nginx 安装与静态文件服务器配置指南
前端·面试·架构
子兮曰3 小时前
Bun 重写为 Rust:11天、64个Claude、16.5万美元,一次改变行业认知的激进实验
前端·后端·bun
子兮曰3 小时前
Node.js v26.5.0 深度解读:import Text、流式 ReadableStreamTee、以及隐藏的安全加固浪潮
前端·后端·node.js
子兮曰3 小时前
TypeScript 7.0 RC 深度解读:Go 重写完成,10 倍提速,编译器的「奇点时刻」
前端·后端·typescript