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 currently using Apexcharts package version 3.44.0 in my application. I was using Vite version 4.5.0 and when I built the assets I was able to see the charts in production: (See image below)
After upgrading to Vite 5.3.1 when I deploy to production the charts are not compiling: (See image below)
Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
Can you provide a repro with Vite and apexcharts only? (Ideally with as less dependencies as possible). The current repro link otherwise is also a 404.
Hello @theasteve. Please provide a minimal reproduction using a GitHub repository or StackBlitz. Issues marked with needs reproduction will be closed if they have no activity within 3 days.
Describe the bug
I'm currently using Apexcharts package version 3.44.0 in my application. I was using Vite version 4.5.0 and when I built the assets I was able to see the charts in production: (See image below)
After upgrading to Vite 5.3.1 when I deploy to production the charts are not compiling: (See image below)
package.json
vite.config.mjs
Reproduction
https://github.com/smallulator/aviato
Steps to reproduce
vite build
System Info
Used Package Manager
yarn
Logs
Building with Vite ⚡️
vite v5.3.1 building for production...
transforming...
✓ 2244 modules transformed.
rendering chunks...
computing gzip size...
../../public/vite/.vite/manifest-assets.json 0.00 kB │ gzip: 0.02 kB
../../public/vite/.vite/manifest.json 1.41 kB │ gzip: 0.32 kB
../../public/vite/assets/background-faqs-Dy5S0wkD.jpg 75.88 kB
../../public/vite/assets/background-call-to-action-KI4iaGKF.jpg 166.09 kB
../../public/vite/assets/background-features-CvbJXuf4.jpg 185.11 kB
../../public/vite/assets/application-B2VGx-Vv.css 72.80 kB │ gzip: 12.70 kB
../../public/vite/assets/application-BhUE0_2c.js 0.18 kB │ gzip: 0.17 kB │ map: 1.12 kB
../../public/vite/assets/application-kpZCztV6.js 2,166.73 kB │ gzip: 468.76 kB │ map: 4,255.44 kB
✓ built in 8.13s
Build with Vite complete: /Users/stevenaguilar/aviato/public/vite
2024-06-18T18:36:05.054Z vite:config bundled config file loaded in 82.56ms
2024-06-18T18:36:05.181Z vite:config using resolved config: {
plugins: [
'vite:build-metadata',
'vite:watch-package-data',
'vite:pre-alias',
'alias',
'vite-plugin-svgr',
'vite:modulepreload-polyfill',
'vite:resolve',
'vite:html-inline-proxy',
'vite:css',
'vite:esbuild',
'vite:json',
'vite:wasm-helper',
'vite:worker',
'vite:asset',
'vite-plugin-ruby',
'vite:wasm-fallback',
'vite:define',
'vite:css-post',
'vite:build-html',
'vite:worker-import-meta-url',
'vite:asset-import-meta-url',
'vite:force-systemjs-wrap-complete',
'commonjs',
'vite:data-uri',
'vite:dynamic-import-vars',
'vite:import-glob',
'vite-plugin-ruby:assets-manifest',
'vite:build-import-analysis',
'vite:esbuild-transpile',
'vite:manifest',
'vite:reporter',
'vite:load-fallback'
],
build: {
target: [ 'es2020', 'edge88', 'firefox78', 'chrome87', 'safari14' ],
cssTarget: [ 'es2020', 'edge88', 'firefox78', 'chrome87', 'safari14' ],
outDir: '../../public/vite',
assetsDir: 'assets',
assetsInlineLimit: 4096,
cssCodeSplit: true,
sourcemap: true,
rollupOptions: { input: [Object], output: [Object] },
minify: false,
terserOptions: { compress: [Object] },
write: true,
emptyOutDir: false,
copyPublicDir: true,
manifest: true,
lib: false,
ssr: false,
ssrManifest: false,
ssrEmitAssets: false,
reportCompressedSize: true,
chunkSizeWarningLimit: 500,
watch: null,
commonjsOptions: { include: [Array], extensions: [Array] },
dynamicImportVarsOptions: { warnOnError: true, exclude: [Array] },
modulePreload: { polyfill: true },
cssMinify: false
},
mode: 'production',
resolve: {
mainFields: [ 'browser', 'module', 'jsnext:main', 'jsnext' ],
conditions: [],
extensions: [
'.mjs', '.js',
'.mts', '.ts',
'.jsx', '.tsx',
'.json'
],
dedupe: [],
preserveSymlinks: false,
alias: [ [Object], [Object], [Object], [Object] ]
},
base: '/vite/',
envDir: '/Users/stevenaguilar/aviato',
root: '/Users/stevenaguilar/aviato/app/javascript',
server: {
preTransformRequests: true,
fs: {
strict: true,
allow: [Array],
deny: [Array],
cachedChecks: undefined
},
host: 'localhost',
https: false,
port: 3036,
strictPort: true,
hmr: { clientPort: 3036 },
sourcemapIgnoreList: [Function: isInNodeModules$1],
middlewareMode: false
},
viteRuby: {
additionalEntrypoints: [ '
/{assets,fonts,icons,images}/**/*' ],/ssr/ssr.{js,ts,jsx,tsx}',assetsDir: 'assets',
autoBuild: 'false',
buildCacheDir: '/Users/stevenaguilar/aviato/tmp/cache/vite',
publicOutputDir: 'vite',
configPath: 'config/vite.json',
devServerConnectTimeout: '0.01',
publicDir: 'public',
entrypointsDir: 'entrypoints',
sourceCodeDir: 'app/javascript',
skipCompatibilityCheck: 'false',
skipProxy: 'false',
host: 'localhost',
https: false,
port: 3036,
hideBuildConsoleOutput: 'false',
viteBinPath: 'node_modules/.bin/vite',
watchAdditionalPaths: [],
base: '/vite/',
ssrBuildEnabled: 'false',
ssrEntrypoint: '
ssrOutputDir: '/Users/stevenaguilar/aviato/public/vite-ssr',
mode: 'production',
ssrBuild: false,
server: {
fs: [Object],
host: 'localhost',
https: false,
port: 3036,
strictPort: true,
hmr: [Object]
},
root: '/Users/stevenaguilar/aviato/app/javascript',
outDir: '../../public/vite',
entrypoints: [ [Array], [Array], [Array], [Array] ]
},
configFile: '/Users/stevenaguilar/aviato/vite.config.mjs',
configFileDependencies: [ '/Users/stevenaguilar/aviato/vite.config.mjs' ],
inlineConfig: {
root: undefined,
base: undefined,
mode: 'production',
configFile: undefined,
logLevel: undefined,
clearScreen: undefined,
build: {}
},
rawBase: '/vite/',
publicDir: '/Users/stevenaguilar/aviato/app/javascript/public',
cacheDir: '/Users/stevenaguilar/aviato/node_modules/.vite',
command: 'build',
ssr: {
target: 'node',
optimizeDeps: { noDiscovery: true, esbuildOptions: [Object] }
},
isWorker: false,
mainConfig: null,
bundleChain: [],
isProduction: true,
css: { lightningcss: undefined },
esbuild: { jsxDev: false },
preview: {
port: undefined,
strictPort: true,
host: 'localhost',
https: false,
open: undefined,
proxy: undefined,
cors: undefined,
headers: undefined
},
env: {
VITE_RUBY_ASSETS_DIR: 'assets',
VITE_RUBY_DEV_SERVER_CONNECT_TIMEOUT: '0.01',
VITE_RUBY_VITE_BIN_PATH: 'node_modules/.bin/vite',
VITE_RUBY_ENTRYPOINTS_DIR: 'entrypoints',
VITE_RUBY_PUBLIC_OUTPUT_DIR: 'vite',
VITE_RUBY_SSR_BUILD_ENABLED: 'false',
VITE_RUBY_BUILD_CACHE_DIR: '/Users/stevenaguilar/aviato/tmp/cache/vite',
VITE_RUBY_SKIP_PROXY: 'false',
VITE_RUBY_ROOT: '/Users/stevenaguilar/aviato',
VITE_RUBY_SOURCE_CODE_DIR: 'app/javascript',
VITE_RUBY_AUTO_BUILD: 'false',
VITE_RUBY_HIDE_BUILD_CONSOLE_OUTPUT: 'false',
VITE_RUBY_MODE: 'production',
VITE_RUBY_BASE: '',
VITE_RUBY_CONFIG_PATH: 'config/vite.json',
VITE_RUBY_PUBLIC_DIR: 'public',
VITE_RUBY_SSR_OUTPUT_DIR: '/Users/stevenaguilar/aviato/public/vite-ssr',
VITE_RUBY_SSR_ENTRYPOINT: '~/ssr/ssr.{js,ts,jsx,tsx}',
VITE_RUBY_HTTPS: 'false',
VITE_RUBY_SKIP_COMPATIBILITY_CHECK: 'false',
VITE_RUBY_PORT: '3036',
VITE_RUBY_HOST: 'localhost',
BASE_URL: '/vite/',
MODE: 'production',
DEV: false,
PROD: true
},
assetsInclude: [Function: assetsInclude],
logger: {
hasWarned: false,
info: [Function: info],
warn: [Function: warn],
warnOnce: [Function: warnOnce],
error: [Function: error],
clearScreen: [Function: clearScreen],
hasErrorLogged: [Function: hasErrorLogged]
},
packageCache: Map(3) {
'fnpd_/Users/stevenaguilar/aviato' => {
dir: '/Users/stevenaguilar/aviato',
data: [Object],
hasSideEffects: [Function: hasSideEffects],
webResolvedImports: {},
nodeResolvedImports: {},
setResolvedCache: [Function: setResolvedCache],
getResolvedCache: [Function: getResolvedCache]
},
'fnpd_/Users/stevenaguilar/aviato/app/javascript' => {
dir: '/Users/stevenaguilar/aviato',
data: [Object],
hasSideEffects: [Function: hasSideEffects],
webResolvedImports: {},
nodeResolvedImports: {},
setResolvedCache: [Function: setResolvedCache],
getResolvedCache: [Function: getResolvedCache]
},
'fnpd_/Users/stevenaguilar/aviato/app' => {
dir: '/Users/stevenaguilar/aviato',
data: [Object],
hasSideEffects: [Function: hasSideEffects],
webResolvedImports: {},
nodeResolvedImports: {},
setResolvedCache: [Function: setResolvedCache],
getResolvedCache: [Function: getResolvedCache]
},
set: [Function (anonymous)]
},
createResolver: [Function: createResolver],
optimizeDeps: {
holdUntilCrawlEnd: true,
esbuildOptions: { preserveSymlinks: false }
},
worker: { format: 'iife', plugins: '() => plugins', rollupOptions: {} },
appType: 'spa',
experimental: { importGlobRestoreExtension: false, hmrPartialAccept: false },
getSortedPlugins: [Function: getSortedPlugins],
getSortedPluginHooks: [Function: getSortedPluginHooks]
}
node_modules/@mui/material/Alert/index.js (1:0): Module level directives cause errors when bundled, "use client" in "node_modules/@mui/material/Alert/index.js" was ignored.
node_modules/@mui/material/AlertTitle/index.js (1:0): Module level directives cause errors when bundled, "use client" in "node_modules/@mui/material/AlertTitle/index.js" was ignored.
node_modules/@mui/material/AppBar/index.js (1:0): Module level directives cause errors when bundled, "use client" in "node_modules/@mui/material/AppBar/index.js" was ignored.
node_modules/@mui/material/Autocomplete/index.js (1:0): Module level directives cause errors when bundled, "use client" in "node_modules/@mui/material/Autocomplete/index.js" was ignored.
node_modules/@mui/material/Avatar/index.js (1:0): Module level directives cause errors when bundled, "use client" in "node_modules/@mui/material/Avatar/index.js" was ignored.
node_modules/@mui/material/AvatarGroup/index.js (1:0): Module level directives cause errors when bundled, "use client" in "node_modules/@mui/material/AvatarGroup/index.js" was ignored.
node_modules/@mui/material/Backdrop/index.js (1:0): Module level directives cause errors when bundled, "use client" in "node_modules/@mui/material/Backdrop/index.js" was ignored.
node_modules/@mui/material/BottomNavigation/index.js (1:0): Module level directives cause errors when bundled, "use client" in "node_modules/@mui/material/BottomNavigation/index.js" was ignored.
node_modules/@mui/material/BottomNavigationAction/index.js (1:0): Module level directives cause errors when bundled, "use client" in "node_modules/@mui/material/BottomNavigationAction/index.js" was ignored.
node_modules/@mui/material/Badge/index.js (1:0): Module level directives cause errors when bundled, "use client" in "node_modules/@mui/material/Badge/index.js" was ignored.
node_modules/@mui/material/Box/index.js (1:0): Module level directives cause errors when bundled, "use client" in "node_modules/@mui/material/Box/index.js" was ignored.
node_modules/@mui/material/Breadcrumbs/index.js (1:0): Module level directives cause errors when bundled, "use client" in "node_modules/@mui/material/Breadcrumbs/index.js" was ignored.
node_modules/@mui/material/Button/index.js (1:0): Module level directives cause errors when bundled, "use client" in "node_modules/@mui/material/Button/index.js" was ignored.
node_modules/@mui/material/utils/index.js (1:0): Error when using sourcemap for reporting an error: Can't resolve original location of error.
Validations
The text was updated successfully, but these errors were encountered: