sonicoder86/vue-3-playground

Failing to build: ReferenceError: TextEncoder is not defined

bbugh opened this issue · 4 comments

bbugh commented

Thanks for making this!

With a raw clone and run, I'm seeing ReferenceError: TextEncoder is not defined both when running a server and when building for production.

  1. Clone the repo
  2. run npm install
  3. run npm run build
> vue-3-playground@ build /private/tmp/vue-3-playground
> vite build

vite v1.0.0-beta.1
⠇ Building for production...
[vite] Build errored out.
{ ReferenceError: TextEncoder is not defined
    at createChannel (/private/tmp/vue-3-playground/node_modules/esbuild/lib/main.js:97:17)
    at Object.startService (/private/tmp/vue-3-playground/node_modules/esbuild/lib/main.js:333:47)
    at ensureService (/private/tmp/vue-3-playground/node_modules/vite/dist/esbuildService.js:38:36)
    at Object.exports.transform (/private/tmp/vue-3-playground/node_modules/vite/dist/esbuildService.js:49:27)
    at Object.transform (/private/tmp/vue-3-playground/node_modules/vite/dist/build/buildPluginEsbuild.js:25:41)
    at Promise.resolve.then (/private/tmp/vue-3-playground/node_modules/rollup/dist/shared/rollup.js:18131:25)
  code: 'PLUGIN_ERROR',
  plugin: 'vite:esbuild',
  hook: 'transform',
  id:
   '/private/tmp/vue-3-playground/src-javascript/components/Payment.jsx',
  watchFiles:
   [ '/private/tmp/vue-3-playground/index.html',
     '/private/tmp/vue-3-playground/src-javascript/main.js',
     '/private/tmp/vue-3-playground/node_modules/@vue/runtime-dom/dist/runtime-dom.esm-bundler.js',
     '/private/tmp/vue-3-playground/node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js',
     '/private/tmp/vue-3-playground/node_modules/@vue/shared/dist/shared.esm-bundler.js',
     '/private/tmp/vue-3-playground/src-javascript/App.vue',
     '/private/tmp/vue-3-playground/src-javascript/store.js',
     '/private/tmp/vue-3-playground/src-javascript/router.js',
     '/private/tmp/vue-3-playground/src-javascript/at-sign.js',
     '/private/tmp/vue-3-playground/src-javascript/custom-element.js',
     '/private/tmp/vue-3-playground/src-javascript/App.vue?vue&type=script&lang.js',
     '/private/tmp/vue-3-playground/src-javascript/App.vue?vue&type=template&id=3de2916c',
     '/private/tmp/vue-3-playground/src-javascript/version.js',
     '/private/tmp/vue-3-playground/src-javascript/components/Header.vue',
     '/private/tmp/vue-3-playground/src-javascript/components/Cart.vue',
     '/private/tmp/vue-3-playground/src-javascript/components/Checkout.vue',
     '/private/tmp/vue-3-playground/src-javascript/components/Header.vue?vue&type=script&lang.js',
     '/private/tmp/vue-3-playground/src-javascript/components/Header.vue?vue&type=template&id=b5e330e8',
     '/private/tmp/vue-3-playground/src-javascript/components/Cart.vue?vue&type=script&lang.js',
     '/private/tmp/vue-3-playground/src-javascript/components/Cart.vue?vue&type=template&id=5e752a6c',
     '/private/tmp/vue-3-playground/src-javascript/components/Cart.vue?vue&type=style&index=0&lang.css',
     '/private/tmp/vue-3-playground/src-javascript/components/Checkout.vue?vue&type=script&lang.js',
     '/private/tmp/vue-3-playground/src-javascript/components/Checkout.vue?vue&type=template&id=71aaa9d4',
     '/private/tmp/vue-3-playground/logo.png',
     '/private/tmp/vue-3-playground/node_modules/vuex/dist/vuex.esm-bundler.js',
     '/private/tmp/vue-3-playground/node_modules/vue-router/dist/vue-router.esm-bundler.js',
     '/private/tmp/vue-3-playground/node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js',
     '/private/tmp/vue-3-playground/src-javascript/components/Coupon.vue',
     '/private/tmp/vue-3-playground/src-javascript/components/Item.vue',
     '/private/tmp/vue-3-playground/src-javascript/components/Exchange.vue',
     '/private/tmp/vue-3-playground/src-javascript/components/Username.vue',
     '/private/tmp/vue-3-playground/src-javascript/hooks.js',
     '/private/tmp/vue-3-playground/src-javascript/components/AsyncPayment.js',
     '/private/tmp/vue-3-playground/src-javascript/components/Spinner.js',
     '/private/tmp/vue-3-playground/src-javascript/components/Coupon.vue?vue&type=script&lang.js',
     '/private/tmp/vue-3-playground/src-javascript/components/Coupon.vue?vue&type=template&id=bae3c7b0',
     '/private/tmp/vue-3-playground/src-javascript/components/Item.vue?vue&type=script&lang.js',
     '/private/tmp/vue-3-playground/src-javascript/components/Item.vue?vue&type=template&id=866ac71c',
     '/private/tmp/vue-3-playground/src-javascript/components/Exchange.vue?vue&type=script&lang.js',
     '/private/tmp/vue-3-playground/src-javascript/components/Exchange.vue?vue&type=template&id=07b30eb5',
     '/private/tmp/vue-3-playground/src-javascript/components/Username.vue?vue&type=script&lang.js',
     '/private/tmp/vue-3-playground/src-javascript/components/Username.vue?vue&type=template&id=e347daca',
     '/private/tmp/vue-3-playground/src-javascript/components/Payment.jsx' ] }
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! vue-3-playground@ build: `vite build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the vue-3-playground@ build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

Any ideas?

It builds for me on Mac

vue3-vite-playground git:(master) npm run build

> vue-3-playground@ build /Users/esysuser/workspace/vue3-vite-playground
> vite build

vite v1.0.0-beta.1
[write] dist/_assets/index.d1fd7a67.js 85.28kb, brotli: 28.44kb
[write] dist/_assets/Payment.54a5b0b8.js 0.84kb, brotli: 0.42kb
[write] dist/_assets/style.7e98c26d.css 0.30kb, brotli: 0.15kb
[write] dist/_assets/logo.0b4beb8a.png 6.69kb, brotli: 6.26kb
[write] dist/index.html 0.92kb, brotli: 0.35kb
Build completed in 7.43s.

Does npm cisolve the issue?

bbugh commented

I tried yarn, and it reported a useful error:

error brotli-size@4.0.0: The engine "node" is incompatible with this module. Expected version ">= 10.16.0". Got "10.15.3"

When I upgraded node to 10.16.0 (or 14.4.0) it worked. npm did not report this issue. Looks like a vite issue. Sorry for the false alarm and thanks for the quick reply!