webpack 如何在从服务器运行时忽略“仅服务器”

a6b3iqyw  于 2024-01-08  发布在  Webpack
关注(0)|答案(1)|浏览(278)

我有一个NextJS应用程序,其中包含一个库,我想确保没有在客户端导入。我用import 'server-only'这样做,但我也想将此文件用于本地脚本。然而,当我运行tsx scripts/test.ts时,我得到服务器组件错误。
如何确保库未导入到客户端上?
我的文件夹结构是:

  1. - app
  2. - ...
  3. - lib
  4. - server-only-library.ts
  5. - scripts
  6. - local-script.ts

字符串
档案:

  1. # server-only-library.ts
  2. import 'server-only'
  3. ...
  1. # local-script.ts
  2. import Library from 'lib/server-only-library'
  3. ...

的数据
试验项目:

  1. $ tsx scripts/local-script.ts
  2. /Users/michael/my-app/node_modules/server-only/index.js:1
  3. throw new Error(
  4. ^
  5. Error: This module cannot be imported from a Client Component module. It should only be used from a Server Component.


我尝试使用webpackMap它,但错误只会在运行时出现在客户端,而不会在构建时出现。

  1. # next.config.js
  2. const nextConfig = {
  3. // doesn't work :( the import is mapped, but only throws in runtime
  4. webpack: (config, { isServer, webpack }) => {
  5. if (!isServer) {
  6. config.resolve.alias = {
  7. ...config.resolve.alias,
  8. '@secret/library': 'next/../server-only',
  9. }
  10. }
  11. return config
  12. },
  13. }

lokaqttq

lokaqttq1#

最近我在Next.js项目中遇到了类似的挑战,需要将某些导入限制为服务器组件和CLI脚本。为了解决这个问题,我开发了一个名为server-cli-only的NPM包。与server-only不同,允许在Next.js服务器组件和CLI环境中导入。此解决方案应允许您在服务器组件中使用server-only-library.ts,在CLI中使用scripts/local-script.ts,而无需导入错误.
安装程序
首先,通过npm安装软件包:

  1. npm i server-cli-only

字符串

用法

在Next.js服务器组件中,将此导入放在仅服务器库的顶部。ts:

  1. import "server-cli-only";
  2. // Your server-side code follows...


对于像scripts/local-script.ts这样的本地脚本,请将RUNNING_IN_CLI环境变量设置为true。这会向server-cli-only发出信号,以允许导入,而不引发错误:

  1. RUNNING_IN_CLI=true tsx scripts/local-script.ts

更多信息

**编辑:**内部工作(可选)

server-cli-only软件包专为React Server组件和CLI环境量身定制,可防止将其包含在客户端组件中。

***React服务器环境:**在"react-server"环境指定的环境中使用空模块(./empty.js)。有关详细信息,请参阅RFC #227
***CLI环境:**在Node.js上下文中("default"导出环境中的"node"),它会检查RUNNING_IN_CLI是否设置为"true"。如果没有,它会引发错误,指导正确的CLI用法。
***客户端元件环境:**在浏览器环境中("default"汇出环境中的"browser"),./index.js会掷回错误,以永远防止在客户端转译中使用。

此配置尝试与RFC #227的React Server Module Conventions中的指导方针保持一致,但略微扩展了这些指导方针,以便在CLI上启用脚本使用。

展开查看全部

相关问题