Skip to content
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

Issues with vite-plugin-ssr #244

Open
andyundso opened this issue Jun 8, 2023 · 2 comments
Open

Issues with vite-plugin-ssr #244

andyundso opened this issue Jun 8, 2023 · 2 comments

Comments

@andyundso
Copy link

Hello!

We use Svelte with vite-plugin-ssr to generate static HTML for parts of our application. Since v1.8.0, the build process no longer works.

Log of the build process:

RUN pnpm prod
#20 0.567 
#20 0.567 > [email protected] prod /app
#20 0.567 > MODE=prod vite build
#20 0.567 
#20 1.480 vite v4.3.9 building for production...
#20 1.515 transforming...
#20 1.958 tsconfig options "importsNotUsedAsValues" and "preserveValueImports" are deprecated. Either set "ignoreDeprecations" to "5.0" in your tsconfig.json to silence this warning, or replace them in favor of the new "verbatimModuleSyntax" flag.
#20 6.233 10:37:31 AM [vite-plugin-svelte] /src/routes/DifferentChainId.svelte:14:9 A11y: 'javascript:history.back()' is not a valid href attribute
#20 6.233 12:       However, FlatFeeStack requires to use {queryParams.required}. Please
#20 6.233 13:       change your network in MetaMask and
#20 6.233 14:       <a href="javascript:history.back()">click here</a> to return to the previous
#20 6.233              ^
#20 6.233 15:       page.
#20 6.233 16:     </p>
#20 8.932 10:37:34 AM [vite-plugin-svelte] /src/components/DAO/Navigation.svelte:80:2 Unused CSS selector ".navigation .inactive"
#20 8.933 78:   }
#20 8.933 79:   .navigation :global(a),
#20 8.933 80:   .navigation .inactive {
#20 8.933       ^
#20 8.933 81:     display: block;
#20 8.933 82:     color: var(--secondary-700);
#20 8.934 10:37:34 AM [vite-plugin-svelte] /src/components/DAO/Navigation.svelte:88:2 Unused CSS selector ".navigation .inactive"
#20 8.934 86:   }
#20 8.934 87: 
#20 8.934 88:   .navigation .inactive {
#20 8.934       ^
#20 8.934 89:     color: var(--secondary-[300](https://github.com/flatfeestack/flatfeestack/actions/runs/5210238220/jobs/9401060134?pr=277#step:5:304));
#20 8.934 90:   }
#20 8.934 10:37:34 AM [vite-plugin-svelte] /src/components/DAO/Navigation.svelte:93:2 Unused CSS selector ".navigation .selected"
#20 8.934 91: 
#20 8.934 92:   .navigation :global(a:hover),
#20 8.934 93:   .navigation .selected {
#20 8.934       ^
#20 8.934 94:     background-color: var(--tertiary-900);
#20 8.934 95:     color: var(--tertiary-700);
#20 17.19 ✓ 540 modules transformed.
#20 17.80 rendering chunks...
#20 18.46 computing gzip size...
#20 18.58 vite v4.3.9 building SSR bundle for production...
#20 18.61 transforming...
#20 19.62 dist/client/vite-plugin-ssr.json                                          0.16 kB │ gzip:   0.14 kB
#20 19.63 dist/client/manifest.json                                                 1.90 kB │ gzip:   0.41 kB
#20 19.63 dist/client/stats.html                                                  403.91 kB │ gzip:  71.16 kB
#20 19.63 dist/client/assets/static/default.page.client.1baab23c.css                5.78 kB │ gzip:   1.64 kB
#20 19.63 dist/client/assets/static/index.page.c146637c.css                        13.96 kB │ gzip:   3.28 kB
#20 19.63 dist/client/assets/entries/src_pages_default.page.client.449e380f.js      0.14 kB │ gzip:   0.14 kB
#20 19.63 dist/client/assets/entries/entry-server-routing.bb45d05d.js               2.11 kB │ gzip:   1.07 kB
#20 19.63 dist/client/assets/chunks/chunk-078aa1fb.js                              29.58 kB │ gzip:  10.28 kB
#20 19.63 dist/client/assets/entries/entry-client-routing.98a76d79.js              35.28 kB │ gzip:  11.62 kB
#20 19.63 
#20 19.63 (!) Some chunks are larger than 500 kBs after minification. Consider:
#20 19.63 - Using dynamic import() to code-split the application
#20 19.63 - Use build.rollupOptions.output.manualChunks to improve chunking: https://rollupjs.org/configuration-options/#output-manualchunks
#20 19.63 - Adjust chunk size limit for this warning via build.chunkSizeWarningLimit.
#20 19.63 dist/client/assets/entries/src_pages_index.page.918add35.js           1,088.60 kB │ gzip: [348](https://github.com/flatfeestack/flatfeestack/actions/runs/5210238220/jobs/9401060134?pr=277#step:5:352).05 kB
#20 19.64 10:37:45 AM [vite-plugin-svelte] /src/routes/DifferentChainId.svelte:14:9 A11y: 'javascript:history.back()' is not a valid href attribute
#20 19.64 12:       However, FlatFeeStack requires to use {queryParams.required}. Please
#20 19.64 13:       change your network in MetaMask and
#20 19.64 14:       <a href="javascript:history.back()">click here</a> to return to the previous
#20 19.64              ^
#20 19.64 15:       page.
#20 19.64 16:     </p>
#20 20.40 10:37:45 AM [vite-plugin-svelte] /src/components/DAO/Navigation.svelte:80:2 Unused CSS selector ".navigation .inactive"
#20 20.40 78:   }
#20 20.40 79:   .navigation :global(a),
#20 20.40 80:   .navigation .inactive {
#20 20.40       ^
#20 20.40 81:     display: block;
#20 20.40 82:     color: var(--secondary-700);
#20 20.40 10:37:45 AM [vite-plugin-svelte] /src/components/DAO/Navigation.svelte:88:2 Unused CSS selector ".navigation .inactive"
#20 20.40 86:   }
#20 20.40 87: 
#20 20.40 88:   .navigation .inactive {
#20 20.40       ^
#20 20.40 89:     color: var(--secondary-300);
#20 20.40 90:   }
#20 20.40 10:37:45 AM [vite-plugin-svelte] /src/components/DAO/Navigation.svelte:93:2 Unused CSS selector ".navigation .selected"
#20 20.40 91: 
#20 20.40 92:   .navigation :global(a:hover),
#20 20.40 93:   .navigation .selected {
#20 20.40       ^
#20 20.40 94:     background-color: var(--tertiary-900);
#20 20.40 95:     color: var(--tertiary-700);
#20 21.83 "Contract" is imported from external module "ethers" but never used in "src/routes/DAO/Treasury.svelte", "src/ts/services.ts", "src/ts/daoStore.ts", "src/components/DAO/proposals/RequestFunds.svelte", "src/routes/Income.svelte" and "src/utils/yup.ts".
#20 21.83 ✓ 205 modules transformed.
#20 21.89 rendering chunks...
#20 21.95 dist/server/package.json                               0.02 kB
#20 21.95 dist/server/importBuild.cjs                            0.48 kB
#20 21.95 dist/server/stats.html                               252.52 kB
#20 21.95 dist/server/importBuild.mjs                            0.23 kB
#20 21.95 dist/server/pageFiles.mjs                              1.25 kB
#20 21.95 dist/server/entries/src_pages_index-page-server.mjs    1.79 kB
#20 21.95 dist/server/entries/src_pages_index-page.mjs         143.67 kB
#20 21.96 ✓ built in 3.38s
#20 22.01 
#20 22.01 ✨ [vite-plugin-compression]:algorithm=gzip - compressed file successfully: 
#20 22.01 server//app/entries/src_pages_index-page-server.mjs.gz   1.75kb / gzip: 0.77kb
#20 22.01 server//app/pageFiles.mjs.gz                             1.22kb / gzip: 0.48kb
#20 22.01 server//app/entries/src_pages_index-page.mjs.gz          140.32kb / gzip: 38.53kb
#20 22.01 server//app/stats.html.gz                                246.62kb / gzip: 52.79kb
#20 22.01 
#20 22.01 
#20 22.57 
#20 22.57 ✨ [vite-plugin-compression]:algorithm=brotliCompress - compressed file successfully: 
#20 22.57 server//app/entries/src_pages_index-page-server.mjs.br   1.75kb / brotliCompress: 0.61kb
#20 22.57 server//app/pageFiles.mjs.br                             1.22kb / brotliCompress: 0.43kb
#20 22.57 server//app/entries/src_pages_index-page.mjs.br          140.32kb / brotliCompress: 32.95kb
#20 22.57 server//app/stats.html.br                                246.62kb / brotliCompress: 45.33kb
#20 22.57 
#20 22.57 
#20 22.57 vite-plugin-ssr v0.4.131 pre-rendering HTML...
#20 22.97 TypeError: b is not a function
#20 22.97     at file:///app/dist/server/entries/src_pages_index-page.mjs:2:2821
#20 22.97     at Object.t [as $$render] (file:///app/dist/server/entries/src_pages_index-page.mjs:1:4435)
#20 22.97     at Object.default (file:///app/dist/server/entries/src_pages_index-page.mjs:843:24)
#20 22.97     at file:///app/dist/server/entries/src_pages_index-page.mjs:4:2896
#20 22.97     at Object.t [as $$render] (file:///app/dist/server/entries/src_pages_index-page.mjs:1:4435)
#20 22.97     at Object.default (file:///app/dist/server/entries/src_pages_index-page.mjs:811:95)
#20 22.97     at file:///app/dist/server/entries/src_pages_index-page.mjs:10:22
#20 22.97     at Object.t [as $$render] (file:///app/dist/server/entries/src_pages_index-page.mjs:1:4435)
#20 22.97     at file:///app/dist/server/entries/src_pages_index-page.mjs:811:47
#20 22.97     at t (file:///app/dist/server/entries/src_pages_index-page.mjs:1:4435)

If I run the build locally, it looks like it is a minified version of this, but c there was renamed to b.

Not sure if we need to change something or if this is an actual bug in your library. If you want to check it out yourself, the code base is open-source.

@krishnaTORQUE
Copy link
Collaborator

Could you please make a minimal repo with this issue only?
Its really hard to see in the long code base.

andyundso added a commit to andyundso/vite-plugin-ssr-svelte-routing-issue that referenced this issue Jun 9, 2023
@andyundso
Copy link
Author

Here you go: https://github.com/andyundso/vite-plugin-ssr-svelte-routing-issue.

I tried to extract the configuration as close as possible from the project I originally linked. npm run dev will yield a build without code minification.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants