diff --git a/.travis.yml b/.travis.yml index 1d043b4..c8f89eb 100644 --- a/.travis.yml +++ b/.travis.yml @@ -1,8 +1,9 @@ language: node_js node_js: + - 9 + - 8 - 7 - 6 - - 4 before_install: - currentfolder=${PWD##*/} - if [ "$currentfolder" != 'react-webpack-template' ]; then cd .. && eval "mv $currentfolder react-webpack-template" && cd react-webpack-template; fi diff --git a/cfg/base.js b/cfg/base.js index 751648f..177fb10 100644 --- a/cfg/base.js +++ b/cfg/base.js @@ -10,34 +10,37 @@ let defaultSettings = require('./defaults'); let additionalPaths = []; module.exports = { - additionalPaths: additionalPaths, - port: defaultSettings.port, - debug: true, - devtool: 'eval', - output: { - path: path.join(__dirname, '/../dist/assets'), - filename: 'app.js', - publicPath: defaultSettings.publicPath + pureConfig: { + devtool: 'eval', + output: { + path: path.join(__dirname, '/../dist/assets'), + filename: 'app.js', + publicPath: defaultSettings.publicPath + }, + devServer: { + contentBase: './src/', + historyApiFallback: true, + hot: true, + port: defaultSettings.port, + publicPath: defaultSettings.publicPath, + noInfo: false + }, + resolve: { + extensions: ['.js', '.jsx'], + alias: { + actions: `${defaultSettings.srcPath}/actions/`, + components: `${defaultSettings.srcPath}/components/`, + sources: `${defaultSettings.srcPath}/sources/`, + stores: `${defaultSettings.srcPath}/stores/`, + styles: `${defaultSettings.srcPath}/styles/`, + config: `${defaultSettings.srcPath}/config/` + process.env.REACT_WEBPACK_ENV, + 'react/lib/ReactMount': 'react-dom/lib/ReactMount' + } + }, + module: {} }, - devServer: { - contentBase: './src/', - historyApiFallback: true, - hot: true, + extras: { port: defaultSettings.port, - publicPath: defaultSettings.publicPath, - noInfo: false - }, - resolve: { - extensions: ['', '.js', '.jsx'], - alias: { - actions: `${defaultSettings.srcPath}/actions/`, - components: `${defaultSettings.srcPath}/components/`, - sources: `${defaultSettings.srcPath}/sources/`, - stores: `${defaultSettings.srcPath}/stores/`, - styles: `${defaultSettings.srcPath}/styles/`, - config: `${defaultSettings.srcPath}/config/` + process.env.REACT_WEBPACK_ENV, - 'react/lib/ReactMount': 'react-dom/lib/ReactMount' - } - }, - module: {} + additionalPaths: additionalPaths, + } }; diff --git a/cfg/defaults.js b/cfg/defaults.js index 67a4328..9267b22 100644 --- a/cfg/defaults.js +++ b/cfg/defaults.js @@ -16,14 +16,13 @@ const dfltPort = 8000; */ function getDefaultModules() { return { - preLoaders: [ - { - test: /\.(js|jsx)$/, - include: srcPath, - loader: 'eslint-loader' - } - ], - loaders: [ + rules: [ + // { + // enforce: 'pre', + // test: /\.(js|jsx)$/, + // include: srcPath, + // loader: 'eslint-loader' + // }, { test: /\.css$/, loader: 'style-loader!css-loader' diff --git a/cfg/dev.js b/cfg/dev.js index 6185d7b..70aea35 100644 --- a/cfg/dev.js +++ b/cfg/dev.js @@ -1,14 +1,14 @@ -'use strict'; +'use strict'; let path = require('path'); let webpack = require('webpack'); let baseConfig = require('./base'); let defaultSettings = require('./defaults'); // Add needed plugins here -let BowerWebpackPlugin = require('bower-webpack-plugin'); -let config = Object.assign({}, baseConfig, { +let config = Object.assign({}, baseConfig.pureConfig, { + mode: 'development', entry: [ 'webpack-dev-server/client?http://127.0.0.1:' + defaultSettings.port, 'webpack/hot/only-dev-server', @@ -18,22 +18,23 @@ let config = Object.assign({}, baseConfig, { devtool: 'eval-source-map', plugins: [ new webpack.HotModuleReplacementPlugin(), - new webpack.NoErrorsPlugin(), - new BowerWebpackPlugin({ - searchResolveModulesDirectories: false - }) + new webpack.LoaderOptionsPlugin({ options: {} }), + new webpack.NoEmitOnErrorsPlugin(), ], module: defaultSettings.getDefaultModules() }); -// Add needed loaders to the defaults here -config.module.loaders.push({ +// Add needed rules (loaders in Webpack 1.x) to the defaults here +config.module.rules.push({ test: /\.(js|jsx)$/, - loader: 'react-hot!babel-loader', + loader: 'react-hot-loader/webpack!babel-loader', include: [].concat( - config.additionalPaths, + baseConfig.extras.additionalPaths, [ path.join(__dirname, '/../src') ] ) }); -module.exports = config; +module.exports = { + pureConfig: config, + extras: baseConfig.extras, +}; diff --git a/cfg/dist.js b/cfg/dist.js index 1fc19c4..76bc1a9 100644 --- a/cfg/dist.js +++ b/cfg/dist.js @@ -7,34 +7,29 @@ let baseConfig = require('./base'); let defaultSettings = require('./defaults'); // Add needed plugins here -let BowerWebpackPlugin = require('bower-webpack-plugin'); -let config = Object.assign({}, baseConfig, { +let config = Object.assign({}, baseConfig.pureConfig, { + mode: 'production', entry: path.join(__dirname, '../src/index'), cache: false, devtool: 'sourcemap', plugins: [ - new webpack.optimize.DedupePlugin(), new webpack.DefinePlugin({ 'process.env.NODE_ENV': '"production"' }), - new BowerWebpackPlugin({ - searchResolveModulesDirectories: false - }), - new webpack.optimize.UglifyJsPlugin(), - new webpack.optimize.OccurenceOrderPlugin(), + new webpack.optimize.OccurrenceOrderPlugin(), new webpack.optimize.AggressiveMergingPlugin(), - new webpack.NoErrorsPlugin() + new webpack.NoEmitOnErrorsPlugin(), ], module: defaultSettings.getDefaultModules() }); -// Add needed loaders to the defaults here -config.module.loaders.push({ +// Add needed rules (loaders in Webpack 1.x) to the defaults here +config.module.rules.push({ test: /\.(js|jsx)$/, - loader: 'babel', + loader: 'babel-loader', include: [].concat( - config.additionalPaths, + baseConfig.extras.additionalPaths, [ path.join(__dirname, '/../src') ] ) }); diff --git a/cfg/test.js b/cfg/test.js index f139c49..03dc2a0 100644 --- a/cfg/test.js +++ b/cfg/test.js @@ -6,21 +6,23 @@ let srcPath = path.join(__dirname, '/../src/'); let baseConfig = require('./base'); // Add needed plugins here -let BowerWebpackPlugin = require('bower-webpack-plugin'); module.exports = { devtool: 'eval', + mode: 'development', module: { - preLoaders: [ + rules: [ { + enforce: 'pre', test: /\.(js|jsx)$/, - loader: 'isparta-instrumenter-loader', + loader: 'istanbul-instrumenter-loader', + query: { + esModules: true + }, include: [ path.join(__dirname, '/../src') ] - } - ], - loaders: [ + }, { test: /\.(png|jpg|gif|woff|woff2|css|sass|scss|less|styl)$/, loader: 'null-loader' @@ -29,7 +31,7 @@ module.exports = { test: /\.(js|jsx)$/, loader: 'babel-loader', include: [].concat( - baseConfig.additionalPaths, + baseConfig.extras.additionalPaths, [ path.join(__dirname, '/../src'), path.join(__dirname, '/../test') @@ -39,7 +41,7 @@ module.exports = { ] }, resolve: { - extensions: [ '', '.js', '.jsx' ], + extensions: [ '.js', '.jsx' ], alias: { actions: srcPath + 'actions/', helpers: path.join(__dirname, '/../test/helpers'), @@ -50,9 +52,5 @@ module.exports = { config: srcPath + 'config/' + process.env.REACT_WEBPACK_ENV } }, - plugins: [ - new BowerWebpackPlugin({ - searchResolveModulesDirectories: false - }) - ] + plugins: [] }; diff --git a/package.json b/package.json index ce6f65f..ff644a6 100644 --- a/package.json +++ b/package.json @@ -38,21 +38,20 @@ "devDependencies": { "babel-core": "^6.0.0", "babel-eslint": "^6.0.0", - "babel-loader": "^6.0.0", + "babel-loader": "^7.1.5", "babel-polyfill": "^6.3.14", "babel-preset-es2015": "^6.0.15", "babel-preset-react": "^6.0.15", "babel-preset-stage-0": "^6.5.0", - "bower-webpack-plugin": "^0.1.9", "chai": "^3.2.0", "copyfiles": "^1.0.0", "css-loader": "^0.23.0", "eslint": "^3.0.0", - "eslint-loader": "^1.0.0", + "eslint-loader": "^1.9.0", "eslint-plugin-react": "^6.0.0", - "file-loader": "^0.9.0", + "file-loader": "^1.1.11", "glob": "^7.0.0", - "isparta-instrumenter-loader": "^1.0.0", + "istanbul-instrumenter-loader": "^3.0.1", "karma": "^1.0.0", "karma-chai": "^0.1.0", "karma-coverage": "^1.0.0", @@ -60,24 +59,25 @@ "karma-mocha-reporter": "^2.0.0", "karma-phantomjs-launcher": "^1.0.0", "karma-sourcemap-loader": "^0.3.5", - "karma-webpack": "^1.7.0", + "karma-webpack": "^3.0.0", "minimist": "^1.2.0", "mocha": "^3.0.0", "null-loader": "^0.1.1", "open": "0.0.5", "phantomjs-prebuilt": "^2.0.0", - "react-addons-test-utils": "^15.0.0", - "react-hot-loader": "^1.2.9", + "react-hot-loader": "^3.0.0-beta.6", + "react-test-renderer": "^16.4.2", "rimraf": "^2.4.3", "style-loader": "^0.13.0", - "url-loader": "^0.5.6", - "webpack": "^1.12.0", - "webpack-dev-server": "^1.12.0" + "url-loader": "^0.5.9", + "webpack": "^4.0.0", + "webpack-cli": "^3.1.0", + "webpack-dev-server": "^3.1.5" }, "dependencies": { "core-js": "^2.0.0", "normalize.css": "^4.0.0", - "react": "^15.0.0", - "react-dom": "^15.0.0" + "react": "^16.4.1", + "react-dom": "^16.4.1" } } diff --git a/server.js b/server.js index becb3e6..996b252 100644 --- a/server.js +++ b/server.js @@ -12,14 +12,14 @@ const open = require('open'); */ let isInitialCompilation = true; -const compiler = webpack(config); +const compiler = webpack(config.pureConfig); -new WebpackDevServer(compiler, config.devServer) -.listen(config.port, 'localhost', (err) => { +new WebpackDevServer(compiler, config.pureConfig.devServer) +.listen(config.extras.port, 'localhost', (err) => { if (err) { console.log(err); } - console.log('Listening at localhost:' + config.port); + console.log('Listening at localhost:' + config.extras.port); }); compiler.plugin('done', () => { @@ -27,8 +27,8 @@ compiler.plugin('done', () => { // Ensures that we log after webpack printed its stats (is there a better way?) setTimeout(() => { console.log('\n✓ The bundle is now ready for serving!\n'); - console.log(' Open in iframe mode:\t\x1b[33m%s\x1b[0m', 'http://localhost:' + config.port + '/webpack-dev-server/'); - console.log(' Open in inline mode:\t\x1b[33m%s\x1b[0m', 'http://localhost:' + config.port + '/\n'); + console.log(' Open in iframe mode:\t\x1b[33m%s\x1b[0m', 'http://localhost:' + config.extras.port + '/webpack-dev-server/'); + console.log(' Open in inline mode:\t\x1b[33m%s\x1b[0m', 'http://localhost:' + config.extras.port + '/\n'); console.log(' \x1b[33mHMR is active\x1b[0m. The bundle will automatically rebuild and live-update on changes.') }, 350); } diff --git a/test/helpers/shallowRenderHelper.js b/test/helpers/shallowRenderHelper.js index e8cc1d4..cb7e0ac 100644 --- a/test/helpers/shallowRenderHelper.js +++ b/test/helpers/shallowRenderHelper.js @@ -6,7 +6,8 @@ * @author somonsmith */ import React from 'react'; -import TestUtils from 'react-addons-test-utils'; +import TestUtils from 'react-dom/test-utils'; +import ShallowRenderer from 'react-test-renderer/shallow' /** * Get the shallow rendered component @@ -16,8 +17,9 @@ import TestUtils from 'react-addons-test-utils'; * @param {Mixed} ...children [optional] List of children * @return {Object} Shallow rendered output */ + export default function createComponent(component, props = {}, ...children) { - const shallowRenderer = TestUtils.createRenderer(); - shallowRenderer.render(React.createElement(component, props, children.length > 1 ? children : children[0])); - return shallowRenderer.getRenderOutput(); + const renderer = new ShallowRenderer(); + renderer.render(React.createElement(component, props, children.length > 1 ? children : children[0])); + return renderer.getRenderOutput(); }