Option to remove hash from filenames

[kauaicreative]

Describe the problem

Svelte used to build files (css,js,png,etc.) without hashing the file names? This makes embedding into wordpress much simpler.

I have several svelte apps which I am dynamically inserting into wordpress content via shortcodes. In wordpress/php I wp_register_script() and wp_enqueue_script() to add the css and js assets to the wordpress page render process. These filenames can not change. I then insert the svelte startup markup into the content. e.g. svelte:

, or sveltekit: start({...})

Describe the proposed solution

option to not hash filenames

Alternatives considered

This is related to https://github.com/sveltejs/kit/issues/3882

Importance

i cannot use vite-plugin-svelte without it

[bluwy]

Svelte doesn't build files, the old Svelte template that uses Rollup does. To configure that in Vite or SvelteKit, you can use Vite's build.rollupOptions.assetFileNames to control the file name generated for each assets. A hash is generated by default so you can override that to something like: [name].[ext]. Nonetheless, this isn't related to vite-plugin-svelte

[kauaicreative]

Thanks for tip @bluwy

Modifying the vite.config.js to the following solves this issue

import {defineConfig} from 'vite'
import {svelte} from '@sveltejs/vite-plugin-svelte'

// https://vitejs.dev/config/
export default defineConfig({
    plugins: [svelte()],
    build:   {
        rollupOptions: {
            output: {
                entryFileNames: `assets/[name].js`,
                chunkFileNames: `assets/[name].js`,
                assetFileNames: `assets/[name].[ext]`
            }
        }
    }
})

[edwinspire]

Currently I am working with Electronic Devices, mainly ESP32 and ESP8266, in them I have a Web administrator made with Svelte.

When I run the npm run build I get 2 relevant files, bundle.js and bundle.css which contain just what I need. See: https://github.com/edwinspire/ocs_esp_webadmin/tree/main/public/build

Today I downloaded the new version of SvelteKit and I can't configure it to return only those two files, on the contrary it returns many js files in several folders. The microcontroller does not handle a file system where it can create subfolders, so the way it generates the files no longer works for me.

I really like Svelte and I've been using it since it came out and I want to keep using it.

Please, if you can guide me how to configure it, I will be eternally grateful.

[mdocter]

This doesn't work anymore ;-(

Thanks for tip @bluwy

Modifying the vite.config.js to the following solves this issue

import {defineConfig} from 'vite'
import {svelte} from '@sveltejs/vite-plugin-svelte'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [svelte()],
  build:   {
      rollupOptions: {
          output: {
              entryFileNames: `assets/[name].js`,
              chunkFileNames: `assets/[name].js`,
              assetFileNames: `assets/[name].[ext]`
          }
      }
  }
})

I get the following build messages:

The following Vite config options will be overridden by SvelteKit:
  - build.rollupOptions.output.entryFileNames
  - build.rollupOptions.output.chunkFileNames
  - build.rollupOptions.output.assetFileNames

Any other options to remove the hash from the file names?

[dominikg]

@mdocter the message you posted shows that you encountered a config problem with Svelte-Kit.

If you need help with configuring it, please ask on svelte-discord . You can also search for a solution in the SveliteKit repo

This is not related to vite-plugin-svelte at all.

[mdocter]

@dominikg You are right Dominik. SvelteKit overwrites these settings, so this is not the right place to elaborate on this topic. Do you want me to remove these two comments?