Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Feature Request] Import map support #71

Open
HexaField opened this issue Feb 20, 2024 · 5 comments
Open

[Feature Request] Import map support #71

HexaField opened this issue Feb 20, 2024 · 5 comments

Comments

@HexaField
Copy link

Hey there, I am curious to know if it is possible to add import map support.

Thanks.

@yejimeiming
Copy link
Member

Hey! Can you elaborate on you ideas? 🤔

@HexaField
Copy link
Author

Hey! Can you elaborate on you ideas? 🤔

I would like to dynamically import specific chunks via import maps

The code would look like

export function importCustomModule(moduleName: string) {
    return import(moduleName)
}

Which avoids the drawback of dynamic imports not having deep variable imports or having to specify the extension

@yejimeiming
Copy link
Member

yejimeiming commented Mar 11, 2024

The import(moduleName) doesn't seem to have any path context, which actually goes against the concept of Rollup parsing modules.
The module id must be starts wiht ./ or ../ 👉 Rollup imports limitation


If you want to import modules as you please, there is a way to do it.

export function importCustomModule(moduleName: string) {
-   return import(moduleName)
+   return import(`@/${moduleName}`)
}

Configuration the alias option.

// vite.config.ts

export {
  resolve: {
    // The vite-plugin-dinamic-import will automatically calculate the relative path.
    alias: { '@': __dirname },
  },
}

I'm not sure if this will make you feel embarrassed, if that's the case.
You can also dynamically specify the context path of import(moduleName).

// vite.config.ts

export defalut {
  plugins: [
    dynamicImport({
      onResolve(rawImportee) {
        return contextPath + rawImportee;
      },
    }),
  ],
}

@HexaField
Copy link
Author

HexaField commented Mar 11, 2024

https://github.com/WICG/import-maps

The moduleName string would be an import map identifier. Vite supports import maps.

@yejimeiming
Copy link
Member

Perhaps, we need an new plugin for import map. vite-plugin-dynamic-import
The purpose of design vite-plugin-dynamic-import is just for fix some edgge cases when use the import() syntax is used in Vite.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants