404 errors on LESS @import

[ambethoney]

hi,

i'm trying to pull in custom fonts for my project, but keep receiving a 404 error. (yes, my files are in the correct folder). i've also tried pulling in files via the LESS @import, and each of these files 404 as well(ex- fonts.less). I changed around the gulp styles task to include all folders and subfolders of /styles:

       gulp.task('styles', function () {
      return gulp.src('src/styles/**/*.less')
      ....}

without success. here's my working dir:

src
| -img
| -scripts
| -styles
     -app.less
     -fonts.less
     -fonts
          -font files are here

| -index

my @font-face:

@font-face {
   font-family: 'ostrich_sansmedium';
   src: url('ostrich-regular-webfont.eot');
   src: url('ostrich-regular-webfont.eot?#iefix') format('embedded-opentype'),
   url('ostrich-regular-webfont.woff2') format('woff2'),
   url('ostrich-regular-webfont.woff') format('woff'),
   url('ostrich-regular-webfont.ttf') format('truetype'),
   url('ostrich-regular-webfont.svg#ostrich_sansmedium') format('svg');
  font-weight: normal;
  font-style: normal;
 }

i've tried different variations of the url, including:

  url('fonts/ostrich-regular-webfont.svg#ostrich_sansmedium'),
 url('styles/fonts/ostrich-regular-webfont.svg#ostrich_sansmedium') 

etc. do you have any suggestions as to what could causing my files to 404?

[velveteer]

@ambethoney Hey sorry I just saw this issue now. If you're still having trouble I think the problem lies in the LESS compilation step. It concats everything down into .tmp/app.css which is then served by the connect server. There is no gulp task for copying fonts into .tmp which is unfortunate, but it wouldn't be difficult to add one. The problem here is definitely related to how assets are served in development.

I might get around to fixing this but no guarantees. I haven't touched Mithril in a while but I would prefer to redo this boilerplate with something like webpack instead of gulp tasks.