Add: Fractalを追加

Gulpに組み込んで動作するところまで確認した。 #258
manabuyasuda · Jul 12, 2019 · 24e3470 · 24e3470
1 parent d6b5e53
commit 24e3470
Show file tree

Hide file tree

Showing 66 changed files with 43,167 additions and 760 deletions.
diff --git a/gulpfile.js b/gulpfile.js
@@ -33,7 +33,28 @@ const imageminPngquant = require('imagemin-pngquant');
 const gulpSvgSprite = require('gulp-svg-sprite');
 
 // Styleguide
-const aigis = require('gulp-aigis');
+const fractal = require('@frctl/fractal').create();
+
+fractal.set('project.title', 'Styleguide');
+fractal.components.set('path', './src/styleguide/components');
+fractal.docs.set('path', './src/styleguide/docs');
+fractal.web.set('builder.dest', './htdocs/styleguide');
+fractal.web.set('server.sync', true);
+fractal.web.set('server.watch', true);
+fractal.web.set('server.syncOptions', {
+  open: true,
+  notify: true,
+});
+
+const mandelbrot = require('@frctl/mandelbrot');
+
+const myCustomisedTheme = mandelbrot({
+  panels: ['html', 'notes', 'info', 'view', 'context', 'resources'],
+  lang: 'ja',
+  skin: 'olive',
+});
+fractal.web.theme(myCustomisedTheme);
+const logger = fractal.cli.console;
 
 // Utility
 const cache = require('gulp-cached');
@@ -54,7 +75,7 @@ const src = {
   ssi: 'static/**/*.html',
   data: 'src/_data/',
   css: 'src/**/*.scss',
-  styleguideWatch: ['src/**/*.scss', 'src/**/*.md'],
+  styleguideWatch: 'src/**/*.{scss,md,hbs,json}',
   js: './src/assets/js/site.js',
   jsWatch: 'src/**/*.{js,vue}',
   image: 'src/assets/img/**/*.{png,jpg,gif,svg}',
@@ -332,10 +353,18 @@ function svgSprite() {
 
 /**
  * スタイルガイドを生成します。
- * aigisは開発が止まっているので、別のスタイルガイドジェネレーターを検討してください。
  */
 function styleguide() {
-  return gulp.src('./aigis/aigis_config.yml').pipe(aigis());
+  const builder = fractal.web.builder();
+  builder.on('progress', function(completed, total) {
+    logger.update(`Outputting ${completed} of ${total} …`, 'info');
+  });
+  builder.on('error', function() {
+    logger.error(err.message);
+  });
+  return builder.build().then(function() {
+    logger.success('Styleguide is complete.');
+  });
 }
 
 /**

diff --git a/htdocs/styleguide/assets.html b/htdocs/styleguide/assets.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="refresh" content="0;url=index.html">
+    <title>Redirecting&hellip;</title>
+</head>
+<body>
+
+<p>Redirecting to / &hellip;</p>
+
+</body>
+</html>
diff --git a/htdocs/styleguide/components.html b/htdocs/styleguide/components.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="refresh" content="0;url=index.html">
+    <title>Redirecting&hellip;</title>
+</head>
+<body>
+
+<p>Redirecting to / &hellip;</p>
+
+</body>
+</html>