From ede273a73297f6e44e3c3037af07a117eb770ca4 Mon Sep 17 00:00:00 2001 From: Andrey Okonetchnikov Date: Thu, 15 Sep 2016 20:04:45 +0200 Subject: [PATCH] Splitted webpack config into base and dev. Re-use it in .storybook webpack config. --- .storybook/webpack.config.js | 35 +------------------------ package.json | 3 ++- webpack.config.js => webpack.base.js | 38 +--------------------------- webpack.dev.js | 37 +++++++++++++++++++++++++++ 4 files changed, 41 insertions(+), 72 deletions(-) rename webpack.config.js => webpack.base.js (53%) create mode 100644 webpack.dev.js diff --git a/.storybook/webpack.config.js b/.storybook/webpack.config.js index 08191f16..e62e19d4 100644 --- a/.storybook/webpack.config.js +++ b/.storybook/webpack.config.js @@ -1,34 +1 @@ -/* global module, __dirname, require */ -var webpack = require("webpack"); -const path = require("path"); - -module.exports = { - module: { - loaders: [ - { - test: /\.((png)|(eot)|(woff)|(woff2)|(ttf)|(svg)|(gif))(\?v=\d+\.\d+\.\d+)?$/, - loader: 'url-loader?limit=100000' - }, - { test: /\.json$/, loader: 'json-loader' }, - { - test: /\.css$/, - loader: 'style!css?modules&importLoaders=1!postcss' - }, - { - loader: 'babel', - test: /\.js?$/, - exclude: /(node_modules|bower_components)/, - query: { - cacheDirectory: true, - presets: ['react', 'es2015'], - plugins: ['transform-class-properties', 'transform-object-assign', 'transform-object-rest-spread'] - } - } - ] - }, - - postcss: [ - require("postcss-import")({addDependencyTo: webpack}), - require("postcss-cssnext")() - ], -}; +module.exports = require('../webpack.base.js'); diff --git a/package.json b/package.json index a5e4846f..9ae7f778 100644 --- a/package.json +++ b/package.json @@ -4,7 +4,7 @@ "description": "Netlify CMS lets content editors work on structured content stored in git", "main": "index.js", "scripts": { - "start": "webpack-dev-server --config webpack.config.js", + "start": "webpack-dev-server --config webpack.dev.js", "test": "NODE_ENV=test mocha --recursive --compilers js:babel-register --require ./test/setup.js", "test:watch": "npm test -- --watch", "build": "webpack --config webpack.config.js", @@ -75,6 +75,7 @@ "url-loader": "^0.5.7", "webpack": "^1.13.2", "webpack-dev-server": "^1.15.1", + "webpack-merge": "^0.14.1", "webpack-postcss-tools": "^1.1.1", "whatwg-fetch": "^1.0.0" }, diff --git a/webpack.config.js b/webpack.base.js similarity index 53% rename from webpack.config.js rename to webpack.base.js index f58687d1..80a24194 100644 --- a/webpack.config.js +++ b/webpack.base.js @@ -1,9 +1,4 @@ -/* global module, __dirname, require */ -var webpack = require('webpack'); -var path = require('path'); - -const HOST = 'localhost'; -const PORT = '8080'; +const webpack = require('webpack'); module.exports = { module: { @@ -47,35 +42,4 @@ module.exports = { require('postcss-import')({ addDependencyTo: webpack }), require('postcss-cssnext') ], - - plugins: [ - new webpack.optimize.OccurenceOrderPlugin(), - new webpack.HotModuleReplacementPlugin(), - new webpack.NoErrorsPlugin(), - new webpack.ProvidePlugin({ - 'fetch': 'imports?this=>global!exports?global.fetch!whatwg-fetch' - }) - ], - - context: path.join(__dirname, 'src'), - entry: { - cms: [ - 'webpack/hot/dev-server', - `webpack-dev-server/client?http://${HOST}:${PORT}/`, - 'react-hot-loader/patch', - './index' - ], - }, - output: { - path: path.join(__dirname, 'dist'), - filename: '[name].js', - publicPath: `http://${HOST}:${PORT}/`, - }, - externals: [/^vendor\/.+\.js$/], - devServer: { - hot: true, - contentBase: 'example/', - historyApiFallback: true, - devTool: 'cheap-module-source-map' - }, }; diff --git a/webpack.dev.js b/webpack.dev.js new file mode 100644 index 00000000..894dfef0 --- /dev/null +++ b/webpack.dev.js @@ -0,0 +1,37 @@ +/* global module, __dirname, require */ +const path = require('path'); +const webpack = require('webpack'); +const merge = require('webpack-merge'); +const HOST = 'localhost'; +const PORT = '8080'; + +module.exports = merge.smart(require('./webpack.base.js'), { + entry: { + cms: [ + 'webpack/hot/dev-server', + `webpack-dev-server/client?http://${HOST}:${PORT}/`, + 'react-hot-loader/patch', + './index' + ], + }, + output: { + path: path.join(__dirname, 'dist'), + filename: '[name].js', + publicPath: `http://${HOST}:${PORT}/`, + }, + context: path.join(__dirname, 'src'), + plugins: [ + new webpack.optimize.OccurenceOrderPlugin(), + new webpack.HotModuleReplacementPlugin(), + new webpack.NoErrorsPlugin(), + new webpack.ProvidePlugin({ + 'fetch': 'imports?this=>global!exports?global.fetch!whatwg-fetch' + }) + ], + devServer: { + hot: true, + contentBase: 'example/', + historyApiFallback: true, + devTool: 'cheap-module-source-map' + }, +});