css js file not loading

My css and js files are not loading in the project. The php file is master.blade.php. Please see the attached image.

//css link
 <link href="../resources/assets/sass/bootstrap.min.css" rel="stylesheet">

    <link href="../resources/assets/sass/layout_style.css" rel="stylesheet" type="text/css">
    // javascript link
     <script src="../resources/assets/js/bootstrap.min.js"></script>
    <script src="../resources/assets/js/jquery-1.11.1.min.js"></script>

url of uploaded image https://ibb.co/iySKU8

Procat

7 years ago

Level 3

You need to copy them to the public folder, the webserver can't see the resource folder.

scala

7 years ago

Level 1

@Procat I kept my css and js files inside the public folder. But still can not load css and js files. path of the folder ::

<script src="../public/js/bootstrap.min.js"></script>
    <script src="../public/js/jquery-1.11.1.min.js"></script>

 <link href="../public/css/bootstrap.min.css" rel="stylesheet" type="text/css">

    <link href="../public/css/layout_style.css" rel="stylesheet" type="text/css">

Maung-C

7 years ago

Best Answer

Level 1

You should not link into resource folder css and js, you should use into public folder css and js . Coy and paste into public folder your css files and js files from resource. eg. Try like below

//css link
    <link href="{{asset('css/bootstrap.min.css')}}" rel="stylesheet">
    <link href="{{asset('css/layout_style.css')}}" rel="stylesheet">
//javascript link
    <script src="{{asset('js/bootstrap.min.js')}}"></script>
    <script src="{{asset('js/jquery-1.11.1.min.js')}}"></script>

Cruorzy

7 years ago

Level 14

Why copy? you should use NPM for this to compile them to 1 file. This is very useful specially since the npm run prod does minimize the file for a tiny speed boost.

dev = "npm run prod" prod = "npm run prod"

and include the new files in the app.scss

Please or to participate in this conversation.