What happens?
When valtio: {} is enabled in a Max project, importing Valtio APIs from @umijs/max does not work at browser runtime.
import { proxy } from '@umijs/max';
const state = proxy({ ok: true });
Runtime error observed locally:
TypeError: (0 , __TURBOPACK__imported__module__...src/.umi/exports.ts...proxy) is not a function
The same issue was originally noticed from ant-design-pro issue ant-design/ant-design-pro#11772. I did not rely on that report as the conclusion; I reproduced and narrowed it locally.
Reproduction environment
Project: ant-design/ant-design-pro
Node: v22.22.0
npm: 10.9.4
@umijs/max: 4.6.64
umi: 4.6.64
@umijs/plugins: 4.6.64
@umijs/valtio: 1.0.4
valtio: 1.11.2
bundler: utoopack 1.4.13
Config change:
export default defineConfig({
// ...
valtio: {},
});
Temporary startup probe in src/app.tsx:
import { proxy } from '@umijs/max';
const valtioProbe = proxy({ ok: true });
Then run:
npm exec max setup
npm run dev
Open http://localhost:8000 and the app fails before rendering because proxy from @umijs/max is not callable.
Expected behavior
@umijs/max should re-export the Valtio APIs generated by the valtio plugin, so this should work:
import { proxy, useSnapshot } from '@umijs/max';
Investigation notes
@umijs/valtio itself is not the problem.
Both Node ESM and CommonJS probes expose a valid proxy function:
node --input-type=module -e "import * as v from '@umijs/valtio'; console.log(typeof v.proxy, v.proxy({ ok: true }).ok)"
# function true
node -e "const v = require('@umijs/valtio'); console.log(typeof v.proxy, v.proxy({ ok: true }).ok)"
# function true
Direct browser import also works in the same project and bundler setup:
import { proxy } from '@umijs/valtio';
const valtioProbe = proxy({ ok: true });
With that direct import, the dev page renders normally.
The generated temp files also look correct after enabling valtio: {}:
// src/.umi/exports.ts
export { proxy, useSnapshot, snapshot, subscribe, subscribeKey, proxyWithComputed, proxyWithHistory, proxyWithDevtools, proxyMap, proxySet, derive, underive, useProxy, ref, watch } from '/path/to/project/src/.umi/plugin-valtio';
// src/.umi/plugin-valtio/index.ts
export {
proxy,
useSnapshot,
snapshot,
subscribe,
subscribeKey,
proxyWithComputed,
proxyWithHistory,
proxyWithDevtools,
proxyMap,
proxySet,
derive,
underive,
useProxy,
ref,
watch,
} from '/path/to/project/node_modules/@umijs/valtio';
So the failing boundary appears to be the generated @umijs/max/@@/exports barrel path at runtime, not the Valtio package or the user's app code.
I also compared @umijs/plugins@4.6.51 and @umijs/plugins@4.6.64; dist/valtio.js is byte-identical between the two versions, so this does not look like a recent change in the Valtio plugin implementation.
Workaround
Use the plugin package directly:
import { proxy } from '@umijs/valtio';
or import from Valtio directly:
import { proxy } from 'valtio';
What happens?
When
valtio: {}is enabled in a Max project, importing Valtio APIs from@umijs/maxdoes not work at browser runtime.Runtime error observed locally:
The same issue was originally noticed from ant-design-pro issue ant-design/ant-design-pro#11772. I did not rely on that report as the conclusion; I reproduced and narrowed it locally.
Reproduction environment
Project: ant-design/ant-design-pro
Config change:
Temporary startup probe in
src/app.tsx:Then run:
npm exec max setup npm run devOpen
http://localhost:8000and the app fails before rendering becauseproxyfrom@umijs/maxis not callable.Expected behavior
@umijs/maxshould re-export the Valtio APIs generated by thevaltioplugin, so this should work:Investigation notes
@umijs/valtioitself is not the problem.Both Node ESM and CommonJS probes expose a valid
proxyfunction:Direct browser import also works in the same project and bundler setup:
With that direct import, the dev page renders normally.
The generated temp files also look correct after enabling
valtio: {}:So the failing boundary appears to be the generated
@umijs/max/@@/exportsbarrel path at runtime, not the Valtio package or the user's app code.I also compared
@umijs/plugins@4.6.51and@umijs/plugins@4.6.64;dist/valtio.jsis byte-identical between the two versions, so this does not look like a recent change in the Valtio plugin implementation.Workaround
Use the plugin package directly:
or import from Valtio directly: