vite does not seem to support es module that depends on nodejs builtins

Created on 20 Aug 2020  路  15Comments  路  Source: vitejs/vite

Describe the bug

By default vite does not include any support for es module that import nodejs builtins module (like crypto, etc...)

I tried to add the rollup-plugin-node-builtins plugin with option {crypto: true}

but I had to set a name to it as the following

import builtins from 'rollup-plugin-node-builtins';

const builtinsPlugin = builtins({crypto: true});
builtinsPlugin.name = 'builtins';

module.exports = {
    rollupInputOptions: {
        plugins: [
            builtinsPlugin
        ]
    }
  }

because otherwise I get the following error :

TypeError: Cannot read property 'includes' of undefined
    at C:\dev\projects\wighawag\svite-test\svite-typescript-minimal\node_modules\vite\dist\node\build\index.js:202:60
    at Array.findIndex (<anonymous>)
    at Object.build (C:\dev\projects\wighawag\svite-test\svite-typescript-minimal\node_modules\vite\dist\node\build\index.js:202:36)
    at async runBuild (C:\dev\projects\wighawag\svite-test\svite-typescript-minimal\node_modules\svite\bin\svite.js:176:7)
    at async Command.<anonymous> (C:\dev\projects\wighawag\svite-test\svite-typescript-minimal\node_modules\svite\bin\svite.js:401:7)
    at async Promise.all (index 0)
    at async main (C:\dev\projects\wighawag\svite-test\svite-typescript-minimal\node_modules\svite\bin\svite.js:441:3)

Also when running npm run dev it fails with various error indicating the builtins are not properly injected

Reproduction

Here is repo that uses svite (https://github.com/dominikg/svite/) where you can reproduce the issue in the branch rollup-plugin-node-builtins : https://github.com/wighawag/svite-typescript-minimal/tree/rollup-plugin-node-builtins

npm i
npm run build

to test runtime error :

npm run dev

System Info

  • required vite version: 1.0.0-rc.4
  • required Operating System: Windows 10 (64bit)
  • required Node version: 12.18.3

    • npm/yarn version : npm 6.14.6

upstream

All 15 comments

I created a vite only repo with both rollup-plugin-node-builtins and rollup-plugin-node-globals plugins setup
the fix for plugin name is included but got runtime error : https://github.com/wighawag/vite-test
see : https://github.com/wighawag/vite-test/blob/99603efde5819f4f67f04a00037d2f0ecb2dc41a/vite.config.js#L5

Node builtins doesn't work in browser and Vite doesn't provide any shimming/polyfills for it.

Rollup plugins are only run during builds, you need to provide a middleware to the dev server

edit: i might check what's up with the build failing

Ok, thanks for the info.

The build is failing because the code expect plugin to have a name field.
and rollup-plugin-node-builtins does not have it

@wighawag. The name with plugin is necessary, you can ask the maintainer of rollup-plugin-node-builtins add this or add name with yourself. For build error, I pushed the pr to fix it and please wait https://github.com/rollup/plugins/issues/554#issuecomment-680423764 be resolved.

{ ...builtins({ crypto: true }), name: 'rollup-plugin-node-builtins' } should do as a workaround

@wighawag. This is can be closed. You can track here https://github.com/rollup/rollup/issues/3765 for object prototype is lost .

@underfin I did this in vite.config.js but still getting error require is not a function

import builtins from 'rollup-plugin-node-builtins';
import globals from 'rollup-plugin-node-globals';

const builtinsPlugin = builtins({crypto: true});
builtinsPlugin.name = 'builtins'; // required, see https://github.com/vitejs/vite/issues/728

const globalsPlugin = globals();
globalsPlugin.name = 'globals'; // required, see https://github.com/vitejs/vite/issues/728

module.exports = {
    assetsDir: "assets",
    outDir: "static",
    rollupInputOptions: {
        plugins: [
            globalsPlugin,
            builtinsPlugin,
        ]
    }
}

This error is already fixed, please wait new version publish.

@underfin is this published? Can we try in the meantime somehow?

@frederikhors You can have a try with link local vite.

@underfin How we link local vite?

@underfin I'm getting this error:

image

Please see entirely this issue.

@underfin I fixed the above issue with following:

import builtins from 'rollup-plugin-node-builtins';

const builtinsPlugin = { ...builtins({ crypto: true }), name: 'rollup-plugin-node-builtins' };

module.exports = {
    assetsDir: "assets",
    outDir: "static",
    rollupInputOptions: {
        preserveEntrySignatures: 'strict',
        plugins: [
            builtinsPlugin,
        ]
    }
}

But when trying to link I'm getting following error now

image

Was this page helpful?
0 / 5 - 0 ratings

Related issues

stefnotch picture stefnotch  路  3Comments

ciaoben picture ciaoben  路  4Comments

ashubham picture ashubham  路  3Comments

maxxcs picture maxxcs  路  3Comments

TrungRueta picture TrungRueta  路  4Comments