Fonts not moving to dist folder on build

[jamilalisgandarov]

None of the fonts are moving from app/fonts to dist/fonts properly. Not even fonts from bower-components. Here is the task from gulpfile.js. I have not changed anything that webapp has included. gulp.task('fonts', () => { return gulp.src(require('main-bower-files')('**/*.{eot,svg,ttf,woff,woff2}', function (err) {}) .concat('app/fonts/**/*')) .pipe($.if(dev, gulp.dest('.tmp/fonts'), gulp.dest('dist/fonts'))); });

[akshayvinchurkar1]

your gulp task is fine. any errors in the build process?

[jamilalisgandarov]

Nope, no errors.

[IniterWorker]

Create a new task with unset boolean dev mode

gulp.task('dev-false', () => {
  dev = false;
});

Add a new task in the order of the build task

gulp.task('build', ['dev-false', 'lint', 'html', 'images', 'fonts', 'extras'], () => {
  return gulp.src('dist/**/*').pipe($.size({title: 'build', gzip: true}));
 });

[CesarDenis]

In my case are the fonts from the bower-components. I'm using shim repository for Font Awesome not moving to dist or .tmp folder.

[IniterWorker]

I read an comment in this case. Because, Awesome and Bootstrap don't give correctly the font directory path in the configuration of the main-bower-files. @CesarDenis

I try with bootstrap-sass and awesome, no problem.

"dependencies": {
    "bootstrap-sass": "~3.3.5",
    "font-awesome": "fontawesome#^4.7.0",
  }

[CesarDenis]

@IniterWorker I tried and had the same problem.

"dependencies": {
    "bootstrap": "~4.0.0-alpha.6",
    "font-awesome": "fontawesome#^4.7.0"
}

• node: v6.11.0
• bower: v1.8.0
• gulp: v3.9.1

[IniterWorker]

@CesarDenis. My mistake.

The issue of copying is really solved. But my exemple use bootstrap-sass. The fontawesome tricked me with CDN in my app. She don't work. I'll try to explain why.

The main-bower-file return

{"output": [ "/home/bonett_w/Documents/Jy/bower_components/jquery/dist/jquery.js",
  "/my-app/bower_components/font-awesome/less/font-awesome.less",
  "/my-app/bower_components/font-awesome/scss/font-awesome.scss",
  "/my-app/bower_components/jquery-ui/jquery-ui.js",
  "/my-app/bower_components/bootstrap-sass/assets/stylesheets/_bootstrap.scss",
  "/my-app/bower_components/bootstrap-sass/assets/fonts/bootstrap/glyphicons-halflings-regular.eot",
  "/my-app/bower_components/bootstrap-sass/assets/fonts/bootstrap/glyphicons-halflings-regular.svg",
  "/my-app/bower_components/bootstrap-sass/assets/fonts/bootstrap/glyphicons-halflings-regular.ttf",
  "/my-app/bower_components/bootstrap-sass/assets/fonts/bootstrap/glyphicons-halflings-regular.woff",
  "/my-app/bower_components/bootstrap-sass/assets/fonts/bootstrap/glyphicons-halflings-regular.woff2",
  "/my-app/bower_components/bootstrap-sass/assets/javascripts/bootstrap.js" ]}

He found this with the help of the main bower.json file of the projet "my-app".

{
"overrides": {
    "bootstrap-sass": {
      "main": [
        "assets/stylesheets/_bootstrap.scss",
        "assets/fonts/bootstrap/*",
        "assets/javascripts/bootstrap.js"
      ]
    }
  }
}

I'm sorry for my first bad explanation. It's my first time with "main-bower-files".

The main problematic is the bad relationship with the "main" section of the dependencies "plugin/bower.json".

Override the main section "font-awesome":

{
"overrides": {
    "bootstrap-sass": {
      "main": [
        "assets/stylesheets/_bootstrap.scss",
        "assets/fonts/bootstrap/*",
        "assets/javascripts/bootstrap.js"
      ]
    },
    "font-awesome": {
      "main": [
        "less/font-awesome.less",
        "scss/font-awesome.scss",
        "fonts/*"
      ]
    }
  }
}

or in the "bower_components/font-awesome/.bower.json" :

  "main": [
    "less/font-awesome.less",
    "scss/font-awesome.scss",
    "fonts/*"
  ],

[CesarDenis]

@IniterWorker now works.

Tks.

[jamilalisgandarov]

Thanks 👍