Laravel по-русски

Русское сообщество разработки на PHP-фреймворке Laravel.

Ты не вошёл. Вход тут.

#1 28.02.2024 18:22:12

Не могу подключить TW Elements к Laravel 8

Здравствуйте!

Пытаюсь подключить TW Elements к Laravel 8. Всё делаю строго по документации. Чтобы не думалось, даже начал пустой проект.

Но в результате не подгружаются JS скрипты необходимые для работы TW Elements.

Что у меня получилось:

Файл postcss.config.js

module.exports = {
  plugins: {
    tailwindcss: {},
    autoprefixer: {},
  },
}

Файл tailwind.config.js

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    "./resources/**/*.blade.php",
    "./resources/**/*.js",
    "./resources/**/*.vue",
    "./node_modules/tw-elements/dist/js/**/*.js"
  ],
  theme: {
    extend: {},
  },
  darkMode: "class",
  plugins: [require("tw-elements/dist/plugin.cjs")]
}

Файл webpack.mix.js

const mix = require('laravel-mix');

mix.js('resources/js/app.js', 'public/js')
    .postCss('resources/css/app.css', 'public/css', [
        //
    ]);

Файл resources/css/app.css

@import url("https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900&display=swap");
@tailwind base;

@layer base {
  html {
    @apply text-[#4f4f4f];
  }
  html.dark {
    @apply text-neutral-50;
    @apply bg-neutral-800;
  }
}

@tailwind components;
@tailwind utilities;

Файл resources/js/app.js

require('./bootstrap');
import 'tw-elements';
import { Tooltip, initTE } from "tw-elements";
initTE({ Tooltip });

Работа команды npm run dev проходит гладко, ошибок нет. Бандлы создаются.

Но при попытке открыть страницу в консоли JS я вижу следующие ошибки:

app.js:24157 Uncaught TypeError: Cannot read properties of null (reading 'appendChild')
    at De (app.js:24157:37)
    at ./node_modules/tw-elements/dist/js/tw-elements.es.min.js (app.js:24163:20)
    at __webpack_require__ (app.js:35758:42)
    at ./resources/js/app.js (app.js:2065:69)
    at __webpack_require__ (app.js:35758:42)
    at app.js:36032:64
    at __webpack_require__.O (app.js:35795:23)
    at app.js:36034:53
    at app.js:36036:12

И вот тут у меня затык.

Буду признателен за помощь.

Не в сети

Подвал раздела