bump to telegraf@4

[Tsuk1ko]

telegraf@4 requires too many native node modules and globals that are not available in the cfworker environment.

I can't make the compiled product work in cfworker.

[mochaaP]

Hi!

Just managed to get telegraf@4 working with Webpack 5 (using native Cloudflare Worker events instead of @cfworker/web because I want to use Toucan :P can be easily migrated though).

Unfortunately, due to Gitpod's outage, my efforts are gone 😢 But it shows that it is actually possible to achieve this (with some dirty hack in webpack.config.js).

I'm also trying building telegraf with rollup, as it's almost 10s faster than Webpack 5 with esbuild as a minifier. Who don't like speedy builds? However, XHR was introduced in rollup's node core polyfills, which Cloudflare Workers lacks support of as it's a pretty old API. What's worse, the mixing of CommonJS and ES Modules in the codebase is not friendly with that and prevents CommonJS statements being transpiled. No luck so far, I guess I would just stick with Webpack at this point.

[mochaaP]

Example webpack.config.js:

const path = require('path')
const webpack = require('webpack')
const { ESBuildMinifyPlugin } = require('esbuild-loader')

const mode = process.env.ENVIRONMENT.toLowerCase() || process.env.NODE_ENV.toLowerCase() || 'production'

module.exports = {
  entry: './src/index.ts',
  target: 'webworker',
  output: {
    filename: 'worker.js',
    path: path.join(__dirname, 'dist')
  },
  mode,
  devtool: 'source-map',
  module: {
    rules: [
      {
        test: /\.tsx?$/,
        loader: 'esbuild-loader',
        options: {
          loader: 'ts',
          target: 'es2019'
        }
      }
    ]
  },
  resolve: {
    fallback: {
      stream: require.resolve('stream-browserify'),
      http: require.resolve('stream-http'),
      https: require.resolve('https-browserify'),
      url: require.resolve('url/'),
      path: require.resolve('path-browserify'),
      util: require.resolve('util/'),
      crypto: require.resolve('crypto-browserify'),
      buffer: require.resolve('buffer/'),
      fs: false
    }
  },
  plugins: [
    new webpack.ProvidePlugin({
      Buffer: [require.resolve('buffer/'), 'Buffer'],
      process: require.resolve('process/browser')
    })
  ],
  optimization: {
    minimizer: [
      mode === 'production' ? new ESBuildMinifyPlugin({
        target: 'es2019'
      }) : null
    ]
  }
}

esbuild is optional.

And add a polyfill in entrypoint:

import 'abortcontroller-polyfill/dist/polyfill-patch-fetch'

Confirmed working in:

"dependencies": {
  "abortcontroller-polyfill": "^1.7.3",
  "buffer": "^6.0.3",
  "crypto-browserify": "^3.12.0",
  "https-browserify": "^1.0.0",
  "path-browserify": "^1.0.1",
  "process": "^0.11.10",
  "stream-browserify": "^3.0.0",
  "stream-http": "^3.2.0",
  "telegraf": "^4.4.1",
  "tiny-request-router": "^1.2.2",
  "url": "^0.11.0",
  "util": "^0.12.4"
},
"devDependencies": {
  "@cloudflare/workers-types": "^2.2.2",
  "@types/node": "^16.7.1",
  "esbuild": "^0.12.21",
  "esbuild-loader": "^2.15.1",
  "ts-standard": "^10.0.0",
  "typescript": "^4.3.5",
  "webpack": "^5.51.1",
  "webpack-cli": "^4.8.0"
}

[realByg]

ebpack 5 (using native Cloudflare Worker events instead of @cfworker/web because I want to use Toucan :P can be easily migrated though).

Anyway to get it working with webpack 4 though? Since wragnler uses webpack 4 by default and I want to use wrangler dev for local testing

[mochaaP]

ebpack 5 (using native Cloudflare Worker events instead of @cfworker/web because I want to use Toucan :P can be easily migrated though).

Anyway to get it working with webpack 4 though? Since wragnler uses webpack 4 by default and I want to use wrangler dev for local testing

Bringing your own bundler is actually the preferred way in official docs for now, give it a try!

[Tsuk1ko]

I finally make it works! I'm sorry I'm too lazy

I will release version 2.0 as soon as possible.

[mochaaP]

Thank you for your efforts!