【问题标题】:Semantic UI integration in laravel 5.6laravel 5.6 中的语义 UI 集成
【发布时间】:2019-02-09 02:22:29
【问题描述】:

在我陈述我的问题之前,我已经完成了以下操作:

我已按照Getting started 中所述的所有内容,并在我的 laravel 项目中安装了该框架。我还参考了答案here 并在stackoverflow 上进行了快速搜索,但找不到解决方案。

现在的问题是我不能在我的页面中包含 semantic.min.css 和 semantic.min.js,因为找不到它。我需要有人帮助我正确说明在我的 5.6 laravel 项目中使用语义 ui。

到目前为止,这是我的 HTML 代码:

    <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Gym Management</title>
    <link rel="stylesheet" type="text/css" href="{{ asset("semantic/dist/semantic.min.css") }}">
    <link rel="stylesheet" href="../css/style.css">
    <script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
    <script src="{{ asset("semantic/dist/semantic.min.js") }}"></script>

</head>
<body>
<div class="ui container">
HELLO
</div>

webpack.mix.js

let mix = require('laravel-mix');

/*
 |--------------------------------------------------------------------------
 | Mix Asset Management
 |--------------------------------------------------------------------------
 |
 | Mix provides a clean, fluent API for defining some Webpack build steps
 | for your Laravel application. By default, we are compiling the Sass
 | file for the application as well as bundling up all the JS files.
 |
 */

mix.js('resources/assets/js/app.js', 'public/js')
   .sass('resources/assets/sass/app.scss', 'public/css')
   .copy('node_modules/semantic-ui-css/semantic.min.css','public/css/semantic.min.css')
   .copy('node_modules/semantic-ui-css/semantic.min.js','public/js/semantic.min.js');

我检查页面时的快照。

【问题讨论】:

    标签: laravel http-status-code-404 semantic-ui laravel-5.6


    【解决方案1】:

    大多数情况下,由于路径错误,我收到此错误。仔细检查你的路径两次。包含 js 和 css 文件的“语义”文件夹必须位于 public 文件夹中。

    【讨论】:

    • 我需要找到一种公开链接css文件的方法。如果没有语义 UI 的其他相关文件,我不能只是将它们公之于众。
    猜你喜欢
    • 2018-08-28
    • 2019-04-24
    • 2018-11-23
    • 2018-12-10
    • 1970-01-01
    • 2018-01-29
    • 1970-01-01
    • 2019-02-02
    • 1970-01-01
    相关资源
    最近更新 更多