@s-ui/bundler 9.55.0 → 9.56.0-beta.0

package/bin/sui-bundler-lib.js

@@ -17,6 +17,7 @@ program
   .option('-u, --umd [libraryName]', 'Whether to output library as umb')
   .option('-r, --root', 'Create build in root dir instead of version subdir')
   .option('-p, --path [path]', 'Absolute public path where files will be located.')
+  .option('--chunk-css', 'Bundle css in chunks')
   .on('--help', () =>
     console.log(`Examples:
       $ sui-bundler lib src/index.js -o umd/my-lib -p http://my-cdn.com/my-lib -C'
@@ -27,7 +28,7 @@ program
 
 const [entry] = program.args
 const options = program.opts()
-const {clean = false, output, umd = false, root = false} = options
+const {clean = false, output, umd = false, root = false, chunkCss = false} = options
 const publicPath = options.path
 
 if (!output) {
@@ -46,7 +47,7 @@ process.env.NODE_ENV = process.env.NODE_ENV || 'production'
 
 const version = getPackageJson(process.cwd()).version
 const outputFolder = path.join(process.cwd(), output, path.sep, root ? '' : version)
-const webpackConfig = {...config, entry: path.resolve(process.cwd(), entry)}
+const webpackConfig = {...config({chunkCss}), entry: path.resolve(process.cwd(), entry)}
 webpackConfig.output.publicPath = publicPath + (root ? '' : version + '/')
 webpackConfig.output.path = outputFolder
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@s-ui/bundler",
-  "version": "9.55.0",
+  "version": "9.56.0-beta.0",
   "description": "Config-free bundler for ES6 React apps.",
   "bin": {
     "sui-bundler": "./bin/sui-bundler.js"

package/shared/define.js

@@ -8,6 +8,7 @@ if (process.platform === 'win32') {
 
 module.exports = (vars = {}) =>
   new webpack.DefinePlugin({
+    __MOCKS_API_PATH__: JSON.stringify(process.env.MOCKS_API_PATH || process.env.PWD + '/mocks/routes'),
     __DEV__: false,
     __BASE_DIR__: JSON.stringify(process.env.PWD),
     ...vars

package/webpack.config.lib.js

@@ -1,6 +1,11 @@
 const webpack = require('webpack')
 const MiniCssExtractPlugin = require('mini-css-extract-plugin')
-const {cleanList, envVars, MAIN_ENTRY_POINT, config} = require('./shared/index.js')
+const {
+  cleanList,
+  envVars,
+  MAIN_ENTRY_POINT,
+  config
+} = require('./shared/index.js')
 const path = require('path')
 const minifyJs = require('./shared/minify-js.js')
 const definePlugin = require('./shared/define.js')
@@ -9,55 +14,59 @@ const sassRules = require('./shared/module-rules-sass.js')
 const {extractComments, sourceMap, supportLegacyBrowsers} = require('./shared/config.js')
 const {aliasFromConfig} = require('./shared/resolve-alias.js')
 
-const cssFileName = 'styles.css'
 
-module.exports = {
-  mode: 'production',
-  resolve: {
-    alias: {
-      ...aliasFromConfig
+module.exports = ({
+  chunkCss
+} = {}) => {
+  const cssFileName = chunkCss ? '[name].[contenthash:8].css' : 'styles.css'
+  return {
+    mode: 'production',
+    resolve: {
+      alias: {
+        ...aliasFromConfig
+      },
+      fallback: {
+        assert: false,
+        fs: false,
+        http: require.resolve('stream-http'),
+        https: require.resolve('https-browserify'),
+        path: false
+      },
+      extensions: ['.js', '.json'],
+      modules: ['node_modules', path.resolve(process.cwd())]
     },
-    fallback: {
-      assert: false,
-      fs: false,
-      http: require.resolve('stream-http'),
-      https: require.resolve('https-browserify'),
-      path: false
-    },
-    extensions: ['.js', '.json'],
-    modules: ['node_modules', path.resolve(process.cwd())]
-  },
-  entry: config.vendor
-    ? {
+    entry: config.vendor ?
+      {
         app: MAIN_ENTRY_POINT,
         vendor: config.vendor
-      }
-    : MAIN_ENTRY_POINT,
-  target: 'web',
-  output: {
-    filename: 'index.js'
-  },
-  optimization: {
-    // avoid looping over all the modules after the compilation
-    checkWasmTypes: false,
-    minimize: true,
-    minimizer: [minifyJs({extractComments, sourceMap})]
-  },
-  plugins: cleanList([
-    new webpack.ProvidePlugin({
-      process: 'process/browser'
-    }),
-    new MiniCssExtractPlugin({
-      filename: cssFileName,
-      chunkFilename: cssFileName
-    }),
-    new webpack.optimize.LimitChunkCountPlugin({
-      maxChunks: 1
-    }),
-    new webpack.EnvironmentPlugin(envVars(config.env)),
-    definePlugin()
-  ]),
-  module: {
-    rules: [createBabelRules({supportLegacyBrowsers}), sassRules]
+      } :
+      MAIN_ENTRY_POINT,
+    target: 'web',
+    output: {
+      filename: 'index.js'
+    },
+    optimization: {
+      // avoid looping over all the modules after the compilation
+      checkWasmTypes: false,
+      minimize: true,
+      minimizer: [minifyJs({extractComments, sourceMap})]
+    },
+    plugins: cleanList([
+      new webpack.ProvidePlugin({
+        process: 'process/browser'
+      }),
+      new MiniCssExtractPlugin({
+        filename: cssFileName,
+        chunkFilename: cssFileName
+      }),
+      !chunkCss && new webpack.optimize.LimitChunkCountPlugin({
+        maxChunks: 1
+      }),
+      new webpack.EnvironmentPlugin(envVars(config.env)),
+      definePlugin()
+    ]),
+    module: {
+      rules: [createBabelRules({supportLegacyBrowsers}), sassRules]
+    }
   }
-}
+}