Switch to Laravel Mix.

app/setup.php

@@ -3,9 +3,9 @@
 namespace Aldine;
 
 use Roots\Sage\Container;
-use Roots\Sage\Assets\JsonManifest;
 use Roots\Sage\Template\Blade;
 use Roots\Sage\Template\BladeProvider;
+use PressbooksMix\Assets;
 
 /**
  * Theme assets

package.json

@@ -75,56 +75,31 @@
     }
   },
   "scripts": {
-    "build": "webpack --progress --config resources/assets/build/webpack.config.js",
-    "build:production": "webpack --progress -p --config resources/assets/build/webpack.config.js",
-    "build:profile": "webpack --progress --profile --json --config resources/assets/build/webpack.config.js",
-    "start": "webpack --hide-modules --watch --config resources/assets/build/webpack.config.js",
+    "build": "cross-env NODE_ENV=development webpack --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
+    "build:production": "cross-env NODE_ENV=production webpack --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
+    "build:profile": "cross-env NODE_ENV=production webpack --progress --profile --json --config=node_modules/laravel-mix/setup/webpack.config.js",
+    "start": "cross-env NODE_ENV=development webpack --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
     "rmdist": "rimraf dist",
     "lint": "npm run -s lint:scripts && npm run -s lint:styles",
-    "lint:scripts": "eslint resources/assets/scripts resources/assets/build",
-    "lint:styles": "stylelint 'resources/assets/styles/**/*.{css,sass,scss,sss,less}'",
+    "lint:scripts": "eslint \"resources/assets/scripts\"",
+    "lint:styles": "stylelint \"resources/assets/styles/**/*.scss\"",
     "test": "npm run -s lint"
   },
   "engines": {
     "node": ">= 6.9.4"
   },
   "devDependencies": {
-    "autoprefixer": "~7.1",
-    "browser-sync": "~2.18",
-    "browsersync-webpack-plugin": "^0.6.0",
-    "bs-html-injector": "~3.0",
-    "buble-loader": "^0.4.1",
-    "cache-loader": "~1.0",
-    "clean-webpack-plugin": "^0.1.16",
-    "copy-globs-webpack-plugin": "^0.2.0",
-    "css-loader": "^0.28.4",
-    "cssnano": "~4.0.0-rc.1",
+    "browser-sync": "^2.18.13",
+    "browser-sync-webpack-plugin": "^1.2.0",
     "eslint": "~4.2",
     "eslint-loader": "~1.9",
     "eslint-plugin-import": "~2.7",
     "extract-text-webpack-plugin": "~3.0",
-    "file-loader": "^0.11.2",
-    "friendly-errors-webpack-plugin": "^1.6.1",
-    "imagemin-mozjpeg": "~6.0",
-    "imagemin-webpack-plugin": "~1.5.0-beta.0",
-    "import-glob": "~1.5",
-    "node-sass": "~4.5",
-    "postcss-loader": "~2.0",
-    "postcss-safe-parser": "~3.0",
-    "resolve-url-loader": "~2.1",
+    "laravel-mix": "~1.4",
     "rimraf": "~2.6",
-    "sass-loader": "~6.0",
-    "style-loader": "^0.18.2",
     "stylelint": "~7.12",
     "stylelint-config-standard": "~16.0",
-    "stylelint-webpack-plugin": "^0.8.0",
-    "url-loader": "^0.5.9",
-    "webpack": "~3.3",
-    "webpack-assets-manifest": "^0.7.0",
-    "webpack-dev-middleware": "~1.11",
-    "webpack-hot-middleware": "~2.18",
-    "webpack-merge": "~4.1",
-    "yargs": "~8.0"
+    "stylelint-webpack-plugin": "^0.8.0"
   },
   "dependencies": {
     "jquery": "1.12.4 - 3",

resources/assets/styles/autoload/_tachyons.scss

@@ -1,4 +0,0 @@
-// `sage preset` installed this file automatically.
-// Running `sage preset` again could result in automatic deletion of this file.
-// Because of this, we do not recommend editing this file.
-@import "~tachyons-sass/tachyons";

resources/assets/styles/main.scss

@@ -1,14 +1,12 @@
 @import "common/variables";
 
-/** Import everything from autoload */
-@import "./autoload/**/*";
-
 /**
  * Import npm dependencies
  *
  * Prefix your imports with `~` to grab from node_modules/
  * @see https://github.com/webpack-contrib/sass-loader#imports
  */
+@import "~tachyons-sass/tachyons";
 @import "~slick-carousel/slick/slick";
 
 /** Import theme styles */

webpack.mix.js

@@ -0,0 +1,63 @@
+let mix = require('laravel-mix');
+
+/*
+ |--------------------------------------------------------------------------
+ | Mix Asset Management
+ |--------------------------------------------------------------------------
+ |
+ | Mix provides a clean, fluent API for defining some Webpack build steps
+ | for your Laravel application. By default, we are compiling the Sass
+ | file for your application, as well as bundling up your JS files.
+ |
+ */
+
+const app = 'app';
+const resources = 'resources';
+const assets = `${resources}/assets`;
+const dist = 'dist';
+
+mix.setPublicPath(dist);
+mix.setResourceRoot('../');
+
+// BrowserSync
+mix.browserSync({
+  host: 'localhost',
+  proxy: 'http://pressbooks.dev',
+  port: 3000,
+  files: [
+    `${app}/**/*.php`,
+    `${resources}/**/*.php`,
+    `${dist}/**/*.css`,
+    `${dist}/**/*.js`,
+  ],
+});
+
+// Sass
+mix.sass(`${assets}/styles/main.scss`, `${dist}/styles/main.css`);
+
+// Javascript
+mix.autoload({
+   jquery: ['$', 'window.jQuery', 'jQuery'],
+});
+
+mix.js(`${assets}/scripts/main.js`, `${dist}/scripts`)
+   .js(`${assets}/scripts/customizer.js`, `${dist}/scripts`);
+
+// Assets
+mix.copy(`${assets}/fonts`, `${dist}/fonts`, false)
+  .copy(`${assets}/images`, `${dist}/images`, false);
+
+// Options
+mix.options({
+  processCssUrls: false,
+});
+
+// Source maps when not in production.
+if (!mix.inProduction()) {
+  mix.sourceMaps();
+}
+
+// Hash and version files in production.
+if (mix.inProduction()) {
+  mix.version();
+}