How to use dynamic import of next js with path stored in a variable-CodePudding

I am using dynamic import in next js. The component is rendered when I directly use the path. But it is not rendering when I use the path from a variable.

const faq = dynamic(() => import('../faq/faq'))

This works fine. but,

const path = '../faq/faq';
const faq = dynamic(() => import(path ))

This is not working. How can I fix this?

CodePudding user response：

As Per webpack Documentation It is not possible to use a fully dynamic import statement, such as import(foo). Because foo could potentially be any path to any file in your system or project.

CodePudding user response：

You can use string concatenation while importing dependencies from variable

const path = '../faq/faq';
const faq = dynamic(() => import(`${path}` ))