Question

要处理SSR，而不是

import EditorJS from '@editorjs'

我在做

const EditorJS = dynamic(
  () => import('react-editor-js'),
  { ssr: false }
)

我必须为此做

import Header from '@editorjs/header';
import Embed from '@editorjs/embed'
import Table from '@editorjs/table'
import Paragraph from '@editorjs/paragraph'

总有没有将所有导入合并到一个动态导入中，而不是对每个导入都进行更多操作？

const Header = dynamic(
  () => import('@editorjs/header'),
  { ssr: false }
)

Answer 1

使用所有库的名称创建一个数组，并使用动态const名称导入它们：

imports = ['@editorjs/header', '@editorjs/embed', '@editorjs/table', '@editorjs/paragraph']; 

imports.forEach((value)=>{
    let name = value.slice(value.indexOf('/')+1);
    
    eval('const '+ name.charAt(0).toUpperCase() + name.slice(1) + ' = ' + "dynamic(() => import('" + value+ "'),{ ssr: false })" + ';');
})

如何在React / Nextjs应用程序中将多个导入语句组合成一个？

1 个答案: