简体   繁体   English

在 Laravel 中集成自定义 HTML SASS 模板

[英]Integrate custom HTML SASS Template In Laravel

I am trying to integrate a custom html SaaS template in Laravel 7. I have put the template JS and CSS files in public directory and created a master blade in which I have link these js and css files. I am trying to integrate a custom html SaaS template in Laravel 7. I have put the template JS and CSS files in public directory and created a master blade in which I have link these js and css files. But somehow it is not working correctly.但不知何故,它无法正常工作。 I do know that there is some issue with the app.js file but I am unable to identify the actual reason.我确实知道 app.js 文件存在一些问题,但我无法确定实际原因。 I will appreciate if anyone can guide me in this regard.如果有人能在这方面指导我,我将不胜感激。

CSS Files Path: CSS 文件路径:

<head>
    <meta charset="utf-8" />
    <title>{{ config('site_name')}} | Dashboard</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- App favicon -->
    <link rel="shortcut icon" href="{{url('images/favicon.ico')}}">

    <!-- Bootstrap Css -->
    <link href="{{ url('css/bootstrap.min.css')}}" id="bootstrap-style" rel="stylesheet" type="text/css" />
    <!-- Icons Css -->
    <link href="{{ url('css/icons.min.css')}}" rel="stylesheet" type="text/css" />
    <!-- App Css-->
    <link href="{{ url('css/app.min.css')}}" id="app-style" rel="stylesheet" type="text/css" />
    @yield('theme_style')
</head>

JS Files Path: JS 文件路径:

<script src="{{url('libs/jquery/jquery.min.js')}}"></script>
<script src="{{url('libs/bootstrap/js/bootstrap.bundle.min.js')}}"></script>
<script src="{{url('libs/metismenu/metisMenu.min.js')}}"></script>
<script src="{{url('libs/simplebar/simplebar.min.js')}}"></script>
<script src="{{url('libs/node-waves/waves.min.js')}}"></script>

<!-- apexcharts -->
<script src="{{url('libs/apexcharts/apexcharts.min.js')}}"></script>

<script src="{{url('js/pages/dashboard.init.js')}}"></script>

<!-- App js -->
<script src="{{url('js/app.js')}}"></script>
@yield('theme_script')

The blade is loading but functionality related to some css and js is not working.刀片正在加载,但与某些 css 和 js 相关的功能无法正常工作。 All the files are linked correctly and loading in view page source.所有文件都正确链接并加载到视图页面源中。

Note: I also try 'npm run dev' to compile the files.注意:我也尝试使用“npm run dev”来编译文件。

I found a solution to this question, actually I was using url() helper function for linking css/js path.我找到了这个问题的解决方案,实际上我使用 url() 助手 function 来链接 css/js 路径。 I made two changes to my files:我对文件进行了两项更改:

1) I put all files in a folder as it was placed in a default html template.
2) I used URL::asset() OR asset() helper function to link my files.

After that i clear the cache and run the project.之后我清除缓存并运行项目。 It just worked.它刚刚奏效。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM