インターラプト開発者ブログ

インターラプトのプロダクト・サービスに関する開発ブログ

Nextjsでデータベースに接続する時に「Critical dependency: the request of a dependency is an expression」が出る

NextJsではWebpackを使用しているため、モジュールがWebpackに対応していないとCritical dependency: the request of a dependency is an expression というエラーが発生します。

NextJsでは、Sequelize や knex などでエラーが発生します。

これを回避するには、ウェブから読み込まれる部分とそうでない部分で明確にimportを分けると良いです。

importしたモジュールがWebpackに対応していない場合にそのページをWebから読み込んでしまうとエラーが発生するため、必ずWebpackがコンパイルせずにサーバサイドのみで実行するファイルで読み込みます。

DIを使っている場合は、明確にWebpack部分とバックエンド部分でDIコンテナを分けると良さそうです。