laravel elixir script not building when compiled - php

Folder Tree
Gulp.js
var elixir = require('laravel-elixir');
elixir(function(mix) {
mix.sass('app.scss')
.script('app.js')
.version( ['css/app.css','js/app.js']);
});
Why is script not building and doesn't create js folder in public/build and not even added in rev-manifest.json?
that's why when i call it to my Html, it throw's an error: "File js/app.js not defined in asset manifest".
HTML
<script type="text/javascript" src="{{ elixir('js/app.js') }}"></script>

The scripts (plural) method assumes all paths are relative to the resources/assets/js directory, and will place the resulting JavaScript in public/js/all.js by default. If you need to change the destination folder you can use the second parameter:
.scripts(['app.js'], 'public/build/js/app.js')
I hope this will help you.

Related

I am getting wrong assets url using Laravel helper "secure_asset"

I have a website on domain mydomain.space
I include in my blade file some js file in such way:
<script type="text/javascript" src="{!! secure_asset('js/app.js') !!}"></script>
But then, on production, I see in browser logs, that frontend try to load file by this URL:
http://mydomainspace/js/app.js
Yeah, for some reason it removes dot and as result - it is wrong URL...
But when I display APP_URL variable - it shows "mydomain.space" (with dot).
Why I lose dot in URL when use secure_asset helper?
I would try using mix instead:
<script type="text/javascript" src="{{ mix('js/app.js') }}"></script>
It provides a lot of benefits and may resolve your issue https://laravel.com/docs/8.x/mix
That being said I would ensure your APP_URL is not being changed in the app.php file
Setting ASSET_URL in .env was a fix for me:
ASSET_URL=http://localhost

Laravel jQuery is not defined, no defer in script tag

In my app.js file, jQuery is defined:
import * as $ from 'jquery';
console.log($); //works fine
My app.js is processed by webpack and laravel mix, and loaded from the public folder:
<!-- Scripts -->
<script src="{{ asset('themes/metajibe/js/app.js') }}"></script>
Notice there is no defer. I even moved it from the bottom of the app.blade.php to up in the <head>. However, if I run some custom javascript on a template, $ is undefined, as is jQuery. They are both defined in the console after the page loads. Once again, I can write my custom javascript in the mix app.js, and use jQuery just fine, but I want this to only run on a specific page to adjust some UI. Thoughts?

Laravel CSS file link correction

I need to move a laravel setup to another server.
Before moving I am testing the same on my localhost.
Everything appears to work right except I am getting wrong link for CSS, js files like
GET
http://127.0.0.1/css/main.css
whereas my laravel phyiscal folders are like this
e:\wamp\www\test\server-migrate\megashopping_dk\css\main.css
Now I don't know where to define the path in laravel for CSS, Js.
if you have a layouts.blade.php file which you use on every page of your website, you should define the path there with this code
{{ URL::to('/') }}/css/main.css
this code goes to the homepage of your website and then goes to css/main.css
Let me know if it worked
You have to place your assets (js & css) somewhere under /public
You can include it like this:
<script src="{{ secure_asset('bower\jquery\dist\jquery.min.js') }}"></script>
<script src="{{ secure_asset('bower\materialize\dist\js\materialize.min.js') }}"></script>
The file in this example is located at project path
/public/bower/jquery/dist/jquery.min.js

How to use angularjs template inside php project based on Zend

I have php framework based on Zend library and I'd like to use angularjs script in phtml file but I have problem how to include template edytuj_row.phtml located in:
ProjectName->SourceFiles->application->admin->views->settings->edytuj.phtml
<div row-settings></div>
<script type="text/javascript">
var app = angular.module('mainApp', []);
app.directive('rowSettings', function(){
return {
templateUrl: 'edytuj_row.phtml'
};
});
</script>
Both files edytuj_row.phtml and edytuj.phtml are localizated in the same directory but edytuj_row.phtml is not seen. What is right path in templateUrl ? In this situation in place of <div row-settings></div> is loaded recurently main web page instead of template.
Angular has no access to Zend files (templates). You need to set valid URL to templateUrl (eg. /admin/users/edytuj-row)
You probably have edytujAction and edytujRowAction. Check what URL path directs to edytujRowAction (probably in Bootstrap.php) and set it in templateUrl.

CodeIgniter relative path or base URL function?

All these days I thought that CodeIgniter did not allow direct access to file(s) in the application (I mean the application itself and not the application folder).
So, if I have the following structure under the folder, www:
ROOT
|____APPLICATION
|___________JS/mine.js
|___________VIEWS/my_view.php
And if I want to include mine.js in my_view.php, I would need to refer the JS file using the base_url() function as follows:
<script type="text/javascript" src="<?php echo base_url();?>js/mine.js"></script>
Looks like I was wrong, I can refer to it relatively as well. Like:
<script type="text/javascript" src="../js/mine.js"></script>
Any thoughts/opinions?
Which one is a good practice? And why?
It's always a smart idea to use base_url() so if your URL changes, all your links don't break.
base_url() is going to return the full TLD, plus any folders your site is in.
Best practice is to keep your assets out of the application, or any other system folders. Most CodeIgniter sites will structure their assets as follows:
ROOT
|____APPLICATION
|____ASSETS
| |________ CSS
| |________ JS
| |________ IMG
|____SYSTEM
And then referenced like so:
<script type="text/javascript" src="<?php echo base_url('assets/js/mine.js')"></script>
It is always a good idea while using MVC to keep all assets folders (css, js and images) in root directory rather than keeping inside application or any other folder and accessing them using base_url.
<script type="text/javascript" src="<?php echo base_url();?>js/mine.js"></script>
So I think above line you mentioned is the proper way.

Categories