My question is simple, where should I store js files like bootstrap.js or my own files?
I found out this
Where should I store JS in Laravel 5?
But I really don't understand how should I include it in my view to be used.
If you are using either of two case in your mentioned link like below
There are 2 places where I can store javascripts: resources/assets/javascripts and public/js.
If you put the files in resources/assets/javascripts, then should add gulp tasks to copy them into public/js folder so it will ultimately present into public/js folder .
2) You can directly put these files in public/js.
Then you can call it in your layout file or any blade file like this
<script src="{{ asset('/js/bootstrap.js') }} "></script>
And if you are using laravelcollective/html form then you can also do this like
{{ Html::script('js/bootstrap.js') }}
you can put it inside public/js folder
Then you can add it in header or footer as usual like <script src="{{ asset('assets/js/bootstrap.js') }} " type="text/javascript"></script>
Related
In my Laravel 9 project that I am working on, I want to put a javascript file containing common functions in app.blade.php. As per How to include External CSS and JS file in Laravel 5.5, I placed the js file in public/js folder and included the following in app.blade.php
<!-- common js functions added by Ravi -->
<script src="{{ asset('js/common_js.js') }}" ></script>
However, this file is not getting included on the page, and the js functions included in the file are not available in console.
Could someone advise me how to include a js file so that it is available for all pages?
Thanks.
if you are using laravel vue do this
place th common_js.js file in resources folder than change this
//in webpack.mix.js
mix.js(["resources/js/app.js","resources/js/common_js.js"], "public/js")
and in app.blade.php use this
<script src="{{ mix('js/app.js') }}" defer></script>
than
npm run dev
run command
php artisan view:clear
you need to check the path rendered by asset() if it's not the correct path you can change the asset path from the .env file ASSET_URL
Normally I use a javascript file to import different JS files. Now having a difficulty to do it so. The project I am working on went wild and have a 5Mb JS file and I only want a piece of it to load on one page.
In a Javascript file I could import the Module like this,
import {Module} from "./components/Module";
and use as
Module.init();
But what I am trying to do is load this Module in a blade file. The js file lives under resources/assets/js/components/Module.js
Because this folder is not public I am not sure if I use something like
<script src="../../../resources/assets/js/components/Module.js"></script> on the page. Well, tried it but did not work as well.
All I want to be able to init the JS like Module.init(); inside my blade file.
I would really appreciate and directions as I am a bit confused right now:(
You cant import your files from resources directory, the only visible part of your application to users should be public folder so you should put your file into the public folder. for example
public/js/modjule.js
and import it like this
<script src="{{ asset('js/module.js') }}"
if your site is on a https protocol you can use secure_asset()
<script src="{{ secure_asset('js/module.js') }}"
I want to use this package for audio equalizing animation. I want to add it in my Laravel project so I copied two files which are
jquery.reverseorder.js
jquery.equalizer.js
to /myproject/node_modules/myjss/
and added these two lines
import 'myjss/jquery.equalizer'
import 'myjss/jquery.reverseorder'
into /myproject/resources/js/app.js
but it returns TypeError: $(...).equalizer is not a function
How can I fix it?
You don't need to save those files like that. Just save them in laravel's assets folder. then in laravel, you should include it like this <script type="text/javascript" src="js/jquery.reverseorder.js"></script> . in src path, you can use asset_path of laravel. You can include this path in js or laravel's blade template.
In my project there is folder named mine with 2 subfolders (static folder & templates folder) and 1 app.py file init.
I have put my jQuery script file inside the static folder and shop.html file is in the templates folder. I want to link that html file to that js file.
I put this inside the html file:
<script type=text/javascript src="{{url_for('static', filename='/static/hide.js') }}"></script>
But it does not work? What is the problem?
You have a duplicate 'static' in there:
url_for('static', filename='hide.js')
The first 'static' will automatically populate with the URL which points to the static folder, therefore putting 'static' in the filename field is redundant.
url_for('static', filename='static/hide.js')
# '/static/static/hide.js'
url_for('static', filename='hide.js')
# '/static/hide.js'
my jquery file path is c:\xampp\htdocs\project\resources\assets\js\jquery.min.js
..I have tried like below on my page but jquery file don't included ! What I am wrong ..
{{-- <script src="{{ URL::asset('assets/js/jquery.min.js') }}"></script> --}}
The URL::asset() is a helper function in laravel,
when you use this function it automatically generates the URL path to the
ProjectName/public and you have to specify the remaining path inside the asset method.
So, first you would want to place the css , js , 'images' and 'fonts' files inside your public folder that is in the root directory of your project.
then you can use the asset() or URL::asset() to locate your file.
the standard folder structure looks like this ..
ProjectName/public/css/main.css
ProjectName/public/js/jquery.min.js
etc ..
i think that would work for you .
Add those file in public/ folder like public/assets/js/jquery.min.js
Please make sure you have proper access rights to aforementioned resource (js file). You can also try to view the file with your web browser by visit http://your_hostname/assets/js/jquery.min.js