нельзя использовать оператор импорта вне модуля с помощью Next. js

Question

Мне нужно импортировать пакет npm, но это не удалось, когда я использую такой оператор «import»

import { cuteLuna } from 'lunacomponent';

, и я получил сообщение об ошибке: невозможно использовать оператор импорта вне модуля

после того, как я изменил его на динамический c импорт, он работает.

const cuteLuna = dynamic(() => import('lunacomponent').then((a) => a.cuteLuna), {ssr: false});

Мой вопрос: почему я должен использовать динамический c импорт вместо обычного импорта?

спасибо !!

Answer 1

Поскольку Next. js - это фреймворк, который работает на стороне сервера и клиента , он должен использовать правильные стили модулей для каждого.

На стороне сервера работает на Node, поэтому ваша библиотека должна предоставлять common js.

Из вашей ошибки я могу предположить, что ваша lunacomponent lib не экспортирует файлы cjs, поэтому он не работает на сервере , когда вы используете dynamic с ssr:false, вы указываете Next. js пропускать запуск на стороне сервера, поэтому у вас нет такой же ошибки.

Мне не удалось найти эту lunacomponent lib в реестре publi c npm, поэтому я не могу проверить свое предположение.