Laravel vite, Failed to load PostCSS config

Рейтинг: 0Ответов: 1Опубликовано: 04.06.2023

После установки breeze в Laravel в корне сайта появляется файл postcss.config.js:
postcss.config.js

export default {
    plugins: {
        tailwindcss: {},
        autoprefixer: {},
    },
};

и перестаёт работать команда npm run dev | build, до этого работала, выдаёт ошибку:

[vite:css] Failed to load PostCSS config [SyntaxError] Unexpected token 'export'  
postcss.config.js:1
export default {
^^^^^^

SyntaxError: Unexpected token 'export'

vite ведь по идее понимает новый синтаксис js.
И дело в том что если закомментировать файл postcss.config.js то эта ошибка пропадает.
Подскажите какое есть решение чтобы обойти эту проблему не комментируя файл postcss.config.js?

vite.config.js

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

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

пытался сюда добавлять target: 'es2020', не поменялось ничего
package.json

{
    "private": true,
    "scripts": {
        "dev": "vite",
        "build": "vite build"
    },
    "devDependencies": {
        "@tailwindcss/forms": "^0.5.2",
        "alpinejs": "^3.4.2",
        "autoprefixer": "^10.4.2",
        "axios": "^1.1.2",
        "jquery": "^3.2.1",
        "laravel-vite-plugin": "^0.7.2",
        "lodash": "^4.17.21",
        "postcss": "^8.4.6",
        "sass": "^1.62.1",
        "tailwindcss": "^3.1.0",
        "vite": "^4.0.0"
    }
}

Если переименовать postcss.config.js в postcss.config.mjs будет ли это правильное решение?

Ответы

▲ 0

Вам надо удалить папку node_modules

потом действовать согласно инструкции для установки Tailwind под Laravel

в конце выполнить команду npm install && npm run dev