Skip to content

Instantly share code, notes, and snippets.

@Cobertos
Created November 24, 2018 22:52
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Cobertos/99dbaeab06e0f9daaac01bf5552f2d52 to your computer and use it in GitHub Desktop.
Save Cobertos/99dbaeab06e0f9daaac01bf5552f2d52 to your computer and use it in GitHub Desktop.
https://chemisto.ree.space gulpfile.js relevant parts
const gulp = require("gulp");
const webpack = require('webpack');
const WebpackMessages = require('webpack-messages');
const gulpWebpack = require('webpack-stream');
const merge = require('webpack-merge');
const SRC_DIR = "src"; //Source directory
const DIST_DIR = "dist"; //Distribution directory
const TEST_DIR = "test"; //Directory the tests live in
//...
const webpackOpts = (which)=>{
let base = {
mode : "development",
context : path.resolve(__dirname, "./" + SRC_DIR + "/js"),
entry : {
main: "./main.js",
OimoWorker: "./engine/OIMOWorker.js"
},
output : {
//path : //handled by gulp
filename : "[name].js",
library : "burstGame",
libraryTarget : "umd",
//https://github.com/webpack/webpack/issues/6525
//Until webpack implements a solution that solves all their
//corner cases, this will work in NodeJS, Browser, and Webworkers
//for us!
globalObject: "typeof self !== 'undefined' ? self : this"
},
//Alias that allows us to use three/examples/js files
//without installing another npm package or whatever...
//Also needs the imports-loader thing mentioned farther down
//Use like require("three-examples/loaders/ObjLoader2"); or whatever
resolve: {
alias : {
"three-examples" : "three/examples/js"
}
},
module : {
rules : [{
test: /buildInfo\.json$/,
use: {
loader: path.resolve(__dirname, 'substitute-loader.js'),
options: substituteLoaderOptions
}
}, {
test : /\.html$/,
loader : "html-loader"
}, {
test : /\.(js|json)$/,
exclude : /(node_modules|bower_components|LoaderSupport|OBJLoader2)/,
use: [{
loader: 'babel-loader',
options: {
presets: [
['env', {
"targets": {
"browsers": [
"last 2 versions",
"IE >= 9"
]
}
}],
],
plugins: [
['transform-runtime', {
"regenerator": true,
}]
],
cacheDirectory : true
}
}, {
loader: 'ifdef-loader',
options: {
//OVERRIDEN IN CHILD
BROWSER: false,
NODEJS: false
}
}]
}, {
//This will add the THREE object to all three examples files (and some extra custom ones we made)
test : /(three[\\\/]examples[\\\/]js|(OBJLoader2|LoaderSupport)\.js$)/,
loader : "imports-loader?THREE=three"
}]
},
devtool: "source-map",
plugins: [
new webpack.IgnorePlugin(/worker_threads/),
//Optimize moment by not loading any extra locales
new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
//Show webpack stats messages (TODO: Make our own _cool_ one)
new WebpackMessages({
name: which,
logger: str => console.log(`| ${str}`)
})
]
};
const isServer = which === "SERVER";
const isClient = which === "CLIENT";
const isTest = which === "TEST";
if(isServer) {
base = merge(base, {
entry: {
server: base.entry.main
}
});
delete base.entry.main; //Don't generate main
base.module.rules[2].use[1].options.NODEJS = true;
return base;
}
else if(isClient){
base.module.rules[2].use[1].options.BROWSER = true;
return base;
}
else if(isTest){
base.context = path.resolve(__dirname, TEST_DIR);
base.entry = {
test: "./main.js"
};
base.module.rules[2].use[1].options.NODEJS = true;
return base;
}
throw new Error("Invalid webpack config param " + which);
}
//...
gulp.task("jsBrowser", gulp.series("buildInfo", ()=>{
return gulp.src("./")
.pipe(gulpWebpack( webpackOpts("CLIENT"), webpack ))
.pipe(gulp.dest( DIST_DIR + "/js" ));
}));
gulp.task("jsServer", gulp.series("buildInfo", ()=>{
return gulp.src("./")
.pipe(gulpWebpack( webpackOpts("SERVER"), webpack ))
.pipe(gulp.dest( DIST_DIR + "/server" ));
}));
//...
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment