Stream: ComponentizeJS

Topic: How to import addtional js modules

Richard Backhouse (Aug 23 2023 at 10:41):

If your top level js code requires additional modules that are not part of the wit how can they be imported? Currently 'componetize' will fail with

Import 'util' in source.js is not defined as a world import. Only component-defined imports can be used.

I was able to get this to work by modifying 'componentize.js' to add an additional option that adds a set of imports to the importWrappers array but I'm not sure this is the best approach to supporting this.

const httputil = await readFile('httputil.js', 'utf8');
const util = await readFile('util.js', 'utf8');
const uuid = await readFile('uuid.js', 'utf8');
const jsSource = await readFile('testjs.js', 'utf8');

const importWrappers = [
    [
        "util", util
    ],
    [
        "httputil", httputil
    ],
    [
        "uuid", uuid
    ]
];
const { component } = await componentize(jsSource, {
    witPath: resolve('./wit/'),
    enableStdout: false,
    debug: false,
    additionalImportWrappers: importWrappers,
});

Guy Bedford (Aug 23 2023 at 17:24):

@Richard Backhouse good question, we could effectively perform a bundling step with a JS bundler before running componentize, where the externals of the bundling would be the WIT imports.

One problem with this approach is if you make a typo or use the wrong import, it might be surprising why it attempts to find it in node_modules instead. But I think overall that would be the best approach here. I've posted an issue in https://github.com/bytecodealliance/componentize-js/issues/46 to track this.

Last updated: Oct 23 2024 at 20:03 UTC