0

I'm new to laravel and vite. I want to create different .js files so I can have some order. For example, I want a js for a calendar and I will use it in clockin.blade.php (and some other blade.php files). How do I call any functions in calendar.js from clockin.blade.js?

I tried with <script src="/resources/js/calendar.js"> but the console shows: GET http://127.0.0.1:8000/resources/js/calendar.js net::ERR_ABORTED 404 (Not Found)

I tried importing it to the app.js file and then calling the funciton like this <script> asd(); </script> but the console says asd does not exist

I also tried <script src="{{ asset('js/calendar.js') }}"></script> (thanks for nothing, ChatGPT) but as far as I know, asset points to the public folder while calendar.js is inside /resources/js/

The <script> tags are always inside push('scripts') and the stack('scripts') is inside the app.blade.php body.

My vite config is:

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

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

How is this done in laravel and vite?

Edit: I also tried adding the js to @vite. Then I do this in clockin.blade.php:

<script src="/resources/js/calendar.js">
    asd();
</script>

But I get the error: GET http://127.0.0.1:8000/resources/js/calendar.js net::ERR_ABORTED 404 (Not Found) If instead of a functon I just write console.log("hello world") in calendar.js, the console shows "hello world". I guess I don't know how to call functions? Also, why the downvote? (I want to improve in stack overflow)

matsrom
  • 55
  • 6
  • This question and its answers may be relevant: [How import own js file into vite?](https://stackoverflow.com/q/73331352/) – Hovercraft Full Of Eels Jul 29 '23 at 01:14
  • I forgot to mention that I also tried this. After adding calendar.js to @vite in app.blade.php I call the asd function like this in clockin.blade.php: But I get the error: GET http://127.0.0.1:8000/resources/js/calendar.js net::ERR_ABORTED 404 (Not Found) If instead of a function I just write a console.log in calendar.js, the console shows the console.log. It seems that I don't know how to call functions. – matsrom Jul 29 '23 at 12:13
  • Consider double checking the path that you're using to the file. For example, are you sure that you need the leading slash, `src="/resources/js/calendar.js"` vs `src="resources/js/calendar.js"`? Have you tried other relative paths? – Hovercraft Full Of Eels Jul 29 '23 at 12:16
  • I also Tried `resources/js/calendar.js` and `../../js/calendar.js` but I still get the error http://127.0.0.1:8000/js/calendar.js net::ERR_ABORTED 404 (Not Found) – matsrom Jul 29 '23 at 12:55

0 Answers0