summaryrefslogtreecommitdiff
path: root/client/web
diff options
context:
space:
mode:
Diffstat (limited to 'client/web')
-rw-r--r--client/web/shared.webpack.config.js64
-rw-r--r--client/web/templates/index.ejs31
-rw-r--r--client/web/vendor.webpack.config.js56
-rw-r--r--client/web/webpack.config.js104
4 files changed, 255 insertions, 0 deletions
diff --git a/client/web/shared.webpack.config.js b/client/web/shared.webpack.config.js
new file mode 100644
index 0000000..81f7a6a
--- /dev/null
+++ b/client/web/shared.webpack.config.js
@@ -0,0 +1,64 @@
+// @flow
+/* eslint-disable import/no-extraneous-dependencies */
+const path = require('path')
+const webpack = require('webpack')
+const CompressionPlugin = require('compression-webpack-plugin')
+
+module.exports = {
+ productionPlugins: [
+ new webpack.optimize.AggressiveMergingPlugin(),
+ new webpack.optimize.UglifyJsPlugin({
+ mangle: true,
+ compress: {
+ warnings: false, // Suppress uglification warnings
+ pure_getters: true,
+ unsafe: true,
+ unsafe_comps: true,
+ screw_ie8: true,
+ },
+ output: {
+ comments: false,
+ },
+ sourceMap: false,
+ exclude: [/\.min\.js$/gi], // skip pre-minified libs
+ }),
+ new CompressionPlugin({
+ asset: '[path].gz[query]',
+ algorithm: 'zopfli',
+ test: /\.js$|\.css$|\.html$/,
+ threshold: 10240,
+ minRatio: 0.8,
+ }),
+ ],
+
+ loaders: [
+ {
+ test: /\.ttf$/,
+ loader: 'url-loader',
+ include: path.resolve(__dirname, '../node_modules/react-native-vector-icons'),
+ },
+ {
+ test: /\.json$/,
+ loader: 'json-loader',
+ },
+ {
+ // Many react-native libraries do not compile their ES6 JS.
+ test: /\.js$/,
+ include: /node_modules\/react-native-/,
+ // react-native-web is already compiled.
+ exclude: /node_modules\/react-native-web\//,
+ loader: 'babel-loader',
+ query: { cacheDirectory: true },
+ },
+ {
+ test: /\.(gif|jpe?g|png|svg)$/,
+ loader: 'url-loader',
+ query: { name: 'images/[name]-[hash:16].[ext]' },
+ },
+ {
+ test: /\.(mp3|wav)$/,
+ loader: 'file-loader',
+ query: { name: 'sounds/[name]-[hash:16].[ext]' },
+ },
+ ],
+}
diff --git a/client/web/templates/index.ejs b/client/web/templates/index.ejs
new file mode 100644
index 0000000..ec11dda
--- /dev/null
+++ b/client/web/templates/index.ejs
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html<% if (__OFFLINE__) { %> manifest="appcache/manifest.appcache"<% } %>>
+ <head>
+ <meta charset="utf-8">
+ <title>Hansel and Gretel</title>
+ <!-- <meta name="viewport" content="width=device-width, initial-scale=1.0"> -->
+ <meta name="viewport" content="width=device-width, initial-scale=0.9">
+<style>
+a {
+ width: 100%;
+ color: transparent;
+}
+body,html{
+ overflow: hidden;
+}
+.modal {
+ transition: all 400ms;
+}
+svg {
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ user-select: none;
+}
+</style>
+ </head>
+ <body>
+ <div id="react-root"></div>
+ </body>
+ <script src="http://www.youtube.com/iframe_api"></script>
+
+</html>
diff --git a/client/web/vendor.webpack.config.js b/client/web/vendor.webpack.config.js
new file mode 100644
index 0000000..d9cd190
--- /dev/null
+++ b/client/web/vendor.webpack.config.js
@@ -0,0 +1,56 @@
+// @flow
+/* eslint-disable import/no-extraneous-dependencies, global-require, import/no-dynamic-require */
+/* eslint-disable no-underscore-dangle */
+const __DEV__ = process.env.NODE_ENV === 'development'
+
+const path = require('path')
+const webpack = require('webpack')
+const config = require('./shared.webpack.config.js')
+
+// We need a separate build for dev, which is unminified and includes PropTypes.
+const outputPath = path.join(__dirname, __DEV__ ? 'vendor-dev' : 'vendor')
+const outputFilename = __DEV__ ? '[name].dll.js' : '[name]-[hash:16].dll.js'
+
+const plugins = [
+ new webpack.DefinePlugin({
+ 'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV),
+ __DEV__,
+ }),
+
+ ...(__DEV__ ? [] : config.productionPlugins),
+
+ new webpack.DllPlugin({
+ name: '[name]',
+ path: path.join(outputPath, '[name]-manifest.json'),
+ }),
+]
+
+module.exports = {
+ entry: {
+ // Put react-native-web / react dependencies in here.
+ 'react': [
+ 'react-native-web',
+ ],
+ // Put any other other core libs in here. (immutable, redux, localforage, etc.)
+ // 'core': [
+ // ],
+ },
+ output: {
+ filename: outputFilename,
+ path: outputPath,
+ library: '[name]',
+ },
+
+ module: {
+ noParse: /localforage\/dist\/localforage.js/,
+ loaders: config.loaders,
+ },
+
+ plugins,
+ resolve: {
+ alias: {
+ 'react-native': 'react-native-web',
+ },
+ extensions: ['.web.js', '.js', '.json'],
+ },
+}
diff --git a/client/web/webpack.config.js b/client/web/webpack.config.js
new file mode 100644
index 0000000..d9425c1
--- /dev/null
+++ b/client/web/webpack.config.js
@@ -0,0 +1,104 @@
+/* eslint-disable */
+const enableOfflinePlugin = false
+
+const __DEV__ = process.env.NODE_ENV === 'development'
+const __OFFLINE__ = enableOfflinePlugin && !__DEV__
+
+const path = require('path')
+const glob = require('glob')
+const webpack = require('webpack')
+const config = require('./shared.webpack.config.js')
+
+const HtmlWebpackPlugin = require('html-webpack-plugin')
+const AddAssetHtmlPlugin = require('add-asset-html-webpack-plugin')
+
+const CopyWebpackPlugin = require('copy-webpack-plugin')
+const OfflinePlugin = require('offline-plugin')
+
+const vendorConfig = require('./vendor.webpack.config.js')
+const outputPath = path.join(__dirname, '/build/')
+
+
+const addAssetHtmlFiles = Object.keys(vendorConfig.entry).map((name) => {
+ const fileGlob = `${name}*.dll.js`
+ const paths = glob.sync(path.join(vendorConfig.output.path, fileGlob))
+ if (paths.length === 0) throw new Error(`Could not find ${fileGlob}!`)
+ if (paths.length > 1) throw new Error(`Too many files for ${fileGlob}! You should clean and rebuild.`)
+ return {
+ filepath: require.resolve(paths[0]),
+ includeSourcemap: false,
+ outputPath: 'javascript/vendor',
+ publicPath: '/javascript/vendor',
+ }
+})
+
+const plugins = [
+ ...Object.keys(vendorConfig.entry).map(name =>
+ new webpack.DllReferencePlugin({
+ context: process.cwd(),
+ manifest: require(path.join(vendorConfig.output.path, `${name}-manifest.json`)),
+ })),
+
+ new webpack.DefinePlugin({
+ 'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV),
+ __DEV__,
+ __OFFLINE__,
+ }),
+ new HtmlWebpackPlugin({
+ filename: 'index.html',
+ template: 'web/templates/index.ejs',
+ }),
+ new AddAssetHtmlPlugin(addAssetHtmlFiles),
+
+ new CopyWebpackPlugin([
+ // Workaround for AddAssetHtmlPlugin not copying compressed .gz files
+ { context: 'web/vendor/', from: '*.js.gz', to: 'javascript/vendor/' },
+ ]),
+
+ // Split out any remaining node modules
+ new webpack.optimize.CommonsChunkPlugin({
+ name: 'vendor/lib',
+ minChunks: module => module.context && module.context.indexOf('node_modules/') !== -1,
+ }),
+
+ ...(__DEV__ ? [] : [
+ ...config.productionPlugins,
+
+ // Add any app-specific production plugins here.
+ ])
+]
+
+// If offline plugin is enabled, it has to come last.
+if (__OFFLINE__) plugins.push(new OfflinePlugin())
+
+module.exports = {
+ devServer: {
+ contentBase: outputPath,
+ },
+ entry: {
+ app: path.join(__dirname, '../index.web.js')
+ },
+ module: {
+ loaders: [
+ {
+ test: /\.js$/,
+ exclude: /node_modules/,
+ // TODO: Set up react-hot-loader during development.
+ loaders: [ 'babel-loader?cacheDirectory=true' ],
+ },
+ ...config.loaders,
+ ]
+ },
+ output: {
+ path: outputPath,
+ filename: 'javascript/[name]-[hash:16].js',
+ publicPath: '/'
+ },
+ plugins: plugins,
+ resolve: {
+ alias: {
+ 'react-native': 'react-native-web'
+ },
+ extensions: [".web.js", ".js", ".json"]
+ }
+};
generated by cgit v1.2.3-70-g09d2 (git 2.51.0) at 2025-12-10 15:45:50 +0000