Reactjs Question posted in
The new location for the React Documentation can be found here.

Reactjs – Vitest – Unknown file extension ".css"

With React project set up with Vite and run tests with Vitest v2.1.1, we might see the following issue with CSS files:

TypeError: Unknown file extension .css for /path/to/css/file

How can we resolve it?

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    The solution is to set the pool option to use vmThreads or vmForks, like this:

    export default defineConfig({
  test: {
    pool: "vmThreads",
  },
});

    With this option, the following option deps.web.transformCss will be set to true by default, which will resolve the problem.


  2. 0

    As discussed in issue vitest-dev/vitest #3862, the solution to the problem is setting the deps.web.transformCss parameter to true.

    @MinhTC gave a similar answer but did not provide an explanation. I would attach this alongside it.

    The relevant part of the deps.web.transformCss section from the Vitest documentation reads as follows:

    deps.web.transformCss

    • Type: boolean
    • Default: true

    Should Vitest process CSS (.css, .scss, .sass, etc) files and resolve them like Vite does in the browser.

    If CSS files are disabled with css options, this option will just silence ERR_UNKNOWN_FILE_EXTENSION errors.

    WARNING
    At the moment, this option only works with vmThreads and vmForks pools.

    Although the setting is true by default, which would suggest that the error message mentioned in the question should not occur, the warning in the documentation clearly explains that the setting will only work with the pool: "vmThreads" or pool: "vmForks" configuration, what mentioned by @MinhTC.

    export default defineConfig({
  test: {
    pool: "vmThreads", // or "vmForks"
  },
});

    Alternative solution

    Although the file was missing from the question (which could possibly belong to a external package), and only need to inform Vitest to use the external files with the server.deps.inline.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search