Skip to content

Thread-loader with non-serializable types #5723

Closed
@RobbinBaauw

Description

@RobbinBaauw

Version

4.5.0

Reproduction link

https://github.com/RobbinBaauw/vue-cli-thread-repro

Environment info

 System:
    OS: Linux 5.7 Pop!_OS 20.04 LTS
    CPU: (8) x64 Intel(R) Core(TM) i7-6700K CPU @ 4.00GHz
  Binaries:
    Node: 14.5.0 - /opt/node/bin/node
    Yarn: 1.22.4 - /opt/node/bin/yarn
    npm: 6.14.5 - /opt/node/bin/npm
  Browsers:
    Chrome: 83.0.4103.116
    Firefox: 78.0.2
  npmPackages:
    @vue/cli: ^4.5.0 => 4.5.0 
    @vue/cli-shared-utils:  4.5.0 
    @vue/cli-ui:  4.5.0 
    @vue/cli-ui-addon-webpack:  4.5.0 
    @vue/cli-ui-addon-widgets:  4.5.0 
    @vue/compiler-core:  3.0.0-rc.4 
    @vue/compiler-dom:  3.0.0-rc.4 
    @vue/compiler-sfc:  3.0.0-rc.4 
    @vue/compiler-ssr:  3.0.0-rc.4 
    @vue/reactivity:  3.0.0-rc.4 
    @vue/runtime-core:  3.0.0-rc.4 
    @vue/runtime-dom:  3.0.0-rc.4 
    @vue/shared:  3.0.0-rc.4 
    typescript:  3.9.7 
    vue:  3.0.0-rc.4 (2.6.11)
    vue-cli-plugin-apollo:  0.21.3 
    vue-codemod:  0.0.4 
  npmGlobalPackages:
    @vue/cli: 4.5.0

Steps to reproduce

Note that I made 2 changes w.r.t. a generated project (RobbinBaauw/vue-cli-thread-repro@7295f13):

  1. Added invalid typescript in main.ts
  2. Added vue.config.js and changed ts-loader with an errorFormatter. Set parallel to true.

Now build. You'll get an error:

 error  in ./src/main.ts

Module build failed (from ./node_modules/thread-loader/dist/cjs.js):
Thread Loader (Worker 0)
Cannot read property 'hooks' of undefined
...

If you change parallel to false, it'll give the custom typescript error. This is expected behavior.

What is expected?

Both parallel and non-parallel give this typescript custom error

What is actually happening?

If thread-loader is used (so for compiling Typescript or by using Babel), the config is passed to the threads in buffers (strings). If you use non-serializable objects in your vue.config.js (such as functions), these objects are removed when serializing to this string, and thus you get these "undefined" errors when using thread-loader (see webpack-contrib/thread-loader#89 (comment)).


I ran into this "bug" when providing a custom renderer in Vue. This repro however shows that any reference type (such as functions) doesn't work. I don't know how to solve this properly, but at least providing a clear heads up in the docs (for example on https://cli.vuejs.org/guide/webpack.html) would be nice.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions