Inline worker build without any output files or error message. #1927

meowtec · 2021-02-07T08:17:03Z

⚠️ IMPORTANT ⚠️ Please check the following list before proceeding. If you ignore this issue template, your issue will be directly closed.

Read the docs.
Use Vite >=2.0. (1.x is no longer supported)
If the issue is related to 1.x -> 2.0 upgrade, read the Migration Guide first.

Describe the bug

I am using monaco editor with inline worker, vite build output nothing. (exit at ✓ 739 modules transformed.)
(When I used vite 1, it worked as expected.

Reproduction

https://github.com/meowtec/vite-worker-bug-reproduce

System Info

vite version: 2.0.0-beta.65
Operating System: macOS Catalina
Node version: v12.18.0
Package manager (npm/yarn/pnpm) and version: npm 6.14.10

Logs (Optional if provided reproduction)

building for production...
transforming (14) node_modules/monaco-editor/esm/vs/editor/editor.worker.jsThe 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
transforming (105) node_modules/monaco-editor/esm/vs/editor/common/services/editorSimpleWorker.jsThe 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
transforming (297) node_modules/monaco-editor/esm/vs/language/json/_deps/vscode-json-languageservice/seThe 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
✓ 736 modules transformed.
✓ 739 modules transformed.
<----- vite exit here

The text was updated successfully, but these errors were encountered:

meowtec · 2021-02-07T08:33:52Z

Additional:

Using ?worker&inline:

dev: it works
build: output nothing

Using ?worker:

dev: it works too
build: worker throws with Uncaught ReferenceError: window is not defined (anothor issue to fix)

kena0ki · 2021-03-24T13:05:56Z

build: worker throws with Uncaught ReferenceError: window is not defined (anothor issue to fix)

In my case, the above error is resolved by build.rollupOptions.output.manualChunks.

// vite.config.js
import { defineConfig } from 'vite';
const prefix = `monaco-editor/esm/vs`;
export default defineConfig({
  build: {
    rollupOptions: {
      output: {
        manualChunks: {
          jsonWorker: [`${prefix}/language/json/json.worker`],
          cssWorker: [`${prefix}/language/css/css.worker`],
          htmlWorker: [`${prefix}/language/html/html.worker`],
          tsWorker: [`${prefix}/language/typescript/ts.worker`],
          editorWorker: [`${prefix}/editor/editor.worker`],
        },
      },
    },
  },
});

milomg · 2021-05-18T01:16:32Z

I see this has the p2-has-workaround label, is that because someone has managed to get rollup to output files in the inline case with minify:terser? My current resolution involves using manualChunks:{} and minify:esbuild along with a patch to get the bundle to work in firefox or safari. I would love to be able to simplify that and use rollup and terser for minification

Blakeinstein · 2021-08-02T13:11:28Z

Is there still a working workaround for this? I added the rollup options, and I added ?worker&inline to my import. Yet I get an error regarding unexpected usage with SyntaxError: import declarations may only appear at top level of a module, on just the dev server.

Here are my deps

"dependencies": {
    "monaco-editor": "^0.26.1",
    "vue": "^3.0.5"
  },
  "devDependencies": {
    "@types/node": "^16.4.10",
    "@vitejs/plugin-vue": "^1.3.0",
    "@vue/compiler-sfc": "^3.0.5",
    "typescript": "^4.3.2",
    "vite": "^2.4.4",
    "vue-tsc": "^0.2.2"
  }

milomg · 2021-08-09T00:54:59Z

I think the original issue has been resolved in Vite 2.4.

@Blakeinstein Yes, Vite no longer needs almost any workarounds for monaco-editor (last I checked, we still needed to disable the vendor chunking). Is that error in production mode in Firefox? In development, you must be using Chrome for workers. You might try asking here if you are still running into trouble.

pengxiaotian · 2021-08-09T06:40:21Z

Is there still a working workaround for this? I added the rollup options, and I added ?worker&inline to my import. Yet I get an error regarding unexpected usage with SyntaxError: import declarations may only appear at top level of a module, on just the dev server.

Here are my deps
"dependencies": {
    "monaco-editor": "^0.26.1",
    "vue": "^3.0.5"
  },
  "devDependencies": {
    "@types/node": "^16.4.10",
    "@vitejs/plugin-vue": "^1.3.0",
    "@vue/compiler-sfc": "^3.0.5",
    "typescript": "^4.3.2",
    "vite": "^2.4.4",
    "vue-tsc": "^0.2.2"
  }

I have the same problem：

Upgrade to：

yarn add vite@^2.4.4 @vitejs/plugin-vue@^1.4.0 -D

Error log：

vite v2.4.4 building for production...
transforming (2) node_modules/monaco-editor/esm/vs/editor/editor.worker.jsThe 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
.....
....
Use of eval is strongly discouraged, as it poses security risks and may cause issues with minification
✓ 3408 modules transformed.
transforming (3419) node_modules/monaco-editor/esm/vs/language/typescript/lib/typescriptServices.js
<--- Last few GCs --->

[58357:0x104b00000]    78868 ms: Scavenge (reduce) 2032.0 (2050.4) -> 2031.3 (2051.7) MB, 2.5 / 0.0 ms  (average mu = 0.184, current mu = 0.122) allocation failure 
[58357:0x104b00000]    80581 ms: Mark-sweep (reduce) 2032.1 (2050.7) -> 2031.5 (2052.4) MB, 1710.6 / 0.0 ms  (average mu = 0.152, current mu = 0.126) allocation failure scavenge might not succeed


<--- JS stacktrace --->

FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory
 1: 0x10130d6e5 node::Abort() (.cold.1) [/Users/pengxiaotian/.nvm/versions/node/v14.17.0/bin/node]
 2: 0x1000b1c49 node::Abort() [/Users/pengxiaotian/.nvm/versions/node/v14.17.0/bin/node]
 3: 0x1000b1daf node::OnFatalError(char const*, char const*) [/Users/pengxiaotian/.nvm/versions/node/v14.17.0/bin/node]
 4: 0x1001f60f7 v8::Utils::ReportOOMFailure(v8::internal::Isolate*, char const*, bool) [/Users/pengxiaotian/.nvm/versions/node/v14.17.0/bin/node]
 5: 0x1001f6093 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, bool) [/Users/pengxiaotian/.nvm/versions/node/v14.17.0/bin/node]
 6: 0x1003a54f5 v8::internal::Heap::FatalProcessOutOfMemory(char const*) [/Users/pengxiaotian/.nvm/versions/node/v14.17.0/bin/node]
 7: 0x1003a6fba v8::internal::Heap::RecomputeLimits(v8::internal::GarbageCollector) [/Users/pengxiaotian/.nvm/versions/node/v14.17.0/bin/node]
 8: 0x1003a2689 v8::internal::Heap::PerformGarbageCollection(v8::internal::GarbageCollector, v8::GCCallbackFlags) [/Users/pengxiaotian/.nvm/versions/node/v14.17.0/bin/node]
 9: 0x10039ff21 v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [/Users/pengxiaotian/.nvm/versions/node/v14.17.0/bin/node]
