Inline worker build without any output files or error message.

[meowtec]

⚠️ 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

[meowtec]

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]

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]

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]

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]

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]

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.