next.js - Next.js - 在文件中导入服务器端包同时包含服务器端和客户端功能？

Question

假设我有一个名为 utils.js 的文件，其中包含两个函数 s 和 c。s 是一个服务器端函数（在 /api 端点处理程序上调用），并使用 mongodb 包。c 是一个客户端函数（将被捆绑并发送到浏览器）。

使用 next build 编译应用程序时，会导致任何问题吗？webpack 是否知道仅捆绑文件/模块的一部分？（将服务器端函数和导入视为“死代码”，因为它们仅从服务器端代码调用）

谢谢

标签： next.js

Answer 1

如果您需要知道哪些功能绑定到客户端以及哪些功能绑定到服务器，有一种简单的方法可以了解这一点 → https://next-code-elimination.now.sh/

只需将文件的内容复制并粘贴到其中，您就会看到哪些代码被捆绑到客户端以及哪些代码被捆绑到服务器。如果您有导入，请确保将所有导入放在一个文件中，以便您了解它是如何工作的。

拇指规则是：

任何类似getServerSideProps, getStaticProps&的东西getStaticPaths 都将从捆绑的代码中删除。如果您从使用服务器端代码的文件中导入任何内容，fs但未在上述 3 个函数中的任何一个中使用它，那么它将不会被删除（检查 Next Code Elimination Tool）并且会给您一个错误。

工具就是答案。我将我的文件复制粘贴到其中并立即找到答案。