webpack如何把dist.js中某个模块js打包成一个全局变量,使得在html引入dist.js后可以直接访问

webpack可以通过使用expose-loader来将模块中的一个js文件暴露为全局可以访问的变量。下面是一个示例代码:
1、安装expose-loader

npm install expose-loader --save-dev

2、webpack.config.js配置文件

值得注意的是:我在本地使用16.14.2版本的node打包时会报一些警告,升级node18.12.1未报警告,警告信息如下:
在这里插入图片描述

module.exports = {
   
  entry: "./lib/index.js",
  output: {
   
    path: path.resolve(__dirname, "dist"),
    filename: "dist.js",
    clean: true,
  },
  module: {
   
    rules: [
      {
   
        test: require.resolve('./lib/index.js'), // 模块的路径
        use: [
          {
   
            loader: 'expose-loader',
            options: {
   
              exposes: 'outName' // 替换为你想要暴露的全局变量名
            }
          }
        ]
      }
    ]
  }
};

在这里插入图片描述

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-01-24 09:46:06       94 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-01-24 09:46:06       100 阅读
  3. 在Django里面运行非项目文件

    2024-01-24 09:46:06       82 阅读
  4. Python语言-面向对象

    2024-01-24 09:46:06       91 阅读

热门阅读

  1. 前端项目数据埋点接入神策

    2024-01-24 09:46:06       69 阅读
  2. vscode debug

    2024-01-24 09:46:06       49 阅读
  3. Golang bytes 包学习

    2024-01-24 09:46:06       49 阅读
  4. 手写rpc和redis

    2024-01-24 09:46:06       52 阅读
  5. SASS简介及使用方法

    2024-01-24 09:46:06       56 阅读
  6. Matlab使用Python

    2024-01-24 09:46:06       55 阅读
  7. Flutter 屏幕适配之相对尺寸适配

    2024-01-24 09:46:06       44 阅读
  8. uniapp 中使用 rem 以及改变窗口动态刷新页面

    2024-01-24 09:46:06       39 阅读
  9. Node.js Shell 脚本开发指南(中)

    2024-01-24 09:46:06       46 阅读