-
Notifications
You must be signed in to change notification settings - Fork 189
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[Bug]: Multiple charts are undefined #1930
Comments
I noticed after updating to svelte5 I am getting this error in wordcloud charts i had set up
Build output:
+page.svelte (sorry its long)
|
@boydkelly and @SLAN14 - can either of you create a small repro on StackBlitz or Codesandbox and share it? One of my projects is SvelteKit 2.15.1, Svelte 5.16.3 and @carbon/charts-svelte 1.22.8 and it's working without problems. This is my vite.config.ts... import { sveltekit } from '@sveltejs/kit/vite'
import { defineConfig } from 'vite'
import tailwindcss from '@tailwindcss/vite'
export default defineConfig({
build: {
sourcemap: true
},
plugins: [sveltekit(), tailwindcss()],
server: {
port: 3000,
fs: {
allow: ['..', '/api/file/']
}
}
}) This is my svelte.config.js... import adapter from '@sveltejs/adapter-node'
import { vitePreprocess } from '@sveltejs/vite-plugin-svelte'
const production = process.env.NODE_ENV === 'production'
const baseCsp = [
'self',
'https://www.gstatic.com/recaptcha/', // recaptcha
'https://accounts.google.com/gsi/', // sign-in w/google
'https://www.google.com/maps/', // google maps
'https://www.google.com/recaptcha/', // recapatcha
'https://*.braintreegateway.com/', // credit card processing
`https://*.braintree-api.com/`, // credit card processing
// Less important
'https://www.paypal.com/xoplatform/logger/api/logger', // braintree logging
]
if (!production) baseCsp.push('ws://localhost:3000')
/** @type {import('@sveltejs/kit').Config} */
const config = {
preprocess: vitePreprocess({
preserve: ['ld+json']
}),
kit: {
adapter: adapter(),
csp: {
mode: 'auto',
directives: {
'default-src': [...baseCsp],
'script-src': ['unsafe-inline', ...baseCsp],
'img-src': ['data:', 'blob:', ...baseCsp],
'style-src': ['unsafe-inline', ...baseCsp],
'object-src': ['none'],
'base-uri': ['self']
// 'require-trusted-types-for': ["'script'"] // waiting for Firefox and Safari support
}
},
files: {
serviceWorker: 'src/service-worker.ts'
}
}
}
export default config |
Here are my devDependencies... "devDependencies": {
"@carbon/charts-svelte": "^1.22.8",
"@eslint/js": "^9.17.0",
"@floating-ui/dom": "^1.6.12",
"@playwright/test": "^1.49.1",
"@sveltejs/adapter-node": "^5.2.11",
"@sveltejs/kit": "^2.15.1",
"@sveltejs/vite-plugin-svelte": "^5.0.3",
"@tailwindcss/vite": "next",
"@types/applepayjs": "^14.0.9",
"@types/bootstrap": "^5.2.10",
"@types/braintree": "^3.3.13",
"@types/braintree-web": "^3.96.16",
"@types/cookie": "^1.0.0",
"@types/google.accounts": "^0.0.15",
"@types/grecaptcha": "^3.0.9",
"@types/gtag.js": "^0.0.20",
"@types/jsonwebtoken": "^9.0.7",
"@types/pg": "^8.11.10",
"bootstrap": "~5.3.3",
"braintree-web": "3.113.0",
"date-picker-svelte": "^2.15.1",
"eslint": "^9.17.0",
"eslint-config-prettier": "^9.1.0",
"eslint-plugin-prettier": "^5.2.1",
"eslint-plugin-svelte": "^2.46.1",
"globals": "^15.14.0",
"google-auth-library": "^9.15.0",
"prettier": "^3.4.2",
"prettier-plugin-svelte": "^3.3.2",
"prettier-plugin-tailwindcss": "^0.6.9",
"sass": "^1.83.1",
"svelte": "^5.16.3",
"svelte-check": "^4.1.1",
"tailwindcss": "next",
"tslib": "^2.8.1",
"typescript": "^5.7.2",
"typescript-eslint": "^8.19.1",
"vite": "^6.0.7",
"vitest": "^2.1.8"
} |
I also have the same
I have no idea why it does not work. |
hmmm. I don't know what i have done but the problem is now gone. I did for sure an npm upgrade, but also a lot of other stuff not at all related to these docs. And at some point it decided to build without this error. I'm really sorry not be be of more help right now. If I can figure out what was causing this I'll get back. |
@boydkelly - glad everything is working for you. I have run into some bugs in Svelte 5.x here and there and upgrading always solved them because they get fixed quickly. One of the reasons I posted my devDependencies was that I wanted to see if you might have had a mismatch in versions between Svelte, SvelteKit and @sveltejs/vite-plugin-svelte. |
Hi @SLAN14 - if you upgrade all your dependencies/devDependencies, do you still see the problem? |
Hey @nstuyvesant - my codebases are at Svelte 4. So, does it mean that carbon-charts v1.22.0+ (except v1.22.0) doesn't work unless we've Svelte 5? |
HI @SLAN14 - It should not. This is why I'd like to see how you are building your Svelte project. If you can create a minimal repro, I'll be happy to take a look to see if I can help. Aside from that, svelte.config.js, vite.config.js/ts, package.json - that can also be helpful. |
Relevant package(s)
Carbon Charts Version
1.22.3
Which bundler are you using?
Vite
What happened and what did you expect to happen?
Until version 1.22.0,
npm run dev
andnpm run build
worked fine with the given configurations.But post 1.22.3 (unable to install 1.22.1 & 1.22.2 for some reason),
npm run dev
result in ReferenceError: BaseChart is not definedAnd
npm run build
results in the following outputChart data and options (automatically formatted so no need for backticks)
JavaScript console or build output (if relevant)
StackBlitz repro
No response
IBM Application/Team (if relevant)
No response
What priority level would this be in your opinion?
P2 (Medium)
The text was updated successfully, but these errors were encountered: