在GULP中字体很棒

时间:2017-05-21 20:51:54

标签: sass gulp font-awesome

我遇到了font-awesome(节点)的问题:

Error: Cannot find module 'font-awesome'
      at Function.Module._resolveFilename (module.js:469:15)
      at Function.Module._load (module.js:417:25)
      at Module.require (module.js:497:17)
      at require (internal/module.js:20:19)
      at Object.<anonymous> 
    (C:\Users\bella\desktop\finverity\gulpfile.js:17:22)
      at Module._compile (module.js:570:32)
      at Object.Module._extensions..js (module.js:579:10)
      at Module.load (module.js:487:32)
      at tryModuleLoad (module.js:446:12)
     at Function.Module._load (module.js:438:3)

我的gulp文件包含:

var gulp         = require('gulp');
var sass         = require ('gulp-sass');
var browserSync  = require('browser-sync');
var reload       = browserSync.reload;
var autoprefixer = require('gulp-autoprefixer');
var browserify   = require('gulp-browserify');
var clean        = require('gulp-clean');
var concat       = require('gulp-concat');
var merge        = require ('merge-stream');
var newer        = require('gulp-newer');
var imagemin     = require('gulp-imagemin');
var injectPartials = require('gulp-inject-partials');
var minify         = require('gulp-minify');
var rename         = require ('gulp-rename');
var cssmin         = require('gulp-cssmin');
var htmlmin        = require('gulp-htmlmin');
var fontAwesome    = require('font-awesome')

任务本身

    var APPPATH = {
 root:  'app/',
 css:   'app/css',
 js:    'app/js',
 fonts: 'app/fonts',
 img:   'app/img'

}

gulp.task('iconFonts', function(){
    return gulp.src('.node_modules/font-awesome/**.
{eot,svg,ttf,woff,woff2}')
    .pipe(gulp.dest(APPPATH.fonts))
})

并观看

gulp.task ('watch', ['serve', 'sass', 'clean-html', 'clean
scripts','scripts', 'moveFonts', 'images', 'html', 'iconFonts'], 
function(){

gulp.watch([SOURCEPATH.sassSource], ['sass']);
//gulp.watch([SOURCEPATH.htmlSource], ['copy']);
gulp.watch([SOURCEPATH.jsSource], ['scripts']);
gulp.watch([SOURCEPATH.htmlSource, SOURCEPATH.htmlPartialSource], 
['html']);
})

gulp.task('default', ['watch']);

gulp.task('production', ['minifyHtml', 'compresscss', 'compress'])

Main.scss包含:

$fa-font-path:"../node_modules/font-awesome/fonts";
   @import "./node_modules/font-awesome/scss/font-awesome";
   .icon-user {
   @extend .fa;
   @extend .fa-user;
}

我做错了什么?是否有任何源代码可以解释如何正确呈现它,或者我应该使用另一个图标库?

0 个答案:

没有答案