Is the docs for Laravel right?

[camilajenny]

The docs for Laravel here https://tailwindcss.com/docs/installation/framework-guides/laravel/vite says I should create a vite.config.ts with

import {defineConfig} from 'vite'
import tailwindcss from '@tailwindcss/vite'

export default defineConfig({
    plugins: [
        tailwindcss(),
    ],
})

Is it correct?

PhpStorm says

and also it doesn't look like Laravel way, maybe it should be vite.config.js

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';

export default defineConfig({
  plugins: [
    laravel({
      input: ['resources/css/app.scss', 'resources/js/app.js'],
      refresh: true,
    }),
  ],
});

I'm new to Laravel

[camilajenny]

Also even when I converted it to vite.config.js and ran vite, I only got

vite
✘ [ERROR] Failed to resolve "@tailwindcss/vite". This package is ESM only but it was tried to load by require. See https://vite.dev/guide/troubleshooting.html#this-package-is-esm-only for more details. [plugin externalize-deps]

although I have "@tailwindcss/vite": "^4.1.11", in my package.json.

[craigrileyuk]

You need to add

"type": "module"

to your package.json file in your Laravel project root.

[camilajenny]

thanks, now it works (no error about resolving the package) but I still prefer the laravel plugin way, the messages look so much better that way