2015-07-30 29 views
5

Sto riscontrando alcune difficoltà nell'integrare SemanticUI nel mio progetto Laravel. Questi sono entrambi bellissimi framework, purtroppo non c'è nulla da trovare su questo argomento.Utilizzo di SemanticUI per il mio progetto Laravel

Prima ho installato semantico utilizzando NPM: npm install semantic-ui. Funziona bene, ma il problema è che un sacco di altri pacchetti npm sono installati pure. Inoltre, le navi semantiche con un sacco di compiti di gulp di cui non ho bisogno. Laravel viene fornito con Elixer per la definizione delle attività di base di Gulp, che desidero utilizzare.

Sono passato allo semantic github repo e scaricato la cartella /src. Ho copiato la cartella nel mio progetto Laravel: /resources/assets/semantic/. Poi all'interno dei file app.less ho importato semantica:

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

Quindi il passo successivo è stato quello di lasciare che Elixer fare la compilazione e la copia nella cartella /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'); 

}); 

Questo funziona eccellente. L'unica cosa che mi preoccupa è che l'aggiornamento semantico deve essere fatto per mano. Se hai qualche consiglio per me o un candidato alternativo mi piacerebbe sentirlo. Ecco come il mio cartella public/vendor sembra dopo l'esecuzione gulp:

public/vendor

Ora l'altro problema che sto affrontando è che quando prendo uno sguardo al CSS minified, vedo che i percorsi di attività sono sbagliate:

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

Dovrebbe essere in cerca in themes/default/assets/fonts/icons.eot. Qualche idea?

Grazie in anticipo.

+1

È necessario sovrascrivere '@ variabile fontPath' ... Vedere http://learnsemantic.com/developing/customizing.html#setting-global-variables. (Ovviamente, dato che spostate la vostra directory 'themes' (incl 'assets') e il vostro CSS risultante non è nel percorso assunto dal SUI in ogni caso, dovrete dire al codice SUI dove si trova il nuovo percorso). –

risposta

3

Quando hanno chiesto che tipo di installazione mi piacerebbe avere, ho scelto Express (Set components and output folder).

Quindi, ho scelto [?] Where should we put Semantic UI inside your project? resources/assets/semantic/.

Scegli le opzioni per altre domande.

Poi, tipo ../../../public/semantic quando richiesto [?] Where should we output Semantic UI?