diff --git a/make-webpack-config.js b/make-webpack-config.js index f2628bc0..3ed81a0f 100644 --- a/make-webpack-config.js +++ b/make-webpack-config.js @@ -1,11 +1,11 @@ -var path = require('path') +var path = require("path") -var webpack = require('webpack') -var ExtractTextPlugin = require('extract-text-webpack-plugin') -var deepExtend = require('deep-extend') -const {gitDescribeSync} = require('git-describe'); +var webpack = require("webpack") +var ExtractTextPlugin = require("extract-text-webpack-plugin") +var deepExtend = require("deep-extend") +const {gitDescribeSync} = require("git-describe") -var pkg = require('./package.json') +var pkg = require("./package.json") let gitInfo @@ -13,7 +13,7 @@ try { gitInfo = gitDescribeSync(__dirname) } catch(e) { gitInfo = { - hash: 'noGit', + hash: "noGit", dirty: false } } @@ -21,21 +21,21 @@ try { var commonRules = [ { test: /\.(js(x)?)(\?.*)?$/, use: [{ - loader: 'babel-loader', + loader: "babel-loader", options: { retainLines: true } }], - include: [ path.join(__dirname, 'src') ] + include: [ path.join(__dirname, "src") ] }, { test: /\.(txt|yaml)(\?.*)?$/, - loader: 'raw-loader' }, + loader: "raw-loader" }, { test: /\.(png|jpg|jpeg|gif|svg)(\?.*)?$/, - loader: 'url-loader?limit=10000' }, + loader: "url-loader?limit=10000" }, { test: /\.(woff|woff2)(\?.*)?$/, - loader: 'url-loader?limit=100000' }, + loader: "url-loader?limit=100000" }, { test: /\.(ttf|eot)(\?.*)?$/, - loader: 'file-loader' } + loader: "file-loader" } ] module.exports = function(rules, options) { @@ -54,13 +54,12 @@ module.exports = function(rules, options) { if( specialOptions.separateStylesheets ) { plugins.push(new ExtractTextPlugin({ - filename: '[name].css' + (specialOptions.longTermCaching ? '?[contenthash]' : ''), + filename: "[name].css" + (specialOptions.longTermCaching ? "?[contenthash]" : ""), allChunks: true })) } if( specialOptions.minimize ) { - plugins.push( new webpack.optimize.UglifyJsPlugin({ sourceMap: true, @@ -78,12 +77,11 @@ module.exports = function(rules, options) { plugins.push( new webpack.DefinePlugin({ - 'process.env': { - NODE_ENV: specialOptions.minimize ? JSON.stringify('production') : null, - WEBPACK_INLINE_STYLES: !Boolean(specialOptions.separateStylesheets) - + "process.env": { + NODE_ENV: specialOptions.minimize ? JSON.stringify("production") : null, + WEBPACK_INLINE_STYLES: !specialOptions.separateStylesheets }, - 'buildInfo': JSON.stringify({ + "buildInfo": JSON.stringify({ PACKAGE_VERSION: (pkg.version), GIT_COMMIT: gitInfo.hash, GIT_DIRTY: gitInfo.dirty @@ -92,21 +90,21 @@ module.exports = function(rules, options) { delete options._special - var completeConfig = deepExtend({ + var completeConfig = deepExtend({ entry: {}, output: { - path: path.join(__dirname, 'dist'), - publicPath: '/', - filename: '[name].js', - chunkFilename: '[name].js' + path: path.join(__dirname, "dist"), + publicPath: "/", + filename: "[name].js", + chunkFilename: "[name].js" }, - target: 'web', + target: "web", // yaml-js has a reference to `fs`, this is a workaround node: { - fs: 'empty' + fs: "empty" }, module: { @@ -114,17 +112,17 @@ module.exports = function(rules, options) { }, resolveLoader: { - modules: [path.join(__dirname, 'node_modules')], + modules: [path.join(__dirname, "node_modules")], }, externals: { - 'buffertools': true // json-react-schema/deeper depends on buffertools, which fails. + "buffertools": true // json-react-schema/deeper depends on buffertools, which fails. }, resolve: { modules: [ - path.join(__dirname, './src'), - 'node_modules' + path.join(__dirname, "./src"), + "node_modules" ], extensions: [".web.js", ".js", ".jsx", ".json", ".less"], alias: { @@ -132,7 +130,7 @@ module.exports = function(rules, options) { } }, - devtool: specialOptions.sourcemaps ? 'cheap-module-source-map' : null, + devtool: specialOptions.sourcemaps ? "cheap-module-source-map" : null, plugins, diff --git a/webpack-dist-bundle.config.js b/webpack-dist-bundle.config.js index f805c8bf..f876d0ef 100644 --- a/webpack-dist-bundle.config.js +++ b/webpack-dist-bundle.config.js @@ -1,64 +1,33 @@ -var path = require('path') -var rules = [ +const path = require("path") +const styleRules = require("./webpack.dist-style.config.js") + +let rules = [ { test: /\.(worker\.js)(\?.*)?$/, use: [ { - loader: 'worker-loader', + loader: "worker-loader", options: { inline: true, - name: '[name].js' - } - }, - { loader: 'babel-loader' } - ] - }, - { test: /\.(css)(\?.*)?$/, - use: [ - 'style-loader', - 'css-loader', - 'postcss-loader' - ] - }, - { test: /\.(scss)(\?.*)?$/, - use: [ - 'style-loader', - 'css-loader', - { - loader: 'postcss-loader', - options: { sourceMap: true } - }, - { loader: 'sass-loader', - options: { - outputStyle: 'expanded', - sourceMap: true, - sourceMapContents: 'true' + name: "[name].js" } - } - ] - }, - { test: /\.(less)(\?.*)?$/, - use: [ - 'style-loader', - 'css-loader', - { - loader: 'postcss-loader', }, - 'less-loader' + { loader: "babel-loader" } ] } ] +rules = rules.concat(styleRules) -module.exports = require('./make-webpack-config.js')(rules, { +module.exports = require("./make-webpack-config.js")(rules, { _special: { - separateStylesheets: false, + separateStylesheets: true, minimize: true, sourcemaps: true, }, entry: { - 'swagger-ui-bundle': [ - './src/polyfills', - './src/core/index.js' + "swagger-ui-bundle": [ + "./src/polyfills", + "./src/core/index.js" ] }, diff --git a/webpack-dist-standalone.config.js b/webpack-dist-standalone.config.js index 66469098..65aa1839 100644 --- a/webpack-dist-standalone.config.js +++ b/webpack-dist-standalone.config.js @@ -1,65 +1,33 @@ -var path = require('path') +const path = require("path") +const styleRules = require("./webpack.dist-style.config.js") -var rules = [ +let rules = [ { test: /\.(worker\.js)(\?.*)?$/, use: [ { - loader: 'worker-loader', + loader: "worker-loader", options: { inline: true, - name: '[name].js' + name: "[name].js" } }, - { loader: 'babel-loader' } - ] - }, - { test: /\.(css)(\?.*)?$/, - use: [ - 'style-loader', - 'css-loader', - 'postcss-loader' - ] - }, - { test: /\.(scss)(\?.*)?$/, - use: [ - 'style-loader', - 'css-loader', - { - loader: 'postcss-loader', - options: { sourceMap: true } - }, - { loader: 'sass-loader', - options: { - outputStyle: 'expanded', - sourceMap: true, - sourceMapContents: 'true' - } - } - ] - }, - { test: /\.(less)(\?.*)?$/, - use: [ - 'style-loader', - 'css-loader', - { - loader: 'postcss-loader', - }, - 'less-loader' + { loader: "babel-loader" } ] } ] +rules = rules.concat(styleRules) -module.exports = require('./make-webpack-config.js')(rules, { +module.exports = require("./make-webpack-config.js")(rules, { _special: { - separateStylesheets: false, + separateStylesheets: true, minimize: true, sourcemaps: true, }, entry: { - 'swagger-ui-standalone-preset': [ - './src/polyfills', - './src/standalone/index.js' + "swagger-ui-standalone-preset": [ + "./src/polyfills", + "./src/standalone/index.js" ] }, diff --git a/webpack-dist.config.js b/webpack-dist.config.js index b2e730dc..3aa65ed2 100644 --- a/webpack-dist.config.js +++ b/webpack-dist.config.js @@ -1,66 +1,25 @@ -var path = require('path') -var fs = require('fs') +const path = require("path") +const fs = require("fs") const nodeModules = fs.readdirSync("node_modules").filter(function(x) { return x !== ".bin" }) -var ExtractTextPlugin = require('extract-text-webpack-plugin') +const styleRules = require("./webpack.dist-style.config.js") -var rules = [ +let rules = [ { test: /\.(worker\.js)(\?.*)?$/, use: [ { - loader: 'worker-loader', + loader: "worker-loader", options: { inline: true, - name: '[name].js' + name: "[name].js" } }, - { loader: 'babel-loader' } + { loader: "babel-loader" } ] - }, - { test: /\.(css)(\?.*)?$/, - use: ExtractTextPlugin.extract({ - fallback: 'style-loader', - use: [ - 'css-loader', - 'postcss-loader' - ] - }) - }, - { test: /\.(scss)(\?.*)?$/, - use: ExtractTextPlugin.extract({ - fallback: 'style-loader', - use: [ - { - loader: 'css-loader', - options: { minimize: true } - }, - { - loader: 'postcss-loader', - options: { sourceMap: true } - }, - { loader: 'sass-loader', - options: { - outputStyle: 'expanded', - sourceMap: true, - sourceMapContents: 'true' - } - } - ] - }) - }, - { test: /\.(less)(\?.*)?$/, - use: ExtractTextPlugin.extract({ - fallback: 'style-loader', - use: ['css-loader', - { - loader: 'postcss-loader', - }, - 'less-loader' - ] - }) } ] +rules = rules.concat(styleRules) -module.exports = require('./make-webpack-config.js')(rules, { +module.exports = require("./make-webpack-config.js")(rules, { _special: { separateStylesheets: true, minimize: true, diff --git a/webpack-hot-dev-server.config.js b/webpack-hot-dev-server.config.js index cb8e4b70..3e61628b 100644 --- a/webpack-hot-dev-server.config.js +++ b/webpack-hot-dev-server.config.js @@ -1,55 +1,55 @@ -var path = require('path') +const path = require("path") -var rules = [ +const rules = [ { test: /\.(worker\.js)(\?.*)?$/, use: [ { - loader: 'worker-loader', + loader: "worker-loader", options: { inline: true } }, - { loader: 'babel-loader' } + { loader: "babel-loader" } ] }, { test: /\.(jsx)(\?.*)?$/, use: [ - { loader: 'react-hot-loader' }, - { loader: 'babel-loader' } + { loader: "react-hot-loader" }, + { loader: "babel-loader" } ] }, { test: /\.(css)(\?.*)?$/, use: [ - 'style-loader', - 'css-loader', - 'postcss-loader' + "style-loader", + "css-loader", + "postcss-loader" ] }, { test: /\.(scss)(\?.*)?$/, use: [ - 'style-loader', - 'css-loader', + "style-loader", + "css-loader", { - loader: 'postcss-loader', + loader: "postcss-loader", options: { sourceMap: true } }, - { loader: 'sass-loader', + { loader: "sass-loader", options: { - outputStyle: 'expanded', + outputStyle: "expanded", sourceMap: true, - sourceMapContents: 'true' + sourceMapContents: "true" } } ] }, { test: /\.(less)(\?.*)?$/, use: [ - 'style-loader', - 'css-loader', + "style-loader", + "css-loader", { - loader: 'postcss-loader', + loader: "postcss-loader", }, - 'less-loader' + "less-loader" ] } ] @@ -60,25 +60,25 @@ module.exports = require("./make-webpack-config")(rules, { }, devtool: "eval", entry: { - 'swagger-ui-bundle': [ - './src/polyfills', - './src/core/index.js' + "swagger-ui-bundle": [ + "./src/polyfills", + "./src/core/index.js" ], - 'swagger-ui-standalone-preset': [ - './src/polyfills', - './src/standalone/index.js', + "swagger-ui-standalone-preset": [ + "./src/polyfills", + "./src/standalone/index.js", ] }, output: { pathinfo: true, - filename: '[name].js', + filename: "[name].js", library: "[name]", libraryTarget: "umd", chunkFilename: "[id].js" }, devServer: { port: 3200, - contentBase: path.join(__dirname, 'dev-helpers'), + contentBase: path.join(__dirname, "dev-helpers"), publicPath: "/", noInfo: true, hot: true, diff --git a/webpack-watch.config.js b/webpack-watch.config.js index 4406b0aa..ed5c711c 100644 --- a/webpack-watch.config.js +++ b/webpack-watch.config.js @@ -1,3 +1,3 @@ -var config = require("./webpack-dist.config.js") +const config = require("./webpack-dist.config.js") module.exports = config diff --git a/webpack.check.js b/webpack.check.js index 02a47376..6f10188b 100644 --- a/webpack.check.js +++ b/webpack.check.js @@ -1,8 +1,7 @@ -const webpack = require('webpack') -const path = require('path') -const deepMerge = require('deepmerge') -const webpackConfig = require('./webpack-dist-bundle.config.js') -const DEPS_CHECK_DIR = require('./package.json').config.deps_check_dir +const path = require("path") +const deepMerge = require("deepmerge") +const webpackConfig = require("./webpack-dist-bundle.config.js") +const DEPS_CHECK_DIR = require("./package.json").config.deps_check_dir module.exports = deepMerge( webpackConfig, { diff --git a/webpack.config.js b/webpack.config.js index 0d22493e..f0ca3601 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -1,3 +1,3 @@ module.exports = require("./make-webpack-config")({ -}); \ No newline at end of file +}) \ No newline at end of file diff --git a/webpack.dist-style.config.js b/webpack.dist-style.config.js new file mode 100644 index 00000000..1a3424fd --- /dev/null +++ b/webpack.dist-style.config.js @@ -0,0 +1,45 @@ +const ExtractTextPlugin = require("extract-text-webpack-plugin") + +module.exports = [{ + test: /\.(css)(\?.*)?$/, + use: ExtractTextPlugin.extract({ + fallback: "style-loader", + use: [ + "css-loader", + "postcss-loader" + ] + }) +}, +{ test: /\.(scss)(\?.*)?$/, + use: ExtractTextPlugin.extract({ + fallback: "style-loader", + use: [ + { + loader: "css-loader", + options: { minimize: true } + }, + { + loader: "postcss-loader", + options: { sourceMap: true } + }, + { loader: "sass-loader", + options: { + outputStyle: "expanded", + sourceMap: true, + sourceMapContents: "true" + } + } + ] + }) +}, +{ test: /\.(less)(\?.*)?$/, + use: ExtractTextPlugin.extract({ + fallback: "style-loader", + use: ["css-loader", + { + loader: "postcss-loader", + }, + "less-loader" + ] + }) +}] \ No newline at end of file