CSS file name changed after v3 upgrade

[IGx89]

Describe the bug

Hello! I have a pretty basic vite.config.ts. Main area of interest is this:

  build: {
    rollupOptions: {
      input: {
        "my-app": resolve(__dirname, "index.html"),
      },
    }
  }

With Vite 2.x, it would produce this output:

dist/index.html
dist/assets/my-app.<hash>.css
dist/assets/my-app.<hash>.js

After upgrading to Vite 3 it changed to this:

dist/index.html
dist/assets/index.<hash>.css
dist/assets/my-app.<hash>.js

Is that change intentional? Is there an easy way to get this behavior back, beyond adding a hack in assetFileNames?

Thanks!

Reproduction

https://stackblitz.com/edit/vitejs-vite-r2ykgd?file=vite.config.js

System Info

System:
    OS: Windows 10 10.0.19044
    CPU: (4) x64 Intel(R) Core(TM) i7-7600U CPU @ 2.80GHz
    Memory: 5.73 GB / 23.84 GB
  Binaries:
    Node: 16.14.2 - C:\Program Files\nodejs\node.EXE     
    npm: 8.5.0 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Chrome: 104.0.5112.102
    Edge: Spartan (44.19041.1266.0), Chromium (104.0.1293.63)

Used Package Manager

npm

Logs

No response

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• 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.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[milahu]

this works for me, with vite v3.1.0

// vite.config.js

import { defineConfig } from "vite";
import solidPlugin from "vite-plugin-solid"; // solidjs framework

const assetsDir = 'assets/';

const outputDefaults = {
  // remove hashes from filenames
  entryFileNames: `${assetsDir}[name].js`,
  chunkFileNames: `${assetsDir}[name].js`,
  assetFileNames: `${assetsDir}[name].[ext]`,
}

export default defineConfig({
  plugins: [
    solidPlugin(), // solidjs framework
  ],
  build: {
    target: "esnext",
    polyfillDynamicImport: false,
    //sourcemap: true,
    rollupOptions: {
      output: {
        ...outputDefaults,
      }
    },
  },
  worker: {
    rollupOptions: {
      output: {
        ...outputDefaults,
      }
    },
  },
});

example output

npm run build 

> vite-template-solid@0.0.0 build
> vite build

vite v3.1.0 building for production...
dist/assets/logo.svg            1.56 KiB
dist/assets/editor.worker.js    170.93 KiB
dist/index.html                 0.62 KiB
dist/assets/index.css           61.38 KiB / gzip: 10.88 KiB
dist/assets/index.js            2026.99 KiB / gzip: 529.85 KiB

when i remove worker.rollupOptions.output then i get, for example

dist/assets/editor.worker.b9a77fdc.js

but all the other filenames are ok

duplicate of #7613

[julien-fontaine]

I run into the same issue, and it ignores not only the file name, but also the specified path:

    build: {
        rollupOptions: {
            input: {
                'js/main.js': 'resources/js/app.js',
                'js/utils/my-util.js': 'resources/js/utils/my-util.js',
                'css/main.css': 'resources/sass/app.css',
                'css/utils/colors.css': 'resources/sass/utils/my-util.css',
            }
        }
    },

produces

dist/assets/js/main.<hash>.js
dist/assets/js/utils/my-util.<hash>.js
dist/assets/app.<hash>.css
dist/assets/my-util.<hash>.css

I would also like to highlight that this bug does not affect JavaScript file.
It still occurs in v3.1.1.

[ianwitherow]

Still have this problem; any update?

Built css files end up named "index-[hash].css" instead of using the [name].

[IGx89]

Still occurring in v4.0.4, FYI.

[oliveiracdz]

It seems that PR #9485 fixes this bug.

[julien-fontaine]

This issue also occurs when using the build.lib.entry config key, which is much more annoying. It removes (or merges?) files that have the same name, but are in different directories, from the dist directory.