10: 0x1003ae7da v8::internal::Heap::AllocateRawWithLightRetrySlowPath(int, v8::internal::AllocationType, v8::internal::AllocationOrigin, v8::internal::AllocationAlignment) [/Users/pengxiaotian/.nvm/versions/node/v14.17.0/bin/node]
11: 0x1003ae861 v8::internal::Heap::AllocateRawWithRetryOrFailSlowPath(int, v8::internal::AllocationType, v8::internal::AllocationOrigin, v8::internal::AllocationAlignment) [/Users/pengxiaotian/.nvm/versions/node/v14.17.0/bin/node]
12: 0x10037bf12 v8::internal::Factory::NewFillerObject(int, bool, v8::internal::AllocationType, v8::internal::AllocationOrigin) [/Users/pengxiaotian/.nvm/versions/node/v14.17.0/bin/node]
13: 0x1006fc158 v8::internal::Runtime_AllocateInYoungGeneration(int, unsigned long*, v8::internal::Isolate*) [/Users/pengxiaotian/.nvm/versions/node/v14.17.0/bin/node]
14: 0x100a893d9 Builtins_CEntry_Return1_DontSaveFPRegs_ArgvOnStack_NoBuiltinExit [/Users/pengxiaotian/.nvm/versions/node/v14.17.0/bin/node]
15: 0x32eddd14b1e9 
error Command failed with signal "SIGABRT".
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Blakeinstein · 2021-08-09T06:49:33Z

