Mam pewne problemy z integracją SemanticUI w moim projekcie Laravel. Są to zarówno piękne frameworki, niestety nic nie można znaleźć na ten temat.Używanie SemanticUI do mojego projektu Laravel
Najpierw zainstalowałem semantyczną przy użyciu NPM: npm install semantic-ui
. Działa to dobrze, ale problemem jest to, że wiele innych pakietów NpM jest zainstalowanych. Również semantyczne statki z mnóstwem zadań, których nie potrzebuję. Laravel dostarcza Eliksirowi do definiowania podstawowych zadań Gulp, z których chcę korzystać.
Poszedłem do semantic github repo i pobrałem folder /src
. Skopiowałem folder do mojego projektu Laravel: /resources/assets/semantic/
. Następnie w ciągu app.less
plików sprowadziłam semantyczny:
/**
* Import the SemanticUI source
*/
@import '../semantic/src/semantic';
Więc następnym krokiem było pozwolić Elixer zrobić kompilowania i kopiowania do folderu /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');
});
ta działa rewelacyjnie. Jedyne, co mnie martwi to to, że aktualizowanie semantyczne musi być wykonywane ręcznie. Jeśli masz jakieś rady dla mnie lub alternatywnej aplikacji, chciałbym to usłyszeć. W ten sposób mój folder public/vendor
wygląda po uruchomieniu gulp
:
Teraz mam inny problem skierowana jest to, że kiedy spojrzeć na minified CSS, widzę, że ścieżki aktywów są źle:
src: url("../../themes/default/assets/fonts/icons.eot");
// and more wrong paths...
Należy szukać w themes/default/assets/fonts/icons.eot
. Jakieś pomysły?
Z góry dziękuję.
Trzeba zastąpić '@ zmiennej fontPath' ... Zobacz http://learnsemantic.com/developing/customizing.html#setting-global-variables. (Oczywiście, ponieważ przenosisz katalog 'themes' (w tym' assets'), a twój wynikowy CSS nie znajduje się na ścieżce przyjętej przez SUI, powinieneś powiedzieć do kodu SUI, gdzie jest nowa ścieżka). –