From e37284f835fae44242c9e76460a3b24a74b0019f Mon Sep 17 00:00:00 2001 From: Ahmed El Gabri Date: Sat, 27 Aug 2016 14:37:58 +0200 Subject: [PATCH 01/13] Remove ranges & cleanup excutable paths --- package.json | 268 +++++++++++++++++++++++++-------------------------- 1 file changed, 134 insertions(+), 134 deletions(-) diff --git a/package.json b/package.json index a43dd4f5a..9e4276452 100644 --- a/package.json +++ b/package.json @@ -8,163 +8,163 @@ "test:ci:unit": "karma start --browsers PhantomJS --single-run; npm run test:ci:lint", "test:ci:functional": "BROWSER=phantomjs bash tests/functional/test.sh start-ci", "posttest:ci:functional": "bash tests/functional/test.sh stop", - "test:dev:unit": "./node_modules/karma/bin/karma start", + "test:dev:unit": "karma start", "test:ci:lint": "eslint ./src/**/*.js", "test:dev:functional": "BROWSER=chrome bash tests/functional/test.sh start", "posttest:dev:functional": "bash tests/functional/test.sh stop", - "test:dev:lint": "node_modules/eslint/bin/eslint.js ./src/scripts/**/*.js", - "test:stylelint": "node_modules/stylelint/dist/cli.js './src/**/*.scss' --config webpack/.stylelintrc", + "test:dev:lint": "eslint ./src/scripts/**/*.js", + "test:stylelint": "stylelint './src/**/*.scss' --config webpack/.stylelintrc", "dev": "env NODE_PATH='./src' PORT=8000 UV_THREADPOOL_SIZE=100 node webpack/webpack-dev-server.js & env NODE_PATH='./src' PORT=8000 node ./bin/server.js", - "start": "NODE_PATH=\"./src\" node ./start", + "start": "NODE_PATH='src' node ./start", "build": "npm run build:client & npm run build:server", "build:server": "babel src -d dist -D", - "build:client": "node ./node_modules/webpack/bin/webpack.js --config webpack/prod.config.js", + "build:client": "node webpack --config webpack/prod.config.js", "validate": "npm ls", - "analyze:build": "env NODE_ENV=production ./node_modules/webpack/bin/webpack.js --json --config webpack/prod.config.js > bundle-stats.json", + "analyze:build": "env NODE_ENV=production webpack --json --config webpack/prod.config.js > bundle-stats.json", "analyze:json": "webpack-bundle-size-analyzer bundle-stats.json" }, "engines": { "node": ">= 6.3.0" }, "dependencies": { - "app-module-path": "^1.0.2", - "autoprefixer-loader": "^3.1.0", - "babel": "^6.5.2", - "babel-cli": "^6.11.4", - "babel-core": "^6.13.2", - "babel-loader": "^6.2.4", - "babel-plugin-add-module-exports": "^0.1.4", - "babel-plugin-system-import-transformer": "^2.0.0", - "babel-plugin-transform-decorators-legacy": "^1.3.4", - "babel-plugin-transform-react-constant-elements": "^6.9.1", - "babel-plugin-transform-react-display-name": "^6.5.0", - "babel-plugin-transform-react-inline-elements": "^6.8.0", - "babel-plugin-transform-runtime": "^6.7.5", - "babel-plugin-typecheck": "^3.8.0", - "babel-polyfill": "^6.7.4", - "babel-preset-es2015": "^6.13.2", - "babel-preset-react": "^6.5.0", - "babel-preset-stage-0": "^6.5.0", - "babel-register": "^6.11.6", - "babel-runtime": "^6.11.6", - "body-parser": "^1.14.1", - "bootstrap-loader": "^1.0.10", - "bootstrap-sass": "~3.3.1", - "bootstrap-sass-loader": "^1.0.9", - "bundle-loader": "~0.5.0", - "cache-manager": "^1.1.0", - "clean-webpack-plugin": "^0.1.8", - "compression": "^1.6.0", - "cookie-parser": "^1.3.5", - "copy-to-clipboard": "^1.0.4", - "cors": "^2.7.1", - "crypto-js": "^3.1.6", - "css-loader": "^0.23.1", - "debug": "^2.2.0", - "dotenv": "^1.2.0", - "errorhandler": "^1.4.2", - "express": "~4.14.0", - "express-state": "^1.2.0", - "express-useragent": "^0.2.0", + "app-module-path": "1.0.2", + "autoprefixer-loader": "3.1.0", + "babel": "6.5.2", + "babel-cli": "6.11.4", + "babel-core": "6.13.2", + "babel-loader": "6.2.4", + "babel-plugin-add-module-exports": "0.1.4", + "babel-plugin-system-import-transformer": "2.0.0", + "babel-plugin-transform-decorators-legacy": "1.3.4", + "babel-plugin-transform-react-constant-elements": "6.9.1", + "babel-plugin-transform-react-display-name": "6.5.0", + "babel-plugin-transform-react-inline-elements": "6.8.0", + "babel-plugin-transform-runtime": "6.7.5", + "babel-plugin-typecheck": "3.8.0", + "babel-polyfill": "6.7.4", + "babel-preset-es2015": "6.13.2", + "babel-preset-react": "6.5.0", + "babel-preset-stage-0": "6.5.0", + "babel-register": "6.11.6", + "babel-runtime": "6.11.6", + "body-parser": "1.14.1", + "bootstrap-loader": "1.0.10", + "bootstrap-sass": "3.3.1", + "bootstrap-sass-loader": "1.0.9", + "bundle-loader": "0.5.0", + "cache-manager": "1.1.0", + "clean-webpack-plugin": "0.1.8", + "compression": "1.6.0", + "cookie-parser": "1.3.5", + "copy-to-clipboard": "1.0.4", + "cors": "2.7.1", + "crypto-js": "3.1.6", + "css-loader": "0.23.1", + "debug": "2.2.0", + "dotenv": "1.2.0", + "errorhandler": "1.4.2", + "express": "4.14.0", + "express-state": "1.2.0", + "express-useragent": "0.2.0", "extract-text-webpack-plugin": "2.0.0-beta.3", - "file-loader": "^0.8.4", - "fontfaceobserver": "^1.7.1", - "html-webpack-plugin": "^1.4.0", - "http-proxy": "^1.13.2", - "humps": "^1.0.0", - "imports-loader": "^0.6.3", - "jquery": "^2.1.4", - "json-loader": "~0.5.1", - "morgan": "^1.6.1", - "node-sass": "^3.2.0", - "normalizr": "^2.0.0", - "phantomjs": "^1.9.18", - "pretty-error": "^2.0.0", - "promise": "^7.0.4", - "proxy-middleware": "^0.14.0", - "qs": "^6.1.0", - "raven": "^0.11.0", - "raw-loader": "^0.5.1", - "react": "^0.14.8", - "react-bootstrap": "^0.29.5", - "react-cookie": "^0.3.4", - "react-dom": "^0.14.0", - "react-helmet": "^3.1.0", - "react-metrics": "^1.1.0", - "react-paginate": "^0.4.0", - "react-redux": "^4.4.1", - "react-router": "^2.4.1", - "react-router-bootstrap": "^0.20.1", - "react-router-redux": "^4.0.0", - "react-router-scroll": "^0.2.0", - "react-scroll": "^1.0.4", - "redux": "^3.3.1", - "redux-connect": "^2.4.0", - "reselect": "^2.5.1", - "resolve-url": "^0.2.1", + "file-loader": "0.8.4", + "fontfaceobserver": "1.7.1", + "html-webpack-plugin": "1.4.0", + "http-proxy": "1.13.2", + "humps": "1.0.0", + "imports-loader": "0.6.3", + "jquery": "2.1.4", + "json-loader": "0.5.1", + "morgan": "1.6.1", + "node-sass": "3.2.0", + "normalizr": "2.0.0", + "phantomjs": "1.9.18", + "pretty-error": "2.0.0", + "promise": "7.0.4", + "proxy-middleware": "0.14.0", + "qs": "6.1.0", + "raven": "0.11.0", + "raw-loader": "0.5.1", + "react": "0.14.8", + "react-bootstrap": "0.29.5", + "react-cookie": "0.3.4", + "react-dom": "0.14.0", + "react-helmet": "3.1.0", + "react-metrics": "1.1.0", + "react-paginate": "0.4.0", + "react-redux": "4.4.1", + "react-router": "2.4.1", + "react-router-bootstrap": "0.20.1", + "react-router-redux": "4.0.0", + "react-router-scroll": "0.2.0", + "react-scroll": "1.0.4", + "redux": "3.3.1", + "redux-connect": "2.4.0", + "reselect": "2.5.1", + "resolve-url": "0.2.1", "sass-loader": "2.0.1", - "serialize-javascript": "^1.0.0", - "serve-favicon": "^2.2.1", - "sitemap": "^1.5.0", - "strip-loader": "^0.1.2", - "style-loader": "^0.13.1", - "superagent": "^1.2.0", - "url": "^0.11.0", - "url-loader": "~0.5.5", + "serialize-javascript": "1.0.0", + "serve-favicon": "2.2.1", + "sitemap": "1.5.0", + "strip-loader": "0.1.2", + "style-loader": "0.13.1", + "superagent": "1.2.0", + "url": "0.11.0", + "url-loader": "0.5.5", "webpack": "2.1.0-beta.20", - "webpack-isomorphic-tools": "^2.2.41", - "winston": "^1.1.2" + "webpack-isomorphic-tools": "2.2.41", + "winston": "1.1.2" }, "devDependencies": { - "babel-eslint": "^6.0.4", - "babel-plugin-react-transform": "^2.0.2", - "babel-preset-react-hmre": "^1.1.1", - "chai": "^3.0.0", - "chromedriver": "^2.22.2", - "del": "^2.0.2", - "enzyme": "^2.2.0", - "eslint": "^2.13.0", - "eslint-config-airbnb": "^9.0.1", - "eslint-loader": "^1.3.0", - "eslint-plugin-import": "^1.8.1", - "eslint-plugin-jsx-a11y": "^1.5.3", - "eslint-plugin-react": "^5.2.2", - "jscs": "^2.1.1", - "karma": "^1.1.2", - "karma-chai": "^0.1.0", - "karma-chai-sinon": "^0.1.5", - "karma-chrome-launcher": "^0.2.0", - "karma-junit-reporter": "^0.3.4", - "karma-mocha": "^0.2.0", + "babel-eslint": "6.0.4", + "babel-plugin-react-transform": "2.0.2", + "babel-preset-react-hmre": "1.1.1", + "chai": "3.0.0", + "chromedriver": "2.22.2", + "del": "2.0.2", + "enzyme": "2.2.0", + "eslint": "2.13.0", + "eslint-config-airbnb": "9.0.1", + "eslint-loader": "1.3.0", + "eslint-plugin-import": "1.8.1", + "eslint-plugin-jsx-a11y": "1.5.3", + "eslint-plugin-react": "5.2.2", + "jscs": "2.1.1", + "karma": "1.1.2", + "karma-chai": "0.1.0", + "karma-chai-sinon": "0.1.5", + "karma-chrome-launcher": "0.2.0", + "karma-junit-reporter": "0.3.4", + "karma-mocha": "0.2.0", "karma-phantomjs-launcher": "~0.2.1", "karma-script-launcher": "~0.1.0", - "karma-sinon": "^1.0.4", - "karma-sourcemap-loader": "^0.3.7", - "karma-webpack": "^1.6.0", - "mocha": "^2.2.5", - "nodemon": "^1.7.1", - "path": "^0.11.14", - "phantomjs": "^1.9.20", + "karma-sinon": "1.0.4", + "karma-sourcemap-loader": "0.3.7", + "karma-webpack": "1.6.0", + "mocha": "2.2.5", + "nodemon": "1.7.1", + "path": "0.11.14", + "phantomjs": "1.9.20", "phantomjs-polyfill": "0.0.1", - "piping": "^0.3.0", - "pre-commit": "^1.1.3", - "react-addons-test-utils": "^0.14.7", - "react-transform-catch-errors": "^1.0.0", - "react-transform-hmr": "^1.0.1", - "redbox-react": "^1.1.1", - "redux-devtools": "^3.1.1", - "redux-devtools-dock-monitor": "^1.1.0", - "redux-devtools-log-monitor": "^1.0.5", - "selenium-server": "^2.48.2", - "sinon": "^1.15.3", - "sinon-chai": "^2.8.0", - "stylelint": "^7.1.0", - "stylelint-webpack-plugin": "^0.2.0", - "wdio-mocha-framework": "^0.3.7", + "piping": "0.3.0", + "pre-commit": "1.1.3", + "react-addons-test-utils": "0.14.7", + "react-transform-catch-errors": "1.0.0", + "react-transform-hmr": "1.0.1", + "redbox-react": "1.1.1", + "redux-devtools": "3.1.1", + "redux-devtools-dock-monitor": "1.1.0", + "redux-devtools-log-monitor": "1.0.5", + "selenium-server": "2.48.2", + "sinon": "1.15.3", + "sinon-chai": "2.8.0", + "stylelint": "7.1.0", + "stylelint-webpack-plugin": "0.2.0", + "wdio-mocha-framework": "0.3.7", "wdio-spec-reporter": "0.0.3", "webdriverio": "4.2.1", - "webpack-dev-server": "^1.6.5", - "webpack-hot-middleware": "^2.12.2" + "webpack-dev-server": "1.6.5", + "webpack-hot-middleware": "2.12.2" }, "pre-commit": [ "test:dev:lint", From 7d54e6b2b266cc918a2e6dd69b3382103309ea56 Mon Sep 17 00:00:00 2001 From: Ahmed El Gabri Date: Sat, 27 Aug 2016 14:38:19 +0200 Subject: [PATCH 02/13] fix indentation --- webpack/.stylelintrc | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/webpack/.stylelintrc b/webpack/.stylelintrc index 78c5d9e14..c96c3f3e9 100644 --- a/webpack/.stylelintrc +++ b/webpack/.stylelintrc @@ -1,7 +1,7 @@ { "rules": { - "unit-no-unknown": true, - "no-duplicate-selectors": true, - "block-no-empty": true - } + "unit-no-unknown": true, + "no-duplicate-selectors": true, + "block-no-empty": true + } } From 53abaae0f7c80dd40f5503b81f61ed59fd26f794 Mon Sep 17 00:00:00 2001 From: Ahmed El Gabri Date: Sat, 27 Aug 2016 14:39:29 +0200 Subject: [PATCH 03/13] Linter fixes for webpack folder & bootstrap config --- src/styles/bootstrap.config.prod.js | 10 +- webpack/dev-server.js | 12 +-- webpack/dev.config.js | 104 ++++++++++++-------- webpack/isomorphic-tools-configuration.js | 38 ++++---- webpack/prod.config.js | 110 ++++++++++++++-------- webpack/webpack-dev-server.js | 22 ++--- 6 files changed, 177 insertions(+), 119 deletions(-) diff --git a/src/styles/bootstrap.config.prod.js b/src/styles/bootstrap.config.prod.js index a2e1c670e..119f15903 100644 --- a/src/styles/bootstrap.config.prod.js +++ b/src/styles/bootstrap.config.prod.js @@ -1,5 +1,9 @@ -/* eslint-disable */ -const bootstrapConfig = require('./bootstrap.config.js'); +const bootstrapConfig = require('./bootstrap.config'); const ExtractTextPlugin = require('extract-text-webpack-plugin'); -bootstrapConfig.styleLoader = ExtractTextPlugin.extract({fallbackLoader: 'style-loader', loader: 'css-loader!sass-loader'}); + +bootstrapConfig.styleLoader = ExtractTextPlugin.extract({ + fallbackLoader: 'style-loader', + loader: 'css-loader!sass-loader' +}); + module.exports = bootstrapConfig; diff --git a/webpack/dev-server.js b/webpack/dev-server.js index a301ab3ef..abcc5396c 100644 --- a/webpack/dev-server.js +++ b/webpack/dev-server.js @@ -1,6 +1,6 @@ -var webpack = require('webpack'); -var WebpackDevServer = require('webpack-dev-server'); -var config = require('./dev.config'); +const webpack = require('webpack'); +const WebpackDevServer = require('webpack-dev-server'); +const config = require('./dev.config'); new WebpackDevServer(webpack(config), { publicPath: config.output.publicPath, @@ -21,10 +21,8 @@ new WebpackDevServer(webpack(config), { cache: true, inline: true, debug: true, - headers: {"Access-Control-Allow-Origin": "*"}, + headers: {'Access-Control-Allow-Origin': '*'}, proxy: { '*': { target: 'http://localhost:8000' } } -}).listen(8001, function () { - console.info('==> 💻 Webpack Dev Server at http://localhost:8001'); -}); +}).listen(8001, () => console.info('==> 💻 Webpack Dev Server at http://localhost:8001')); diff --git a/webpack/dev.config.js b/webpack/dev.config.js index d96018c87..9c8aed93e 100644 --- a/webpack/dev.config.js +++ b/webpack/dev.config.js @@ -1,10 +1,8 @@ require('dotenv').load(); -var fs = require('fs'); -var path = require('path'); -var webpack = require('webpack'); -var path = require('path'); -var IsomorphicPlugin = require('webpack-isomorphic-tools/plugin'); -var webpackIsomorphicToolsPlugin = new IsomorphicPlugin(require('./isomorphic-tools-configuration')); +const webpack = require('webpack'); +const path = require('path'); +const IsomorphicPlugin = require('webpack-isomorphic-tools/plugin'); +const webpackIsomorphicToolsPlugin = new IsomorphicPlugin(require('./isomorphic-tools-configuration')); // eslint-disable-line max-len, global-require module.exports = { context: path.resolve(__dirname, '..'), @@ -27,45 +25,76 @@ module.exports = { filename: 'main.js' }, module: { + preLoaders: [ + // { + // test: /\.js$/, + // loader: 'eslint', + // exclude: /node_modules|bootstrap\.config/ + // } + ], loaders: [ - { test: /\.js$/, exclude: /node_modules/, loaders: [ - { - loader: 'babel', - query: { - plugins: [ - 'transform-runtime', - 'add-module-exports', - 'transform-decorators-legacy', - 'transform-react-display-name', - 'typecheck', - ], - presets: ['react', ['es2015', {'modules': false}], 'stage-0', 'react-hmre'], - cacheDirectory: true + { test: /\.json$/, loader: 'json'}, + { + test: /\.js$/, + exclude: /node_modules/, + loaders: [ + { + loader: 'babel', + query: { + plugins: [ + 'transform-runtime', + 'add-module-exports', + 'transform-decorators-legacy', + 'transform-react-display-name', + 'typecheck', + ], + presets: ['react', ['es2015', {modules: false}], 'stage-0', 'react-hmre'], + cacheDirectory: true + } } - }, - 'eslint-loader' - ]}, - { test: /\.json$/, loader: 'json-loader'}, - { test: /\.woff(\?v=\d+\.\d+\.\d+)?$/, loader: "url?name=fonts/[name].[ext]&limit=10000&mimetype=application/font-woff" }, - { test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/, loader: "url?name=fonts/[name].[ext]&limit=10000&mimetype=application/font-woff" }, - { test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, loader: "url?name=fonts/[name].[ext]&limit=10000&mimetype=application/octet-stream" }, - { test: /\.otf(\?v=\d+\.\d+\.\d+)?$/, loader: "url?name=fonts/[name].[ext]&limit=10000&mimetype=application/octet-stream" }, - { test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: "file?name=fonts/[name].[ext]" }, - { test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: "url?name=images/[name].[ext]&limit=10000&mimetype=image/svg+xml" }, - { test: webpackIsomorphicToolsPlugin.regular_expression('images'), loader: 'url-loader?name=images/[name].[ext]&limit=10240' }, - { test: /\.scss$/, loader: 'style!css?modules&importLoaders=2&sourceMap&localIdentName=[local]___[hash:base64:5]!autoprefixer?browsers=last 2 version!sass?outputStyle=expanded&sourceMap' } + ] + }, + { + test: /\.woff(\?v=\d+\.\d+\.\d+)?$/, + loader: 'url?name=fonts/[name].[ext]&limit=10000&mimetype=application/font-woff' + }, + { + test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/, + loader: 'url?name=fonts/[name].[ext]&limit=10000&mimetype=application/font-woff' + }, + { + test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, + loader: 'url?name=fonts/[name].[ext]&limit=10000&mimetype=application/octet-stream' + }, + { + test: /\.otf(\?v=\d+\.\d+\.\d+)?$/, + loader: 'url?name=fonts/[name].[ext]&limit=10000&mimetype=application/octet-stream' + }, + { + test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, + loader: 'file?name=fonts/[name].[ext]' + }, + { + test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, + loader: 'url?name=images/[name].[ext]&limit=10000&mimetype=image/svg+xml' + }, + { + test: webpackIsomorphicToolsPlugin.regular_expression('images'), + loader: 'url-loader?name=images/[name].[ext]&limit=10240' + }, + { + test: /\.scss$/, + loader: 'style!css?modules&importLoaders=2&sourceMap&localIdentName=[local]___[hash:base64:5]!autoprefixer?browsers=last 2 version!sass?outputStyle=expanded&sourceMap' // eslint-disable-line max-len + } ] }, - node: { - setImmediate: false - }, plugins: [ new webpack.HotModuleReplacementPlugin(), new webpack.NoErrorsPlugin(), new webpack.ProvidePlugin({ - $: "jquery", - jQuery: "jquery", - "windows.jQuery": "jquery" + $: 'jquery', + jQuery: 'jquery', + 'windows.jQuery': 'jquery' }), new webpack.DefinePlugin({ 'process.env.BROWSER': true, @@ -92,6 +121,7 @@ module.exports = { debug: true, cache: true, node: { + setImmediate: false, console: true, fs: 'empty', net: 'empty', diff --git a/webpack/isomorphic-tools-configuration.js b/webpack/isomorphic-tools-configuration.js index f34f8da9e..042724069 100644 --- a/webpack/isomorphic-tools-configuration.js +++ b/webpack/isomorphic-tools-configuration.js @@ -1,4 +1,4 @@ -var WebpackIsomorphicToolsPlugin = require('webpack-isomorphic-tools/plugin'); +const WebpackIsomorphicToolsPlugin = require('webpack-isomorphic-tools/plugin'); // see this link for more info on what all of this means // https://github.com/halt-hammerzeit/webpack-isomorphic-tools @@ -47,12 +47,13 @@ module.exports = { bootstrap: { extension: 'js', include: ['./bootstrap.config.js'], - filter: function(module, regex, options, log) { - function is_bootstrap_style(name) { + filter(module, regex, options, log) { + function isBootstrapStyle(name) { return name.indexOf('./bootstrap.config.js') >= 0; } if (options.development) { - return is_bootstrap_style(module.name) && WebpackIsomorphicToolsPlugin.style_loader_filter(module, regex, options, log); + return (isBootstrapStyle(module.name) && + WebpackIsomorphicToolsPlugin.style_loader_filter(module, regex, options, log)); } // no need for it in production mode }, @@ -62,37 +63,34 @@ module.exports = { parser: WebpackIsomorphicToolsPlugin.css_loader_parser }, style_modules: { - extensions: ['less','scss'], - filter: function(module, regex, options, log) { + extensions: ['less', 'scss'], + filter(module, regex, options, log) { if (options.development) { // in development mode there's webpack "style-loader", // so the module.name is not equal to module.name return WebpackIsomorphicToolsPlugin.style_loader_filter(module, regex, options, log); - } else { - // in production mode there's no webpack "style-loader", - // so the module.name will be equal to the asset path - return regex.test(module.name); } + // in production mode there's no webpack "style-loader", + // so the module.name will be equal to the asset path + return regex.test(module.name); }, - path: function(module, options, log) { + path(module, options, log) { if (options.development) { // in development mode there's webpack "style-loader", // so the module.name is not equal to module.name return WebpackIsomorphicToolsPlugin.style_loader_path_extractor(module, options, log); - } else { - // in production mode there's no webpack "style-loader", - // so the module.name will be equal to the asset path - return module.name; } + // in production mode there's no webpack "style-loader", + // so the module.name will be equal to the asset path + return module.name; }, - parser: function(module, options, log) { + parser(module, options, log) { if (options.development) { return WebpackIsomorphicToolsPlugin.css_modules_loader_parser(module, options, log); - } else { - // in production mode there's Extract Text Loader which extracts CSS text away - return module.source; } + // in production mode there's Extract Text Loader which extracts CSS text away + return module.source; } } } -} +}; diff --git a/webpack/prod.config.js b/webpack/prod.config.js index c6207f097..9717a409b 100644 --- a/webpack/prod.config.js +++ b/webpack/prod.config.js @@ -1,15 +1,15 @@ require('dotenv').load(); -var path = require('path'); -var ExtractTextPlugin = require('extract-text-webpack-plugin'); -var webpack = require('webpack'); -var CleanPlugin = require('clean-webpack-plugin'); -var IsomorphicPlugin = require('webpack-isomorphic-tools/plugin') -var strip = require('strip-loader'); +const path = require('path'); +const ExtractTextPlugin = require('extract-text-webpack-plugin'); +const webpack = require('webpack'); +const CleanPlugin = require('clean-webpack-plugin'); +const IsomorphicPlugin = require('webpack-isomorphic-tools/plugin'); +const strip = require('strip-loader'); -var webpackIsomorphicToolsPlugin = new IsomorphicPlugin(require('./isomorphic-tools-configuration')); -var relativeAssetsPath = '../static/dist'; -var assetsPath = path.join(__dirname, relativeAssetsPath); +const webpackIsomorphicToolsPlugin = new IsomorphicPlugin(require('./isomorphic-tools-configuration')); // eslint-disable-line max-len, global-require +const relativeAssetsPath = '../static/dist'; +const assetsPath = path.join(__dirname, relativeAssetsPath); module.exports = { output: { @@ -43,44 +43,72 @@ module.exports = { module: { loaders: [ { test: /\.css$/, loader: 'style!css' }, - { test: /\.js$/, exclude: /node_modules/, loaders: [ - strip.loader('debug'), - { - loader: 'babel', - query: { - 'presets': ['react', ['es2015', {'modules': false}], 'stage-0'], - 'plugins': [ - 'transform-runtime', - 'add-module-exports', - 'transform-decorators-legacy', - 'transform-react-display-name', - "transform-react-inline-elements", - "transform-react-constant-elements" - ] + { test: /\.json$/, loader: 'json'}, + { + test: /\.js$/, + exclude: /node_modules/, + loaders: [ + strip.loader('debug'), + { + loader: 'babel', + query: { + presets: ['react', ['es2015', {modules: false}], 'stage-0'], + plugins: [ + 'transform-runtime', + 'add-module-exports', + 'transform-decorators-legacy', + 'transform-react-display-name', + 'transform-react-inline-elements', + 'transform-react-constant-elements' + ] + } } - } - ]}, - { test: /\.json$/, loader: 'json-loader'}, - { test: /\.scss$/, loader: ExtractTextPlugin.extract({ - fallbackLoader: 'style', - loader: 'css?modules&importLoaders=2&sourceMap!autoprefixer?browsers=last 2 version!sass?outputStyle=expanded&sourceMap=true&sourceMapContents=true' - }) }, - { test: /\.woff(\?v=\d+\.\d+\.\d+)?$/, loader: "url?name=fonts/[name].[ext]&limit=10000&mimetype=application/font-woff" }, - { test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/, loader: "url?name=fonts/[name].[ext]&limit=10000&mimetype=application/font-woff" }, - { test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, loader: "url?name=fonts/[name].[ext]&limit=10000&mimetype=application/octet-stream" }, - { test: /\.otf(\?v=\d+\.\d+\.\d+)?$/, loader: "url?name=fonts/[name].[ext]&limit=10000&mimetype=application/octet-stream" }, - { test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: "file?name=fonts/[name].[ext]" }, - { test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: "url?name=images/[name].[ext]&limit=10000&mimetype=image/svg+xml" }, - { test: webpackIsomorphicToolsPlugin.regular_expression('images'), loader: 'url-loader?name=images/[name].[ext]&limit=10240' } + ] + }, + { + test: /\.scss$/, + loader: ExtractTextPlugin.extract({ + fallbackLoader: 'style', + loader: 'css?modules&importLoaders=2&sourceMap!autoprefixer?browsers=last 2 version!sass?outputStyle=expanded&sourceMap=true&sourceMapContents=true' // eslint-disable-line max-len + }) + }, + { + test: /\.woff(\?v=\d+\.\d+\.\d+)?$/, + loader: 'url?name=fonts/[name].[ext]&limit=10000&mimetype=application/font-woff' + }, + { + test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/, + loader: 'url?name=fonts/[name].[ext]&limit=10000&mimetype=application/font-woff' + }, + { + test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, + loader: 'url?name=fonts/[name].[ext]&limit=10000&mimetype=application/octet-stream' + }, + { + test: /\.otf(\?v=\d+\.\d+\.\d+)?$/, + loader: 'url?name=fonts/[name].[ext]&limit=10000&mimetype=application/octet-stream' + }, + { + test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, + loader: 'file?name=fonts/[name].[ext]' + }, + { + test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, + loader: 'url?name=images/[name].[ext]&limit=10000&mimetype=image/svg+xml' + }, + { + test: webpackIsomorphicToolsPlugin.regular_expression('images'), + loader: 'url?name=images/[name].[ext]&limit=10240' + } ] }, plugins: [ new CleanPlugin([relativeAssetsPath]), new webpack.NoErrorsPlugin(), new webpack.ProvidePlugin({ - $: "jquery", - jQuery: "jquery", - "windows.jQuery": "jquery" + $: 'jquery', + jQuery: 'jquery', + 'windows.jQuery': 'jquery' }), new ExtractTextPlugin({ filename: '[name]-[hash].css', allChunks: true }), new webpack.DefinePlugin({ @@ -107,7 +135,7 @@ module.exports = { warnings: false }, minimize: true - }), + }), new webpack.LoaderOptionsPlugin({ test: /\.css$/, // optionally pass test, include and exclude, default affects all loaders minimize: true, diff --git a/webpack/webpack-dev-server.js b/webpack/webpack-dev-server.js index bc95ade44..159f354e4 100644 --- a/webpack/webpack-dev-server.js +++ b/webpack/webpack-dev-server.js @@ -1,14 +1,14 @@ -var Express = require('express'); -var webpack = require('webpack'); +const Express = require('express'); +const webpack = require('webpack'); -var config = require('../src/config'); -var webpackConfig = require('./dev.config'); -var compiler = webpack(webpackConfig); +const config = require('../src/config'); +const webpackConfig = require('./dev.config'); +const compiler = webpack(webpackConfig); -var host = config.host || 'localhost'; -var port = (Number(config.port) + 1) || 3001; -var serverOptions = { - contentBase: 'http://' + host + ':' + port, +const host = config.host || 'localhost'; +const port = (Number(config.port) + 1) || 3001; +const serverOptions = { + contentBase: `http://${host}:${port}`, quiet: true, noInfo: true, hot: true, @@ -19,12 +19,12 @@ var serverOptions = { stats: {colors: true} }; -var app = new Express(); +const app = new Express(); app.use(require('webpack-dev-middleware')(compiler, serverOptions)); app.use(require('webpack-hot-middleware')(compiler)); -app.listen(port, function onAppListening(err) { +app.listen(port, err => { if (err) { console.error(err); } else { From 2c53a21c01d8dcb859586a18cbf6d590f7d02546 Mon Sep 17 00:00:00 2001 From: Ahmed El Gabri Date: Sat, 27 Aug 2016 14:46:08 +0200 Subject: [PATCH 04/13] make sure new npm isntallations will not use ranges --- .npmrc | 1 + 1 file changed, 1 insertion(+) create mode 100644 .npmrc diff --git a/.npmrc b/.npmrc new file mode 100644 index 000000000..1dab4ed4c --- /dev/null +++ b/.npmrc @@ -0,0 +1 @@ +save-exact = true From a36cd7982535f1a5ed449880c8ae481ff6d5ba67 Mon Sep 17 00:00:00 2001 From: Ahmed El Gabri Date: Sat, 27 Aug 2016 22:18:58 +0200 Subject: [PATCH 05/13] Update node-sass --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 9e4276452..6d3ce73d4 100644 --- a/package.json +++ b/package.json @@ -76,7 +76,7 @@ "jquery": "2.1.4", "json-loader": "0.5.1", "morgan": "1.6.1", - "node-sass": "3.2.0", + "node-sass": "3.8.0", "normalizr": "2.0.0", "phantomjs": "1.9.18", "pretty-error": "2.0.0", From 5675c6f9818d94d44272f5518d3d353cc36b6900 Mon Sep 17 00:00:00 2001 From: Ahmed El Gabri Date: Sat, 27 Aug 2016 22:21:19 +0200 Subject: [PATCH 06/13] Update travis Node version add `.nvrmc` for two reasons: - travis uses `nvm` by default to manage node versions. - It will make it easy for contributers who use `nvm` to use the proper node version locally too. --- .nvmrc | 1 + .travis.yml | 2 -- 2 files changed, 1 insertion(+), 2 deletions(-) create mode 100644 .nvmrc diff --git a/.nvmrc b/.nvmrc new file mode 100644 index 000000000..798e38995 --- /dev/null +++ b/.nvmrc @@ -0,0 +1 @@ +6.3.0 diff --git a/.travis.yml b/.travis.yml index 32099e761..af970c6eb 100644 --- a/.travis.yml +++ b/.travis.yml @@ -1,8 +1,6 @@ sudo: false language: node_js env: TEST_SUITE=unit -node_js: - - "5.6.0" cache: directories: - node_modules From 16f59c8f20d496e0ee072315d7e90423997240c4 Mon Sep 17 00:00:00 2001 From: Ahmed El Gabri Date: Sun, 28 Aug 2016 08:57:32 +0200 Subject: [PATCH 07/13] normalize paths in package.json --- package.json | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/package.json b/package.json index 6d3ce73d4..f358a5511 100644 --- a/package.json +++ b/package.json @@ -6,21 +6,21 @@ "scripts": { "test": "npm run test:dev:unit", "test:ci:unit": "karma start --browsers PhantomJS --single-run; npm run test:ci:lint", - "test:ci:functional": "BROWSER=phantomjs bash tests/functional/test.sh start-ci", - "posttest:ci:functional": "bash tests/functional/test.sh stop", + "test:ci:functional": "BROWSER=phantomjs ./tests/functional/test.sh start-ci", + "posttest:ci:functional": "./tests/functional/test.sh stop", "test:dev:unit": "karma start", "test:ci:lint": "eslint ./src/**/*.js", - "test:dev:functional": "BROWSER=chrome bash tests/functional/test.sh start", - "posttest:dev:functional": "bash tests/functional/test.sh stop", + "test:dev:functional": "BROWSER=chrome ./tests/functional/test.sh start", + "posttest:dev:functional": "./tests/functional/test.sh stop", "test:dev:lint": "eslint ./src/scripts/**/*.js", - "test:stylelint": "stylelint './src/**/*.scss' --config webpack/.stylelintrc", - "dev": "env NODE_PATH='./src' PORT=8000 UV_THREADPOOL_SIZE=100 node webpack/webpack-dev-server.js & env NODE_PATH='./src' PORT=8000 node ./bin/server.js", + "test:stylelint": "stylelint './src/**/*.scss' --config ./webpack/.stylelintrc", + "dev": "env NODE_PATH='./src' PORT=8000 UV_THREADPOOL_SIZE=100 node ./webpack/webpack-dev-server.js & env NODE_PATH='./src' PORT=8000 node ./bin/server.js", "start": "NODE_PATH='src' node ./start", "build": "npm run build:client & npm run build:server", - "build:server": "babel src -d dist -D", - "build:client": "node webpack --config webpack/prod.config.js", + "build:server": "babel ./src -d ./dist -D", + "build:client": "webpack --config ./webpack/prod.config.js", "validate": "npm ls", - "analyze:build": "env NODE_ENV=production webpack --json --config webpack/prod.config.js > bundle-stats.json", + "analyze:build": "env NODE_ENV=production webpack --json --config ./webpack/prod.config.js > bundle-stats.json", "analyze:json": "webpack-bundle-size-analyzer bundle-stats.json" }, "engines": { From 83caa1c0a09d332ee873546b7a575f60437cfac8 Mon Sep 17 00:00:00 2001 From: Ahmed El Gabri Date: Sun, 28 Aug 2016 08:58:23 +0200 Subject: [PATCH 08/13] make test.sh executable & update env shebang --- tests/functional/test.sh | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tests/functional/test.sh b/tests/functional/test.sh index 16b55a933..49f0ca954 100755 --- a/tests/functional/test.sh +++ b/tests/functional/test.sh @@ -1,5 +1,5 @@ +#!/usr/bin/env bash -#!/bin/bash if [ "$1" == 'stop' ]; then echo "Stopping selenium server..." pid=`ps -eo pid,args | grep selenium-server-standalone | grep -v grep | cut -c1-6` From 361c042a9248015ed766921a9f779f811407b3b8 Mon Sep 17 00:00:00 2001 From: Ahmed El Gabri Date: Sun, 28 Aug 2016 14:00:41 +0200 Subject: [PATCH 09/13] Remove npm install noise on CI, etc... --- Dockerfile | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Dockerfile b/Dockerfile index 6859241af..e3f6568dc 100644 --- a/Dockerfile +++ b/Dockerfile @@ -18,7 +18,7 @@ RUN cp /etc/cron.daily/logrotate /etc/cron.hourly # cache npm install when package.json hasn't changed WORKDIR /tmp ADD package.json package.json -RUN npm install +RUN npm install --silent --no-progress RUN npm install -g pm2 RUN mkdir /quran From 6f0b28d4930fb54b8c4818f047d0932be29f8bbb Mon Sep 17 00:00:00 2001 From: Ahmed El Gabri Date: Sun, 28 Aug 2016 14:03:53 +0200 Subject: [PATCH 10/13] =?UTF-8?q?remove=20duplicate=20phantomjs=20package?= =?UTF-8?q?=20=F0=9F=98=B1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 1 - 1 file changed, 1 deletion(-) diff --git a/package.json b/package.json index f358a5511..5319864a0 100644 --- a/package.json +++ b/package.json @@ -78,7 +78,6 @@ "morgan": "1.6.1", "node-sass": "3.8.0", "normalizr": "2.0.0", - "phantomjs": "1.9.18", "pretty-error": "2.0.0", "promise": "7.0.4", "proxy-middleware": "0.14.0", From 54e4373e79a84ec349887f663c730c16bb4fdb7a Mon Sep 17 00:00:00 2001 From: Ahmed El Gabri Date: Sun, 28 Aug 2016 14:09:04 +0200 Subject: [PATCH 11/13] add comment in .travis.yml for .nvmrc usage --- .travis.yml | 2 ++ 1 file changed, 2 insertions(+) diff --git a/.travis.yml b/.travis.yml index af970c6eb..e14961bd0 100644 --- a/.travis.yml +++ b/.travis.yml @@ -1,6 +1,8 @@ sudo: false language: node_js env: TEST_SUITE=unit +# Node version is handled inside `.nvmrc` file & travis picks it up automatically because it uses `nvm` +# https://docs.travis-ci.com/user/languages/javascript-with-nodejs#Using-.nvmrc cache: directories: - node_modules From 2d311a6d6c384b3571d7070c447f6c2f9de6f1d3 Mon Sep 17 00:00:00 2001 From: Ahmed El Gabri Date: Sun, 28 Aug 2016 14:16:55 +0200 Subject: [PATCH 12/13] Update Karma & Karma-webpack to fix jenkins error --- package.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index 5319864a0..a289259cd 100644 --- a/package.json +++ b/package.json @@ -129,7 +129,7 @@ "eslint-plugin-jsx-a11y": "1.5.3", "eslint-plugin-react": "5.2.2", "jscs": "2.1.1", - "karma": "1.1.2", + "karma": "1.2.0", "karma-chai": "0.1.0", "karma-chai-sinon": "0.1.5", "karma-chrome-launcher": "0.2.0", @@ -139,7 +139,7 @@ "karma-script-launcher": "~0.1.0", "karma-sinon": "1.0.4", "karma-sourcemap-loader": "0.3.7", - "karma-webpack": "1.6.0", + "karma-webpack": "1.8.0", "mocha": "2.2.5", "nodemon": "1.7.1", "path": "0.11.14", From 1ec1a9b14f2b8b0b2295aed913f7ad8f02549667 Mon Sep 17 00:00:00 2001 From: Ahmed El Gabri Date: Mon, 29 Aug 2016 21:02:00 +0200 Subject: [PATCH 13/13] Update packages to match production & remove old babel package --- package.json | 97 ++++++++++++++++++++++++++-------------------------- 1 file changed, 48 insertions(+), 49 deletions(-) diff --git a/package.json b/package.json index a289259cd..242a0cc72 100644 --- a/package.json +++ b/package.json @@ -28,90 +28,89 @@ }, "dependencies": { "app-module-path": "1.0.2", - "autoprefixer-loader": "3.1.0", - "babel": "6.5.2", + "autoprefixer-loader": "3.2.0", "babel-cli": "6.11.4", "babel-core": "6.13.2", "babel-loader": "6.2.4", "babel-plugin-add-module-exports": "0.1.4", - "babel-plugin-system-import-transformer": "2.0.0", + "babel-plugin-system-import-transformer": "2.2.1", "babel-plugin-transform-decorators-legacy": "1.3.4", "babel-plugin-transform-react-constant-elements": "6.9.1", - "babel-plugin-transform-react-display-name": "6.5.0", + "babel-plugin-transform-react-display-name": "6.8.0", "babel-plugin-transform-react-inline-elements": "6.8.0", - "babel-plugin-transform-runtime": "6.7.5", - "babel-plugin-typecheck": "3.8.0", - "babel-polyfill": "6.7.4", + "babel-plugin-transform-runtime": "6.12.0", + "babel-plugin-typecheck": "3.9.0", + "babel-polyfill": "6.13.0", "babel-preset-es2015": "6.13.2", - "babel-preset-react": "6.5.0", + "babel-preset-react": "6.11.1", "babel-preset-stage-0": "6.5.0", "babel-register": "6.11.6", "babel-runtime": "6.11.6", - "body-parser": "1.14.1", - "bootstrap-loader": "1.0.10", - "bootstrap-sass": "3.3.1", - "bootstrap-sass-loader": "1.0.9", - "bundle-loader": "0.5.0", - "cache-manager": "1.1.0", - "clean-webpack-plugin": "0.1.8", - "compression": "1.6.0", - "cookie-parser": "1.3.5", - "copy-to-clipboard": "1.0.4", + "body-parser": "1.15.2", + "bootstrap-loader": "1.1.0", + "bootstrap-sass": "3.3.7", + "bootstrap-sass-loader": "1.0.10", + "bundle-loader": "0.5.4", + "cache-manager": "1.5.0", + "clean-webpack-plugin": "0.1.10", + "compression": "1.6.2", + "cookie-parser": "1.4.3", + "copy-to-clipboard": "1.1.1", "cors": "2.7.1", "crypto-js": "3.1.6", "css-loader": "0.23.1", "debug": "2.2.0", "dotenv": "1.2.0", - "errorhandler": "1.4.2", + "errorhandler": "1.4.3", "express": "4.14.0", - "express-state": "1.2.0", - "express-useragent": "0.2.0", + "express-state": "1.4.0", + "express-useragent": "0.2.4", "extract-text-webpack-plugin": "2.0.0-beta.3", - "file-loader": "0.8.4", - "fontfaceobserver": "1.7.1", - "html-webpack-plugin": "1.4.0", - "http-proxy": "1.13.2", - "humps": "1.0.0", - "imports-loader": "0.6.3", - "jquery": "2.1.4", - "json-loader": "0.5.1", - "morgan": "1.6.1", + "file-loader": "0.8.5", + "fontfaceobserver": "1.7.3", + "html-webpack-plugin": "1.7.0", + "http-proxy": "1.14.0", + "humps": "1.1.0", + "imports-loader": "0.6.5", + "jquery": "2.2.4", + "json-loader": "0.5.4", + "morgan": "1.7.0", "node-sass": "3.8.0", - "normalizr": "2.0.0", + "normalizr": "2.2.1", "pretty-error": "2.0.0", - "promise": "7.0.4", + "promise": "7.1.1", "proxy-middleware": "0.14.0", - "qs": "6.1.0", + "qs": "6.2.1", "raven": "0.11.0", "raw-loader": "0.5.1", "react": "0.14.8", "react-bootstrap": "0.29.5", "react-cookie": "0.3.4", - "react-dom": "0.14.0", + "react-dom": "0.14.8", "react-helmet": "3.1.0", - "react-metrics": "1.1.0", - "react-paginate": "0.4.0", - "react-redux": "4.4.1", - "react-router": "2.4.1", + "react-metrics": "1.2.1", + "react-paginate": "0.4.3", + "react-redux": "4.4.5", + "react-router": "2.6.1", "react-router-bootstrap": "0.20.1", - "react-router-redux": "4.0.0", - "react-router-scroll": "0.2.0", - "react-scroll": "1.0.4", - "redux": "3.3.1", + "react-router-redux": "4.0.5", + "react-router-scroll": "0.2.1", + "react-scroll": "1.2.0", + "redux": "3.5.2", "redux-connect": "2.4.0", - "reselect": "2.5.1", + "reselect": "2.5.3", "resolve-url": "0.2.1", "sass-loader": "2.0.1", - "serialize-javascript": "1.0.0", - "serve-favicon": "2.2.1", - "sitemap": "1.5.0", + "serialize-javascript": "1.3.0", + "serve-favicon": "2.3.0", + "sitemap": "1.8.1", "strip-loader": "0.1.2", "style-loader": "0.13.1", - "superagent": "1.2.0", + "superagent": "1.8.4", "url": "0.11.0", - "url-loader": "0.5.5", + "url-loader": "0.5.7", "webpack": "2.1.0-beta.20", - "webpack-isomorphic-tools": "2.2.41", + "webpack-isomorphic-tools": "2.5.7", "winston": "1.1.2" }, "devDependencies": {