"process is not defined" errors

[KieranP]

Describe the bug

I have switched from Snowpack to Vite. After doing so, "vite build" works fine, but when I load the app in the browser, I see "process is not defined" errors.

These seem to be caused by calls to "process.platform" and "process.version" being made in some node_modules. Specifically, in the fs.realpath and glob packages used by graphql-ruby-client frontend JS lib.

I'm not sure if I'm doing something wrong, or Vite is missing something, or if graphql-ruby-client is at fault.

Reproduction

• Clone https://github.com/KieranP/rails-graphql-svelte
• Checkout "vite" branch
• Bundle rubygems: bundle install
• Bundle yarn: yarn install
• Build app: yarn vite build -m development
• Run rails: bin/rails s
• Load: http://localhost:3000/posts

System Info

npx: installed 1 in 1.179s

  System:
    OS: macOS 11.2.3
    CPU: (12) x64 Intel(R) Core(TM) i7-8850H CPU @ 2.60GHz
    Memory: 2.20 GB / 32.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 12.14.0 - ~/.nvm/versions/node/v12.14.0/bin/node
    Yarn: 1.22.4 - ~/.nvm/versions/node/v12.14.0/bin/yarn
    npm: 6.13.4 - ~/.nvm/versions/node/v12.14.0/bin/npm
  Browsers:
    Brave Browser: 89.1.22.70
    Chrome: 87.0.4280.88
    Edge: 89.0.774.63
    Firefox: 86.0.1
    Safari: 14.0.3
  npmPackages:
    vite: ^2.1.3 => 2.1.3

Used package manager: yarn

[KieranP]

I can get around the issue by putting the following in vite.config.js, but this seems like a hack around, rather than a fix:

define: {
   'process.platform': null,
   'process.version': null,
},

[wheatjs]

I believe this is a problem caused by graphql-ruby-client using node built-ins. This is something that is not supported by Vite and will have to be fixed by the library maintainers.

[patak-dev]

Closing this now as Vite will not shim node built-ins, in the same way as Webpack 5 has stopped this practice also. The ecosystem will promptly be patched to avoid usage of node builtins.
In the meantime, you can add your own shims for node built-ins. define is one way to work around this. For reference, the snowpack team is working on a rollup plugin that may be a good solution in the future for these cases
https://github.com/snowpackjs/rollup-plugin-polyfill-node

At some point, that project may be adopted by the rollup org.
Note: I had issues running it at this point, I think because of config problems.