-
Notifications
You must be signed in to change notification settings - Fork 140
Description
I have published my library to the JSR registry instead of NPM, but I am having a weird warning when using it on a Vite bundled project:
[plugin vite:resolve] Module "node:fs" has been externalized for browser compatibility, imported by "C:/Users/Hydro/Repository Groups/Linux Metro/linuxmetro/desktop/node_modules/@hydroper/fluent/src/fsloader.nodejs.js". See https://vite.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
[plugin vite:resolve] Module "node:path" has been externalized for browser compatibility, imported by "C:/Users/Hydro/Repository Groups/Linux Metro/linuxmetro/desktop/node_modules/@hydroper/fluent/src/fsloader.nodejs.js". See https://vite.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
node_modules/@hydroper/fluent/src/fsloader.nodejs.js (12:22): "readFileSync" is not exported by "__vite-browser-external", imported by "node_modules/@hydroper/fluent/src/fsloader.nodejs.js".
node_modules/@hydroper/fluent/src/fsloader.nodejs.js (12:40): "resolve" is not exported by "__vite-browser-external", imported by "node_modules/@hydroper/fluent/src/fsloader.nodejs.js".
I am guessing that JSR is pre-bundling my @hydroper/fluent
library and not looking into the browser
field in package.json
:
{
"name": "@hydroper/fluent",
"version": "1.1.0",
"description": "Work with Fluent Project translation lists.",
"main": "src/index.ts",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"browser": {
"src/fsloader.nodejs.ts": "src/fsloader.browser.ts"
},
"keywords": ["fluent", "fluent-project", "ftl"],
"author": "hydroper",
"license": "Apache-2.0",
"dependencies": {
"@fluent/bundle": "^0.18.0",
"axios": "^1.3.6"
},
"devDependencies": {
"@types/node": "^22.13.0"
},
"repository": "https://github.com/hydroperfox/fluent"
}
Notice the "browser" field. I'm thinking Vite and JSR aren't doing anything with it.
Here is the library's jsr.json
:
{
"name": "@hydroper/fluent",
"version": "1.1.0",
"exports": "./src/index.ts",
"license": "Apache-2.0"
}
Here's my consumer project's vite.config.ts
:
import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
// https://vite.dev/config/
export default defineConfig({
plugins: [react()],
define: {
"process.platform": JSON.stringify(process.platform),
"process.env.IS_PREACT": JSON.stringify("true"),
},
build: {
outDir: "../dist/desktop",
},
});
To confirm, JSR removes the browser
field from package.json
when looking into node_modules
:
{
"name": "@jsr/hydroper__fluent",
"version": "1.1.0",
"homepage": "https://jsr.io/@hydroper/fluent",
"type": "module",
"dependencies": {
"@fluent/bundle": "^0.18.0",
"axios": "^1.3.6"
},
"exports": {
".": {
"types": "./_dist/src/index.d.ts",
"default": "./src/index.js"
}
},
"_jsr_revision": 11
}