在我的Laravel项目中使用SemanticUI

Question

我在将SemanticUI集成到我的Laravel项目时遇到了一些困难.这些都是漂亮的框架,遗憾的是没有什么可以找到这个主题.

首先我使用NPM安装语义:npm install semantic-ui.这很好用,但问题是还安装了很多其他npm软件包.此外,语义也有许多我不需要的gulp任务.Laravel附带Elixer来定义基本的Gulp任务,我确实想要使用它.

我去了语义github repo并下载了/src文件夹.我将文件夹复制到我的Laravel项目中:/resources/assets/semantic/.然后在app.less我导入语义的文件中:

/**
* Import the SemanticUI source
*/
@import '../semantic/src/semantic';

所以下一步是让Elixer进行编译并复制到/public文件夹:

elixir(function(mix) {

    // Semantic LESS
    mix.less([
        'app.less'
    ], 'public/vendor/semantic/semantic.css');

    // Semantic JS
    mix.scriptsIn([
        'resources/assets/semantic/src/definitions/'
    ], 'public/vendor/semantic/semantic.js'); // js: resources/assets/semantic/src/definitions/{folder}/{script}.js

    // Semantic Themes
    mix.copy('resources/assets/semantic/src/themes', 'public/vendor/semantic/themes');

});

这很好用.我唯一关心的是更新语义必须由手完成.如果您对我有任何建议或其他approuch我很乐意听到.这是我的public/vendor文件夹运行后的样子gulp:

现在我面临的另一个问题是,当我看一下缩小的CSS时,我发现资产路径是错误的:

src: url("../../themes/default/assets/fonts/icons.eot");
// and more wrong paths...

它应该在寻找themes/default/assets/fonts/icons.eot.有任何想法吗？

提前致谢.

Answer 1

当他们问我想要什么样的安装时，我选择了Express (Set components and output folder)。

然后，我选择了[?] Where should we put Semantic UI inside your project? resources/assets/semantic/。

选择其他问题的选项。

然后，../../../public/semantic在出现提示时键入[?] Where should we output Semantic UI?