The import type { MetaFunction } and import { type MetaFunction } have different behaviors when build

[hungtcs]

Reproduction

Open the link https://stackblitz.com/edit/remix-run-remix-fu8vue?file=tsconfig.json and run npm run build in terminal, the build outputs a lot of warnings.

[plugin:vite:resolve] [plugin vite:resolve] Module "node:crypto" has been externalized for browser compatibility, imported by "/home/projects/remix-run-remix-fu8vue/node_modules/@remix-run/node/dist/sessions/fileStorage.js". See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin:vite:resolve] [plugin vite:resolve] Module "node:fs" has been externalized for browser compatibility, imported by "/home/projects/remix-run-remix-fu8vue/node_modules/@remix-run/node/dist/sessions/fileStorage.js". See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin:vite:resolve] [plugin vite:resolve] Module "node:path" has been externalized for browser compatibility, imported by "/home/projects/remix-run-remix-fu8vue/node_modules/@remix-run/node/dist/sessions/fileStorage.js". See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin:vite:resolve] [plugin vite:resolve] Module "node:crypto" has been externalized for browser compatibility, imported by "/home/projects/remix-run-remix-fu8vue/node_modules/@remix-run/node/dist/upload/fileUploadHandler.js". See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin:vite:resolve] [plugin vite:resolve] Module "node:fs" has been externalized for browser compatibility, imported by "/home/projects/remix-run-remix-fu8vue/node_modules/@remix-run/node/dist/upload/fileUploadHandler.js". See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin:vite:resolve] [plugin vite:resolve] Module "node:fs/promises" has been externalized for browser compatibility, imported by "/home/projects/remix-run-remix-fu8vue/node_modules/@remix-run/node/dist/upload/fileUploadHandler.js". See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin:vite:resolve] [plugin vite:resolve] Module "node:os" has been externalized for browser compatibility, imported by "/home/projects/remix-run-remix-fu8vue/node_modules/@remix-run/node/dist/upload/fileUploadHandler.js". See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin:vite:resolve] [plugin vite:resolve] Module "node:path" has been externalized for browser compatibility, imported by "/home/projects/remix-run-remix-fu8vue/node_modules/@remix-run/node/dist/upload/fileUploadHandler.js". See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin:vite:resolve] [plugin vite:resolve] Module "node:stream" has been externalized for browser compatibility, imported by "/home/projects/remix-run-remix-fu8vue/node_modules/@remix-run/node/dist/upload/fileUploadHandler.js". See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin:vite:resolve] [plugin vite:resolve] Module "node:util" has been externalized for browser compatibility, imported by "/home/projects/remix-run-remix-fu8vue/node_modules/@remix-run/node/dist/upload/fileUploadHandler.js". See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin:vite:resolve] [plugin vite:resolve] Module "node:stream" has been externalized for browser compatibility, imported by "/home/projects/remix-run-remix-fu8vue/node_modules/@remix-run/node/dist/stream.js". See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin:vite:resolve] [plugin vite:resolve] Module "node:crypto" has been externalized for browser compatibility, imported by "/home/projects/remix-run-remix-fu8vue/node_modules/@remix-run/node/dist/sessions/fileStorage.js". See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin:vite:resolve] [plugin vite:resolve] Module "node:fs" has been externalized for browser compatibility, imported by "/home/projects/remix-run-remix-fu8vue/node_modules/@remix-run/node/dist/sessions/fileStorage.js". See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin:vite:resolve] [plugin vite:resolve] Module "node:path" has been externalized for browser compatibility, imported by "/home/projects/remix-run-remix-fu8vue/node_modules/@remix-run/node/dist/sessions/fileStorage.js". See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin:vite:resolve] [plugin vite:resolve] Module "node:crypto" has been externalized for browser compatibility, imported by "/home/projects/remix-run-remix-fu8vue/node_modules/@remix-run/node/dist/upload/fileUploadHandler.js". See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin:vite:resolve] [plugin vite:resolve] Module "node:fs" has been externalized for browser compatibility, imported by "/home/projects/remix-run-remix-fu8vue/node_modules/@remix-run/node/dist/upload/fileUploadHandler.js". See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin:vite:resolve] [plugin vite:resolve] Module "node:fs/promises" has been externalized for browser compatibility, imported by "/home/projects/remix-run-remix-fu8vue/node_modules/@remix-run/node/dist/upload/fileUploadHandler.js". See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin:vite:resolve] [plugin vite:resolve] Module "node:os" has been externalized for browser compatibility, imported by "/home/projects/remix-run-remix-fu8vue/node_modules/@remix-run/node/dist/upload/fileUploadHandler.js". See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin:vite:resolve] [plugin vite:resolve] Module "node:path" has been externalized for browser compatibility, imported by "/home/projects/remix-run-remix-fu8vue/node_modules/@remix-run/node/dist/upload/fileUploadHandler.js". See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin:vite:resolve] [plugin vite:resolve] Module "node:stream" has been externalized for browser compatibility, imported by "/home/projects/remix-run-remix-fu8vue/node_modules/@remix-run/node/dist/upload/fileUploadHandler.js". See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin:vite:resolve] [plugin vite:resolve] Module "node:util" has been externalized for browser compatibility, imported by "/home/projects/remix-run-remix-fu8vue/node_modules/@remix-run/node/dist/upload/fileUploadHandler.js". See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin:vite:resolve] [plugin vite:resolve] Module "node:stream" has been externalized for browser compatibility, imported by "/home/projects/remix-run-remix-fu8vue/node_modules/@remix-run/node/dist/stream.js". See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin:vite:resolve] [plugin vite:resolve] Module "stream" has been externalized for browser compatibility, imported by "/home/projects/remix-run-remix-fu8vue/node_modules/stream-slice/index.js". See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin:vite:resolve] [plugin vite:resolve] Module "stream" has been externalized for browser compatibility, imported by "/home/projects/remix-run-remix-fu8vue/node_modules/stream-slice/index.js". See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details. (x2)
[plugin:vite:resolve] [plugin vite:resolve] Module "crypto" has been externalized for browser compatibility, imported by "/home/projects/remix-run-remix-fu8vue/node_modules/cookie-signature/index.js". See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin:vite:resolve] [plugin vite:resolve] Module "crypto" has been externalized for browser compatibility, imported by "/home/projects/remix-run-remix-fu8vue/node_modules/cookie-signature/index.js". See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details. (x2)