I have the same problem：

Upgrade to：
yarn add vite@^2.4.4 @vitejs/plugin-vue@^1.4.0 -D

Is that error in production mode in Firefox?

I dont know really, created a new vite vue project, (around the same time as this example).
And with the exact same deps, it fixed itself? Looks like its an error in firefox (dev mode only, didnt try prod)

pengxiaotian · 2021-09-01T07:25:17Z

I have the same problem：
Upgrade to：
yarn add vite@^2.4.4 @vitejs/plugin-vue@^1.4.0 -D
Is that error in production mode in Firefox?

I dont know really, created a new vite vue project, (around the same time as this example).
And with the exact same deps, it fixed itself? Looks like its an error in firefox (dev mode only, didnt try prod)

I found a new solution：

If you use CDN, you can ignore this step：

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import jsx from '@vitejs/plugin-vue-jsx'
import copy from 'rollup-plugin-copy'

export default defineConfig({
  build: {
    rollupOptions: {
      plugins: [
        copy({
          targets: [
            {
              src: 'node_modules/monaco-editor/min/vs/**/*',
              dest: 'dist/assets/monaco-editor/vs',
            },
          ],
          hook: 'writeBundle',
        }),
      ],
    },
  },
  plugins: [vue(), jsx()],
})

Core code:

import { onMounted } from 'vue';
import loader from '@monaco-editor/loader'

loader.config({ paths: { vs: '/assets/monaco-editor/vs' } })
or
loader.config({ paths: { vs: 'https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.27.0/min/vs' } })


onMounted(async () => {
  const monaco = await loader.init()
  monaco.editor.create(dom, {})
});

poyoho · 2022-04-23T13:20:08Z

I test in [email protected], it can work now. Can I close this issues?

meowtec · 2022-04-23T13:41:03Z

@poyoho OK

meowtec added the pending triage label Feb 7, 2021

Shinigami92 added p2-edge-case Bug, but has workaround or limited in scope (priority) bug has workaround and removed pending triage labels Mar 24, 2021

milomg mentioned this issue May 17, 2021

fix: support for firefox/safari worker output (fix #2029) #2689

Closed

9 tasks

haoqunjiang added feat: web workers inconsistency Inconsistency between dev & build labels Aug 4, 2021

Shinigami92 mentioned this issue Aug 9, 2021

fix(deps): update all non-major dependencies #4545

Merged

1 task

poyoho closed this as completed Apr 23, 2022

github-actions bot locked and limited conversation to collaborators May 8, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Inline worker build without any output files or error message. #1927

Inline worker build without any output files or error message. #1927

meowtec commented Feb 7, 2021 •

edited

Loading

meowtec commented Feb 7, 2021 •

edited

Loading

kena0ki commented Mar 24, 2021

milomg commented May 18, 2021 •

edited

Loading

Blakeinstein commented Aug 2, 2021

milomg commented Aug 9, 2021

pengxiaotian commented Aug 9, 2021

Blakeinstein commented Aug 9, 2021 •

edited

Loading

pengxiaotian commented Sep 1, 2021

poyoho commented Apr 23, 2022

meowtec commented Apr 23, 2022

Inline worker build without any output files or error message. #1927

Inline worker build without any output files or error message. #1927

Comments

meowtec commented Feb 7, 2021 • edited Loading

Describe the bug

Reproduction

System Info

Logs (Optional if provided reproduction)

meowtec commented Feb 7, 2021 • edited Loading

kena0ki commented Mar 24, 2021

milomg commented May 18, 2021 • edited Loading

Blakeinstein commented Aug 2, 2021

milomg commented Aug 9, 2021

pengxiaotian commented Aug 9, 2021

Blakeinstein commented Aug 9, 2021 • edited Loading

pengxiaotian commented Sep 1, 2021

I found a new solution：

poyoho commented Apr 23, 2022

meowtec commented Apr 23, 2022

meowtec commented Feb 7, 2021 •

edited

Loading

meowtec commented Feb 7, 2021 •

edited

Loading

milomg commented May 18, 2021 •

edited

Loading

Blakeinstein commented Aug 9, 2021 •

edited

Loading