webpack

const path = require('path');

module.exports = {
   
    mode: "production",                         // "production" | "development" | "none"           //所选模式告诉webpack相应地使用其内置优化。
    entry: "./app/entry",                       // string | object | array // 默认为 ./src          // 这里应用程序开始执行 // webpack 开始打包
    output: {
                                      // webpack 如何输出结果的相关选项
        wasmLoading: 'fetch',                    //string      //此选项用于设置加载 WebAssembly 模块的方式
        workerChunkLoading: false,              //string: 'require' | 'import-scripts' | 'async-node' | 'import' | 'universal' boolean: false//用于控制 workder 的 chunk 加载            
        asycnChunks: true,                       //创建按需加载的异步 chunk。
        path: path.resolve(__dirname, "dist"),   // string (default)     // 所有输出文件的目标路径    // 必须是绝对路径（使用 Node.js 的 path 模块）
        filename: "[name].js",                  // string (default)     // entry chunk 的文件名模板
        publicPath: "/assets/",                 // string               // 输出解析文件的目录，url 相对于 HTML 页面
        library: {
                                 // 这里有一种旧的语法形式可以使用（点击显示）
            type: "umd",                          // 通用模块定义          //导出库的类型
            name: "MyLibrary",                    // string | string[]    //导出库的名称

            /*高级输出。库配置（单击以显示）---------------------------------------------*/
            export: "default",                  // string | string[]
            export: undefined,                  //暴露整个命名空间对象resp。单元导出值（默认值）
            export: "named",                    //公开命名导出
            export: ["named", "property"],      //公开嵌套属性
            //应公开的入口模块的导出
            auxiliaryComment: "comment",
            auxiliaryComment: {
    amd: "comment", commonjs: "comment", commonjs2: "comment", root: "comment" },//在UMD包装器中添加注释
            umdNamedDefine: false,              //对UMD包装的AMD部分使用命名的define()
            // -------------------------------------------------------------------------

        },
        uniqueName: "my-application",           // （默认为package.json“name”）  // 此生成的唯一名称，以避免与同一HTML中的其他生成冲突
        name: "my-config",                      // 输出中显示的配置名称

        /* 高级输出配置（点击显示） -----------------------------------------------------*/
        chunkFilename: "[name].js",
        chunkFilename: "[id].js",
        chunkFilename: "[contenthash].js",                          // 长效缓存  //其他块的文件名模板
        assetModuleFilename: "[hash][ext][query]",                  // string   //asset模块的文件名模板
        webassemblyModuleFilename: "[hash].module.wasm",            // string   //wasm模块的文件名模板
        sourceMapFilename: "[file].map",                            // string
        sourceMapFilename: "sourcemaps/[file].map",                 // string   // source map location 的文件名模板
        devtoolModuleFilenameTemplate: "webpack:///[resource-path]", // string  // devtool 模块的文件名模板
        devtoolFallbackModuleFilenameTemplate: "webpack:///[resource-path]?[hash]", // string   // devtool 模块的文件名模板（用于冲突）
        crossOriginLoading: "use-credentials",                      // enum
        crossOriginLoading: "anonymous",
        crossOriginLoading: false,                                  //指定运行时如何发出跨源请求
        trustedTypes: false,                                        // boolean (default) | string | object  //受信任类型支持
        importFunctionName: "import",                               // string (default)  //使用import()时调用的表达式  //可以替换为使用polyfills           
        importMetaName: "import.meta",                              // string (default)  //使用import.meta时使用的表达式   //可以替换为使用polyfills
        // --------------------------------------------------------------------------------

        /*专业输出配置1（自行承担风险）------------------------------------------------------*/
        pathinfo: true,                             // boolean
        charset: true,                              // string //在生成的代码中包含有关模块、导出、请求等的有用路径信息   //向注入的脚本标记添加charset属性
        chunkLoadTimeout: 120000,                   // number (default)   //加载块超时
        compareBeforeEmit: true,                    // boolean (default)   //在写入磁盘之前，将生成的资产与磁盘上的资产进行比较
        strictModuleErrorHandling: true,            // boolean      //按照 ES Module 规范处理 module 加载时的错误，会有性能损失
        devtoolNamespace: "MyLibrary",              // string    //devtools源名称中的前缀    //默认为output.uniqueName
        environment: {
                                 //关于环境的属性
            arrowFunction: true,
            bigIntLiteral: true,
            const: true,
            destructuring: true,
            dynamicImport: true,
            forOf: true,
            module: true
        },
        globalObject: "self",                   // string (default),  //指向全局对象的表达式
        iife: true,                             // boolean (default)  //将捆绑包包裹在IIFE中进行隔离
        module: false,                          // boolean (default)  //生成模块类型的javascript文件，而不是经典脚本
        scriptType: "module",                  //向注入的脚本标记添加类型属性
        //---------------------------------------------------------------------------------------

        /* Expert输出配置2（自行承担风险） -------------------------------------------------------*/
        chunkLoading: "jsonp",                  // "jsonp" | "import-scripts" | "require" | "async-node" | false   //加载块的方法  
        chunkLoadingGlobal: "myWebpackJsonp",   // string     //用于加载块的全局变量的名称
        enabledChunkLoadingTypes: ["jsonp"],    // string[]   //可用的块加载方法
        enabledLibraryTypes: ["var"],           // string[]   //可用的库类型
        enabledWasmLoadingTypes: ["var"],       // string[]   //可用的wasm加载方法
        chunkFormat: "array-push",
        chunkFormat: "commonjs",
        chunkFormat: false,                     //块的格式
        hotUpdateMainFilename: "[fullhash].hot-update.json",        // string  //HMR清单的文件名模板
        hotUpdateChunkFilename: "[id].[fullhash].hot-update.js",    // string  //HMR块的文件名模板
        hotUpdateGlobal: "hmrUpdateFunction",                       // string  //用于加载热更新块的全局变量的名称
        sourcePrefix: "\t",                                         // string  //在捆绑包中为模块源添加前缀以提高可读性 //但打断多行模板字符串
        hashFunction: "md4",                                        // string (default)    //一般使用的哈希函数
        hashDigest: "hex",                                          // string (default)    //使用的哈希摘要类型
        hashDigestLength: 20,                                       // number (default)    //哈希的长度
        hashSalt: "salt",                                           // string | Buffer     //一个额外的哈希盐，用于修复哈希相关问题或更改哈希
        //----------------------------------------------------------------------------------------

    },
    module: {
                                      // 模块配置相关
        generator: {
                               //5.12.0+ 在一个地方配置所有生成器的选项
            asset: {
   
                // asseet 模块的 generator 选项

                // 自定义 asset 模块的 publicPath，自 webpack 5.28.0 起可用
                publicPath: 'assets/',

                // 将静态资源输出到相对于 'output.path' 的指定文件夹中，webpack 5.67.0 后可用
                outputPath: 'cdn-assets/',
            },
            'asset/inline': {
   
                // asset/内联模块的 generator 选项
            },
            'asset/resource': {
   
                // asset/资源模块的 generator 选项

                // 自定义 asset/resource 模块的 publicPath，自 webpack 5.28.0 起可用
                publicPath: 'assets/',

                // 将静态资源输出到相对于 'output.path' 的指定文件夹中，webpack 5.67.0 后可用
                outputPath: 'cdn-assets/',
            },
            javascript: {
   
                // 该模块类型尚不支持 generator 选项
            },