I have modified the following code:

1. Open tsconfig.json add option verbatimModuleSyntax to true.
2. Open /app/routes/_index.tsx change import type { MetaFunction } from '@remix-run/node' to import { type MetaFunction } from "@remix-run/node".

System Info

System:
  OS: macOS 14.3.1
  CPU: (8) arm64 Apple M3
  Memory: 82.05 MB / 24.00 GB
  Shell: 5.9 - /bin/zsh
Binaries:
  Node: 20.11.1 - ~/Library/Caches/fnm_multishells/38268_1710402804344/bin/node
  Yarn: 1.22.22 - ~/Library/Caches/fnm_multishells/41256_1710293546121/bin/yarn
  npm: 10.2.4 - ~/Library/Caches/fnm_multishells/38268_1710402804344/bin/npm
  pnpm: 8.15.3 - ~/Library/Caches/fnm_multishells/41256_1710293546121/bin/pnpm
  bun: 1.0.29 - /opt/homebrew/bin/bun
Browsers:
  Chrome: 122.0.6261.128
  Safari: 17.3.1
npmPackages:
  @remix-run/css-bundle: ^2.8.1 => 2.8.1 
  @remix-run/dev: ^2.8.1 => 2.8.1 
  @remix-run/node: ^2.8.1 => 2.8.1 
  @remix-run/react: ^2.8.1 => 2.8.1 
  @remix-run/serve: ^2.8.1 => 2.8.1 
  vite: ^5.1.5 => 5.1.5

Used Package Manager

pnpm

Expected Behavior

There should be no difference between import { type MetaFunction } from "@remix-run/node" and import type { MetaFunction } from '@remix-run/node' at build time.

Actual Behavior

import { type MetaFunction } from "@remix-run/node" causes a build-time warning.

[hungtcs]

More info on the test: When I import json and type MetaFunction at the same time, the warning goes away

import { json, type MetaFunction } from "@remix-run/node";

The warning is only generated when one or more types are imported using the import { type XXX } syntax, and although this is equivalent to import type { XXX }, I think it's a compiler flaw.

I'm not quite sure if this is caused by the remix compiler, but I can't reproduce the problem in other vite projects.

[moltar]

Hm, I am also getting all of these warnings, and yet I am using import type { construct.

[justintoman]

Seems related to or the same thing as https://github.com/remix-run/remix/issues/8949