当前位置：首页 > article >正文

fetch-event-source 如何通过script全局引入

article 2025/1/11 6:03:29

fetchEventSource源码中导出了两种类型的包cjs和esm。但是有个需求如何在原生是js中通过script标签引呢？需要加上type=module。今天介绍另一种方法

下载源码文件： https://github.com/Azure/fetch-event-source.git

安装:

npm install --save-dev webpack webpack-cli ts-loader typescript

然后在根目录创还能webpack.config.js ：

const path = require('path');

module.exports = {
  entry: './src/index.ts',  // TypeScript 入口文件
  module: {
    rules: [
      {
        test: /\.ts$/,        // 匹配所有以 .ts 结尾的文件
        use: 'ts-loader',     // 使用 ts-loader 来处理这些文件
        exclude: /node_modules/
      }
    ]
  },
  resolve: {
    extensions: ['.ts', '.js']  // 支持导入时省略 .ts 和 .js 后缀
  },
  output: {
    filename: 'fetchEventsource.js',      // 输出的打包文件名
    path: path.resolve(__dirname, 'dist'),  // 输出文件的路径
    library: 'SSE',       // 使输出的文件作为全局库在浏览器中使用
    libraryTarget: 'var',       // 输出为一个变量，适合在浏览器中通过 script 标签直接使用
  },
  mode: 'production'  // 生产环境模式，自动优化打包
};

执行：npx webpack

最后生成一个dist目录中的文件bundle.js

查看全文

http://www.kler.cn/a/298465.html