load fonts from node modules, include fonts in UI bundle, rewrite font path

diff --git a/package.json b/package.json
index 722a482..13c29bb 100644 (file)
--- a/package.json
+++ b/package.json
@@ -40,6 +40,7 @@
     "postcss-calc": "^6.0.0",
     "postcss-custom-properties": "^6.1.0",
     "postcss-import": "^11.0.0",
+    "postcss-url": "^7.1.2",
     "prettier-eslint": "^8.2.0",
     "require-from-string": "^2.0.1",
     "stylelint": "^8.2.0",

diff --git a/tasks/build.js b/tasks/build.js
index b63fc22..c778b9e 100644 (file)
--- a/tasks/build.js
+++ b/tasks/build.js
@@ -5,30 +5,50 @@ const browserify = require('browserify')
 const buffer = require('vinyl-buffer')
 const concat = require('gulp-concat')
 const cssnano = require('cssnano')
+const fs = require('fs')
 const imagemin = require('gulp-imagemin')
 const merge = require('merge-stream')
+const mkdirp = require('mkdirp')
+const path = require('path')
 const postcss = require('gulp-postcss')
 const postcssCalc = require('postcss-calc')
 const postcssImport = require('postcss-import')
+const postcssUrl = require('postcss-url')
 const postcssVar = require('postcss-custom-properties')
 const tap = require('gulp-tap')
 const uglify = require('gulp-uglify')
 const vfs = require('vinyl-fs')
 
-const postcssPlugins = [
-  postcssImport(),
-  postcssVar(),
-  postcssCalc(),
-  autoprefixer({ browsers: ['last 2 versions'] }),
-  cssnano({ preset: 'default' }),
-]
-
 module.exports = (src, dest) => {
   const opts = { base: src, cwd: src }
+  const postcssPlugins = [
+    postcssImport(),
+    postcssUrl([
+      {
+        filter: '**/~typeface-*/files/*',
+        url: (asset) => {
+          const relpath = asset.pathname.substr(1)
+          const abspath = path.resolve('node_modules', relpath)
+          const basename = path.basename(abspath)
+          const destpath = path.join(dest, 'font', basename)
+          if (!fs.existsSync(destpath)) {
+            const dirname = path.dirname(destpath)
+            if (!fs.existsSync(dirname)) {
+              mkdirp.sync(dirname)
+            }
+            fs.copyFileSync(abspath, destpath)
+          }
+          return path.join('..', 'font', basename)
+        },
+      },
+    ]),
+    postcssVar(),
+    postcssCalc(),
+    autoprefixer({ browsers: ['last 2 versions'] }),
+    cssnano({ preset: 'default' }),
+  ]
 
   return merge([
-    vfs.src('img/**/*.{jpg,png,svg}', opts).pipe(imagemin()),
-
     vfs
       .src('js/+([0-9])-*.js', opts)
       .pipe(uglify())
@@ -44,10 +64,12 @@ module.exports = (src, dest) => {
       .pipe(buffer())
       .pipe(uglify()),
 
-    vfs.src('fonts/*.woff*(2)', opts),
-
     vfs.src('css/site.css', opts).pipe(postcss(postcssPlugins)),
 
+    vfs.src('font/*.woff*(2)', opts),
+
+    vfs.src('img/**/*.{jpg,png,svg}', opts).pipe(imagemin()),
+
     vfs.src('helpers/*.js', opts),
 
     vfs.src('layouts/*.hbs', opts),

diff --git a/yarn.lock b/yarn.lock
index 214c422..98387a4 100644 (file)
--- a/yarn.lock
+++ b/yarn.lock
@@ -1182,6 +1182,10 @@ csso@~2.3.1:
     clap "^1.0.9"
     source-map "^0.5.3"
 
+cuint@latest:
+  version "0.2.2"
+  resolved "https://registry.yarnpkg.com/cuint/-/cuint-0.2.2.tgz#408086d409550c2631155619e9fa7bcadc3b991b"
+
 currently-unhandled@^0.4.1:
   version "0.4.1"
   resolved "https://registry.yarnpkg.com/currently-unhandled/-/currently-unhandled-0.4.1.tgz#988df33feab191ef799a61369dd76c17adf957ea"
@@ -3621,6 +3625,10 @@ mime@1.3.4:
   version "2.0.3"
   resolved "https://registry.yarnpkg.com/mime/-/mime-2.0.3.tgz#4353337854747c48ea498330dc034f9f4bbbcc0b"
 
+mime@^1.2.11:
+  version "1.4.1"
+  resolved "https://registry.yarnpkg.com/mime/-/mime-1.4.1.tgz#121f9ebc49e3766f311a76e1fa1c8003c4b03aa6"
+
 mimic-fn@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/mimic-fn/-/mimic-fn-1.1.0.tgz#e667783d92e89dbd342818b5230b9d62a672ad18"
@@ -4487,6 +4495,16 @@ postcss-unique-selectors@^2.0.2:
     postcss "^5.0.4"
     uniqs "^2.0.0"
 
+postcss-url@^7.1.2:
+  version "7.1.2"
+  resolved "https://registry.yarnpkg.com/postcss-url/-/postcss-url-7.1.2.tgz#e04ae386af7ea6ef5df51c5b449d6b9502cd99b2"
+  dependencies:
+    mime "^1.2.11"
+    minimatch "^3.0.0"
+    mkdirp "^0.5.0"
+    postcss "^6.0.1"
+    xxhashjs "^0.2.1"
+
 postcss-value-parser@^3.0.1, postcss-value-parser@^3.0.2, postcss-value-parser@^3.1.1, postcss-value-parser@^3.1.2, postcss-value-parser@^3.2.3, postcss-value-parser@^3.3.0:
   version "3.3.0"
   resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-3.3.0.tgz#87f38f9f18f774a4ab4c8a232f5c5ce8872a9d15"
@@ -6067,6 +6085,12 @@ xmlhttprequest-ssl@1.5.3:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/xtend/-/xtend-4.0.1.tgz#a5c6d532be656e23db820efb943a1f04998d63af"
 
+xxhashjs@^0.2.1:
+  version "0.2.1"
+  resolved "https://registry.yarnpkg.com/xxhashjs/-/xxhashjs-0.2.1.tgz#9bbe9be896142976dfa34c061b2d068c43d30de0"
+  dependencies:
+    cuint latest
+
 y18n@^3.2.0, y18n@^3.2.1:
   version "3.2.1"
   resolved "https://registry.yarnpkg.com/y18n/-/y18n-3.2.1.tgz#6d15fba884c08679c0d77e88e7759e811e07fa41"