Ne pas ajouter de la police impressionnant de ressources pour aurelia.json - vous aurez besoin des fichiers de police, qui Aurelia ne pas le traiter. Au lieu de cela, prendre les mesures suivantes.
Tout d'abord, si vous avez ajouté quelque chose pour font-awesome déjà à votre aurelia.json le fichier, supprimez-le de nouveau.
Ajouter un nouveau fichier prepare-font-awesome.js dans le dossier \aurelia_project\tasks et insérez le code ci-dessous. Il copie de la police impressionnant de fichiers de ressources pour le dossier de sortie (comme configuré aurelia.json le fichier config; par exemple, scripts):
import gulp from 'gulp';
import merge from 'merge-stream';
import changedInPlace from 'gulp-changed-in-place';
import project from '../aurelia.json';
export default function prepareFontAwesome() {
const source = 'node_modules/font-awesome';
const taskCss = gulp.src(`${source}/css/font-awesome.min.css`)
.pipe(changedInPlace({ firstPass: true }))
.pipe(gulp.dest(`${project.platform.output}/css`));
const taskFonts = gulp.src(`${source}/fonts/*`)
.pipe(changedInPlace({ firstPass: true }))
.pipe(gulp.dest(`${project.platform.output}/fonts`));
return merge(taskCss, taskFonts);
}
Ouvrez l' build.js le fichier dans l' \aurelia_project\tasks le dossier et insérer les deux lignes suivantes; cela permettra d'importer la nouvelle fonction et de l'exécuter:
import prepareFontAwesome from './prepare-font-awesome'; // Our custom task
export default gulp.series(
readProjectConfiguration,
gulp.parallel(
transpile,
processMarkup,
processCSS,
prepareFontAwesome // Our custom task
),
writeBundles
);
Enfin, dans l' <head> section de votre index.html le fichier, il suffit d'ajouter la ligne suivante:
<link rel="stylesheet" href="scripts/css/font-awesome.min.css">
C'est tout; maintenant, vous pouvez utiliser font-awesome icônes dans toute Aurelia affichage de modules (fichiers html).
Notez que cela fonctionne pour n'importe quel complexe troisième partie de la bibliothèque qui nécessite des ressources qui vous devez inclure manuellement.
