Errors while using npm in Laravel project [closed]

by

This is my app.js file:

import './bootstrap';

import Alpine from 'alpinejs';
import Swal from 'sweetalert2'

window.Alpine = Alpine;
window.Swal = Swal;


import { ClassicEditor } from '@ckeditor/ckeditor5-editor-classic';

import { Bold, Italic } from '@ckeditor/ckeditor5-basic-styles';
import { Essentials } from '@ckeditor/ckeditor5-essentials';
// More imports.
// ...

import { Markdown } from '@ckeditor/ckeditor5-markdown-gfm';

ClassicEditor
    .create( document.querySelector( '#editor' ), {
        plugins: [
            Markdown,
            Essentials,
            Bold,
            Italic,
            // More plugins.
            // ...
        ],
        // More of editor's configuration.
        // ...
    } )
    .then( /* ... */ )
    .catch( /* ... */ );


Alpine.start();

I used the npm run build and npm run dev commands. Here’s blade file:

<!DOCTYPE html>
<html lang="en">
<head></head>
    <body>
        <button type="button" class="btn btn-primary">Primary</button>

        <textarea class="editor" id="editor"></textarea>
    </body>
</html>

Instead of a Bootstrap button and a text editing field, I get something like this:

enter image description here

The main error is that what was installed via npm doesn’t work

  • Add errors to Your question

    – 

  • @num8er i don’t have any error while using npm commands or in console when i use only bootstrap whitout cke i have small error when i add code about ckedior like (!) Some chunks are larger than 500 kB after minification. Consider: – Using dynamic import() to code-split the application – Use build.rollupOptions.output.manualChunks to improve chunking: rollupjs.org/configuration-options/#output-manualchunks – Adjust chunk size limit for this warning via build.chunkSizeWarningLimit. or [vite:css] Nested CSS was detected, but CSS nesting has not been configured correctly.

    – 




  • '#editor' is looking for an element with an id of editor. There is no such element

    – 

  • <textarea class="editor" id="editor"></textarea>

    – 




  • @num8er I added the corrected code

    – 

Leave a Comment