How to link css files to my html in Lumen

Question

I have just begun learning lumen and can't seem to find the answer to this simple question. This is my current <head>:

   <head>
    <title>Sharp notes!</title>
    <link rel="stylesheet" type="text/css" href="/assets/css/main.css">
    <link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
    </head>

This causes the following error:

[Sat Jun 17 20:13:09 2017] 127.0.0.1:56950 [200]: /
[Sat Jun 17 20:13:09 2017] 127.0.0.1:56952 [404]: /assets/css/main.css - No such file or directory

Please help!

`/` goes to my welcome page which is in `myApp/resources/views/welcome.blade.php`. And my css path is `myApp/resources/assets/css/main.css` — Flame of udun, Jun 18 '17 at 01:00
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/146976/discussion-between-kris-roofe-and-vineet-kaushik). — LF00, Jun 18 '17 at 01:13

score 3 · Answer 1 · 2017-06-18T03:05:39.257

3

You should put the css files in your public directory.

myApp/public/css/main.css

Then the asset helper should resolve the path correctly

{{ asset('/css/main.css') }}

Further explanation here:

https://laracasts.com/discuss/channels/general-discussion/asset-vs-url

Your assets (css, js, images, etc.) need to be placed in the application's public directory.

edited Jun 18 '17 at 03:05

answered Jun 18 '17 at 02:28

Laurent Raffalli · Answer 2 · 2019-08-30T13:04:45.567

3

The solution : you need to use url('') ,

Because Lumen does not provide the asset helper function you may want to use url e.g.

The url function generates a fully qualified URL to the given path: Blade. More informations ir : Laravel Helpers url()

HOW TO :

With Blade :

<link rel="stylesheet" href="{{ url('/assets/css/main.css') }}">

With PHP :

<link rel="stylesheet" href="<?php url('/assets/css/main.css') ?>">

if you want you can create your own asset helper function of course, have a look here:

https://laracasts.com/discuss/channels/lumen/extend-helper-functions-to-lumen?page=0

or

How to do {{ asset('/css/app.css') }} in Lumen?

edited Aug 30 '19 at 13:04

answered Aug 20 '19 at 11:09

Laurent Raffalli

41
5

edited for mistake ;) and negative review ... I m Junior Sorry :) – Laurent Raffalli Aug 29 '19 at 21:45
With PHP you missed **echo**. It should have been; `` – Lawrence Macharia Feb 09 '20 at 17:37
This is right! -> Lumen does not provide the asset helper function... worked for me. – TomLi Jun 17 '20 at 10:33

score 2 · Answer 3 · answered Aug 30 '19 at 09:12

2

maybe it helps you try this

<link rel="stylesheet" type="text/css" href="{{ URL::asset('resources/assets/css/main.css') }}">

answered Aug 30 '19 at 09:12

Nurbek Boymurodov

542
3
11

score 1 · Answer 4 · answered Oct 20 '20 at 08:51

1

You can simply put your assets folder (containing img, libs, js and styles) into public folder & do the needful like like this. <img src="assets/img/visa.PNG">

answered Oct 20 '20 at 08:51

Mehdi .H Jaff

21
2

score 0 · Answer 5 · answered Apr 03 '18 at 06:09

0

In laravel lumen you don't have to define the public path . Put your assets into public folder and rest will automatically tracked. For more information visit https://lumen.laravel.com

answered Apr 03 '18 at 06:09

fahim hasan

38
1
9

How to link css files to my html in Lumen

5 Answers5