feat: silence "use client" warning (#78)

Author: ArnaudBarre

CHANGELOG.md

@@ -3,6 +3,7 @@
 ## Unreleased
 
 - Support TS/JSX in node_modules to help the community experiment with it. Note that for now this not supported by TS and errors from these files cannot be silenced if the user is using a stricter configuration than the library author: https://github.com/microsoft/TypeScript/issues/30511. I advise to use it only for internal libraries for now (fixes #53)
+- Silence `"use client"` warning when building library like `@tanstack/react-query`
 - Fix fast refresh issue when exporting a component with a name that shadow another local component
 
 ## 3.2.0

src/index.ts

@@ -9,7 +9,7 @@ import {
   JscTarget,
   transform,
 } from "@swc/core";
-import { PluginOption } from "vite";
+import { PluginOption, UserConfig, BuildOptions } from "vite";
 import { createRequire } from "module";
 
 const runtimePublicPath = "/@react-refresh";
@@ -132,6 +132,9 @@ RefreshRuntime.__hmr_import(import.meta.url).then((currentExports) => {
           name: "vite:react-swc",
           apply: "build",
           enforce: "pre", // Run before esbuild
+          config: (userConfig) => ({
+            build: silenceUseClientWarning(userConfig),
+          }),
           transform: (code, _id) =>
             transformWithOptions(_id.split("?")[0], code, "esnext", options, {
               runtime: "automatic",
@@ -141,7 +144,8 @@ RefreshRuntime.__hmr_import(import.meta.url).then((currentExports) => {
       : {
           name: "vite:react-swc",
           apply: "build",
-          config: () => ({
+          config: (userConfig) => ({
+            build: silenceUseClientWarning(userConfig),
             esbuild: {
               jsx: "automatic",
               jsxImportSource: options.jsxImportSource,
@@ -207,4 +211,22 @@ const transformWithOptions = async (
   return result;
 };
 
+const silenceUseClientWarning = (userConfig: UserConfig): BuildOptions => ({
+  rollupOptions: {
+    onwarn(warning, defaultHandler) {
+      if (
+        warning.code === "MODULE_LEVEL_DIRECTIVE" &&
+        warning.message.includes("use client")
+      ) {
+        return;
+      }
+      if (userConfig.build?.rollupOptions?.onwarn) {
+        userConfig.build.rollupOptions.onwarn(warning, defaultHandler);
+      } else {
+        defaultHandler(warning);
+      }
+    },
+  },
+});
+
 export default react;