You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I'm trying to build a production ESM version without devtools, and while the build is passing, I can't serialize the running store using JSON.stringify(...) because of a circular dependency.
I'm starting to think that devtools being included in the browser/ESM version is a necessity, and couldn't find the difference which would cause these issues.
I'm doing one config change to disable the devtools env.ts
exportconstUSE_DEVTOOLS=false
I tried various other variants ('__DEV__': 'false') but these also didn't help at all, and I think this is the minimal build still showing the erorr.
When doing
JSON.stringify(useMainStore())
I get this error:
vue.esm-browser.prod.js:5 TypeError: Converting circular structure to JSON
--> starting at object with constructor 'Object'
| property '_context' -> object with constructor 'Object'
--- property 'app' closes the circle
at JSON.stringify (<anonymous>)
Here's the rollup config I'm using for the build
import { resolve, dirname } from 'node:path';
import { fileURLToPath } from 'node:url';
import ts from 'rollup-plugin-typescript2';
import replace from '@rollup/plugin-replace';
import nodeResolve from '@rollup/plugin-node-resolve';
import commonjs from '@rollup/plugin-commonjs';
// Terser plugin added by us, to produce a minified source with no comments
import terser from '@rollup/plugin-terser';
const __filename = fileURLToPath(import.meta.url);
const __dirname = dirname(__filename);
// Define the package details for the build
const pkg = {
name: 'pinia',
version: '2.1.7',
};
// Browser configuration for ESM build
export default {
input: 'src/index.ts',
output: {
file: 'dist/pinia.esm-browser.js',
format: 'es',
sourcemap: false,
banner: `/*!*${pkg.name} v${pkg.version}* (c) 2023 Eduardo San Martin Morote* @license MIT*/`,
globals: {
'vue-demi': 'VueDemi',
vue: 'Vue',
'@vue/composition-api': 'vueCompositionApi',
},
},
external: ['vue-demi', 'vue', '@vue/composition-api'],
plugins: [
ts({
tsconfig: resolve(__dirname, './tsconfig.json'),
cacheRoot: resolve(__dirname, './node_modules/.rts2_cache'),
tsconfigOverride: {
compilerOptions: {
sourceMap: false,
declaration: false,
declarationMap: false,
},
exclude: ['*.spec.ts', 'packages/*/test-dts', 'packages/*/testing'],
},
}),
replace({
preventAssignment: true,
values: {
__VERSION__: `"${pkg.version}"`,
__USE_DEVTOOLS__: 'false',
__DEV__: 'true',
__TEST__: 'false',
__FEATURE_PROD_DEVTOOLS__: `false`,
__BROWSER__: 'true',
__GLOBAL__: 'false',
__NODE_JS__: 'false',
},
}),
nodeResolve(),
commonjs(),
// terser(),
],
};
reacted with thumbs up emoji reacted with thumbs down emoji reacted with laugh emoji reacted with hooray emoji reacted with confused emoji reacted with heart emoji reacted with rocket emoji reacted with eyes emoji
-
I'm trying to build a production ESM version without devtools, and while the build is passing, I can't serialize the running store using
JSON.stringify(...)
because of a circular dependency.I'm starting to think that devtools being included in the browser/ESM version is a necessity, and couldn't find the difference which would cause these issues.
I'm doing one config change to disable the devtools
env.ts
I tried various other variants (
'__DEV__': 'false'
) but these also didn't help at all, and I think this is the minimal build still showing the erorr.When doing
I get this error:
Here's the rollup config I'm using for the build
And here's the built esm package: https://pastebin.com/2NLLg0tp (couldn't paste it here).
Any tips on how to overcome this appreciated! Happy to contribute the prod esm build as a PR when working.
Beta Was this translation helpful? Give feedback.
All reactions