Basic setup - gulp + webpack + hugo

author: Mathias Biilmann Christensen <info@mathias-biilmann.net> 2016-07-03 15:07:47 -0700
committer: Mathias Biilmann Christensen <info@mathias-biilmann.net> 2016-07-03 15:07:47 -0700
commit: 8f6c70c51bf7e9e2045ae13c4052156877e77648 (patch)
tree: d17454781e9cf316e76721c08397ed5fe772d125
13 files changed, 162 insertions, 0 deletions
diff --git a/.babelrc b/.babelrc
new file mode 100644
index 0000000..c13c5f6
--- /dev/null
+++ b/.babelrc
@@ -0,0 +1,3 @@
+{
+  "presets": ["es2015"]
+}
diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..b947077
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,2 @@
+node_modules/
+dist/
diff --git a/gulpfile.babel.js b/gulpfile.babel.js
new file mode 100644
index 0000000..5de71c9
--- /dev/null
+++ b/gulpfile.babel.js
@@ -0,0 +1,54 @@
+import gulp from 'gulp';
+import babel from 'gulp-babel';
+import cp from 'child_process';
+import gutil from 'gulp-util';
+import webpack from 'webpack';
+import webpackConfig from './webpack.conf';
+import WebpackDevServer from 'webpack-dev-server';
+
+
+gulp.task('hugo', (cb) => {
+  const args = ['-d', '../dist', '-s', 'site'];
+  return cp.spawn('hugo', args, {stdio: 'inherit'}).on('close', cb);
+});
+
+gulp.task('webpack', (cb) => {
+  const myConfig = Object.assign({}, webpackConfig);
+
+  // run webpack
+  webpack(myConfig, (err, stats) => {
+    if (err) throw new gutil.PluginError('webpack', err);
+    gutil.log('[webpack]', stats.toString({
+      colors: true,
+      progress: true
+    }));
+    cb();
+  });
+});
+
+gulp.task('build', ['webpack', 'hugo']);
+
+gulp.task('server', ['build'], (cb) => {
+  gulp.watch('site/**', ['hugo']);
+
+  const myConfig = Object.assign({}, webpackConfig);
+	myConfig.devtool = 'cheap-module-eval-source-map';
+	myConfig.debug = true;
+
+  for (const key in myConfig.entry) {
+    myConfig.entry[key].unshift("webpack-dev-server/client?http://localhost:3009/");
+  }
+
+  // Start a webpack-dev-server
+	new WebpackDevServer(webpack(myConfig), {
+    contentBase: './dist',
+    publicPath: 'http://localhost:3009/',
+		stats: {
+			colors: true
+		},
+		hot: false
+	}).listen(3009, 'localhost', function(err) {
+		if(err) throw new gutil.PluginError('webpack-dev-server', err);
+		gutil.log('[webpack-dev-server]', 'http://localhost:3009/');
+	});
+});
diff --git a/package.json b/package.json
new file mode 100644
index 0000000..29ddccd
--- /dev/null
+++ b/package.json
@@ -0,0 +1,33 @@
+{
+  "name": "hugo-gulp-boilerplate",
+  "version": "1.0.0",
+  "description": "Boilerplate for using hugo with gulp",
+  "main": "index.js",
+  "scripts": {
+    "hugo": "gulp hugo",
+    "webpack": "gulp webpack",
+    "build": "gulp build",
+    "start": "gulp server"
+  },
+  "author": "",
+  "license": "MIT",
+  "dependencies": {
+    "autoprefixer": "^6.3.7",
+    "babel-loader": "^6.2.4",
+    "babel-plugin-transform-class-properties": "^6.10.2",
+    "babel-plugin-transform-object-assign": "^6.8.0",
+    "babel-plugin-transform-object-rest-spread": "^6.8.0",
+    "babel-preset-es2015": "^6.9.0",
+    "css-loader": "^0.23.1",
+    "file-loader": "^0.9.0",
+    "gulp": "^3.9.1",
+    "gulp-babel": "^6.1.2",
+    "postcss-cssnext": "^2.7.0",
+    "postcss-loader": "^0.9.1",
+    "style-loader": "^0.13.1",
+    "url-loader": "^0.5.7",
+    "webpack": "^1.13.1",
+    "webpack-dev-server": "^1.14.1",
+    "whatwg-fetch": "^1.0.0"
+  }
+}
diff --git a/site/archetypes/.keep b/site/archetypes/.keep
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/site/archetypes/.keep
diff --git a/site/config.toml b/site/config.toml
new file mode 100644
index 0000000..149e86a
--- /dev/null
+++ b/site/config.toml
@@ -0,0 +1,3 @@
+baseurl = "/"
+languageCode = "en-us"
+title = "My New Hugo Site"
diff --git a/site/content/.keep b/site/content/.keep
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/site/content/.keep
diff --git a/site/data/.keep b/site/data/.keep
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/site/data/.keep
diff --git a/site/layouts/index.html b/site/layouts/index.html
new file mode 100644
index 0000000..ae10e35
--- /dev/null
+++ b/site/layouts/index.html
@@ -0,0 +1,12 @@
+<!doctype html>
+<html>
+  <head>
+    <title>Hugo with Gulp and Webpack</title>
+    <link rel="stylesheet" href="/main.css"/>
+  </head>
+  <body>
+    <h1>Hugo with Gulp and Webpack</h1>
+
+    <script src="/app.js"></script>
+  </body>
+</html>
diff --git a/site/static/.keep b/site/static/.keep
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/site/static/.keep
diff --git a/src/css/main.css b/src/css/main.css
new file mode 100644
index 0000000..74d7658
--- /dev/null
+++ b/src/css/main.css
@@ -0,0 +1,3 @@
+body {
+  font-size: 16px;
+}
diff --git a/src/js/app.js b/src/js/app.js
new file mode 100644
index 0000000..1374e08
--- /dev/null
+++ b/src/js/app.js
@@ -0,0 +1,3 @@
+import "../css/main.css";
+
+// JS here
diff --git a/webpack.conf.js b/webpack.conf.js
new file mode 100644
index 0000000..a0e014b
--- /dev/null
+++ b/webpack.conf.js
@@ -0,0 +1,49 @@
+import webpack from 'webpack';
+import path from 'path';
+
+export default {
+  module: {
+    loaders: [
+      {
+        test: /\.((png)|(eot)|(woff)|(woff2)|(ttf)|(svg)|(gif))(\?v=\d+\.\d+\.\d+)?$/,
+        loader: 'file?name=/[hash].[ext]'
+      },
+      { test: /\.json$/, loader: 'json-loader' },
+      {
+        test: /\.css$/,
+        loader: 'style!css?modules!postcss'
+      },
+      {
+        loader: 'babel',
+        test: /\.js?$/,
+        exclude: /node_modules/,
+        query: {
+          cacheDirectory: true,
+          presets: ['react', 'es2015'],
+          plugins: ['transform-class-properties', 'transform-object-assign', 'transform-object-rest-spread']
+        }
+      }
+    ]
+  },
+
+  postcss: [
+    require('postcss-cssnext')
+  ],
+
+  plugins: [
+    new webpack.ProvidePlugin({
+      'fetch': 'imports?this=>global!exports?global.fetch!whatwg-fetch'
+    })
+  ],
+
+  context: path.join(__dirname, 'src'),
+  entry: {
+    app: ['./js/app'],
+  },
+  output: {
+    path: path.join(__dirname, 'dist'),
+    publicPath: '/',
+    filename: '[name].js'
+  },
+  externals:  [/^vendor\/.+\.js$/]
+};
author	Mathias Biilmann Christensen <info@mathias-biilmann.net>	2016-07-03 15:07:47 -0700
committer	Mathias Biilmann Christensen <info@mathias-biilmann.net>	2016-07-03 15:07:47 -0700
commit	8f6c70c51bf7e9e2045ae13c4052156877e77648 (patch)
tree	d17454781e9cf316e76721c08397ed5fe772d125