catalog-ui/webpack.common.js

   1 const path = require('path');
   2 const webpack = require('webpack');
   3 const ProgressPlugin = require('webpack/lib/ProgressPlugin');
   4 const HtmlWebpackPlugin = require('html-webpack-plugin');
   5 const ExtractTextPlugin = require('extract-text-webpack-plugin');
   6 const CleanWebpackPlugin = require('clean-webpack-plugin');
   7 const autoprefixer = require('autoprefixer');
   8 const postcssUrl = require('postcss-url');
   9 const {GlobCopyWebpackPlugin, BaseHrefWebpackPlugin} = require('@angular/cli/plugins/webpack');
  10 const {CommonsChunkPlugin} = require('webpack').optimize;
  11 const {AotPlugin} = require('@ngtools/webpack');
  12 var BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
  13 const nodeModules = path.join(process.cwd(), 'node_modules');
  14
  15 const bundledScripts = [
  16     "script-loader!./node_modules/jquery/dist/jquery.min.js",
  17     "script-loader!./node_modules/lodash/lodash.min.js",
  18     "script-loader!./node_modules/angular/angular.min.js",
  19     "script-loader!./node_modules/restangular/dist/restangular.min.js",
  20     "script-loader!./node_modules/jqueryui/jquery-ui.min.js",
  21     "script-loader!./node_modules/angular-ui-router/release/angular-ui-router.min.js",
  22     "script-loader!./node_modules/angular-filter/dist/angular-filter.min.js",
  23     "script-loader!./node_modules/angular-ui-bootstrap/dist/ui-bootstrap.js",
  24     "script-loader!./node_modules/angular-ui-bootstrap/dist/ui-bootstrap-tpls.js",
  25     "script-loader!./node_modules/angular-resource/angular-resource.min.js",
  26     "script-loader!./node_modules/angular-base64/angular-base64.min.js",
  27     "script-loader!./node_modules/angular-uuid4/angular-uuid4.min.js",
  28     "script-loader!./node_modules/angular-translate/dist/angular-translate.min.js",
  29     "script-loader!./node_modules/angular-translate-loader-static-files/angular-translate-loader-static-files.min.js",
  30     "script-loader!./node_modules/angular-base64-upload/dist/angular-base64-upload.min.js",
  31     "script-loader!./node_modules/angular-ui-notification/dist/angular-ui-notification.min.js",
  32     "script-loader!./node_modules/cytoscape/dist/cytoscape.min.js",
  33     "script-loader!./node_modules/checklist-model/checklist-model.js",
  34     "script-loader!./node_modules/perfect-scrollbar/dist/js/perfect-scrollbar.jquery.min.js",
  35     "script-loader!./node_modules/qtip2/dist/jquery.qtip.min.js",
  36     "script-loader!./node_modules/@bardit/cytoscape-qtip/cytoscape-qtip.js",
  37     "script-loader!./node_modules/js-md5/build/md5.min.js",
  38     "script-loader!./node_modules/angular-clipboard/angular-clipboard.js",
  39     "script-loader!./node_modules/angular-resizable/angular-resizable.min.js",
  40     "script-loader!./node_modules/sdc-angular-dragdrop/src/angular-dragdrop.min.js",
  41     "script-loader!./node_modules/angular-tooltips/dist/angular-tooltips.min.js",
  42     "script-loader!./node_modules/angular-sanitize/angular-sanitize.min.js"
  43 ];
  44 const baseHref = undefined;
  45 const deployUrl = undefined;
  46
  47 // Arguments pass from webpack
  48 const prod = process.argv.indexOf('-p') !== -1;
  49
  50 module.exports = function(params) {
  51
  52     const webpackCommonConfig = {
  53         resolve: {
  54             extensions: [
  55                 ".ts",
  56                 ".js",
  57                 ".less"
  58             ],
  59             modules: [
  60                 "./node_modules"
  61             ],
  62             alias: {
  63                 directives: path.join(__dirname, 'app/directives/'),
  64             }
  65         },
  66         resolveLoader: {
  67             modules: [
  68                 "./node_modules"
  69             ]
  70         },
  71         entry: {
  72             'scripts/main': [ './src/main.ts' ],
  73             'scripts/polyfills': [ './src/polyfills.ts' ],
  74             'scripts/vendor': bundledScripts,
  75             'scripts/styles': [ "./src/styles.less" ]
  76         },
  77         module: {
  78             rules: [
  79                 {
  80                     enforce: "pre",
  81                     test: /\.js$/,
  82                     loader: "source-map-loader",
  83                     exclude: [ path.join(__dirname, 'node_modules') ]
  84                 },
  85                 { test: /\.json$/, loader: "json-loader" },
  86                 { test: /\.html$/, loader: "html-loader" },
  87                 {
  88                     exclude: [ path.join(process.cwd(), "src/styles.less") ],
  89                     test: /\.css$/,
  90                     loaders: [
  91                         "exports-loader?module.exports.toString()",
  92                         "css-loader?{\"sourceMap\":false,\"importLoaders\":1}",
  93                         "postcss-loader"
  94                     ]
  95                 },
  96                 {
  97                     exclude: [ path.join(process.cwd(), "src/styles.less") ],
  98                     test: /\.scss$|\.sass$/,
  99                     loaders: [
 100                         "exports-loader?module.exports.toString()",
 101                         "css-loader?{\"sourceMap\":false,\"importLoaders\":1}",
 102                         "postcss-loader",
 103                         "sass-loader"
 104                     ]
 105                 },
 106                 {
 107                     exclude: [ path.join(process.cwd(), "src/styles.less") ],
 108                     test: /\.less$/,
 109                     loaders: [
 110                         "exports-loader?module.exports.toString()",
 111                         "css-loader?{\"sourceMap\":false,\"importLoaders\":1}",
 112                         "postcss-loader",
 113                         "less-loader"
 114                     ]
 115                 },
 116                 {
 117                     exclude: [ path.join(process.cwd(), "src/styles.less") ],
 118                     test: /\.styl$/,
 119                     loaders: [
 120                         "exports-loader?module.exports.toString()",
 121                         "css-loader?{\"sourceMap\":false,\"importLoaders\":1}",
 122                         "postcss-loader",
 123                         "stylus-loader?{\"sourceMap\":false,\"paths\":[]}"
 124                     ]
 125                 },
 126                 {
 127                     include: [ path.join(process.cwd(), "src/styles.less") ],
 128                     test: /\.css$/,
 129                     loaders: ExtractTextPlugin.extract({
 130                         use: [
 131                             "css-loader?{\"sourceMap\":false,\"importLoaders\":1}",
 132                             "postcss-loader"
 133                         ],
 134                         fallback: "style-loader",
 135                         publicPath: ""
 136                     })
 137                 },
 138                 {
 139                     include: [ path.join(process.cwd(), "src/styles.less") ],
 140                     test: /\.scss$|\.sass$/,
 141                     loaders: ExtractTextPlugin.extract({
 142                         use: [
 143                             "css-loader?{\"sourceMap\":false,\"importLoaders\":1}",
 144                             "postcss-loader",
 145                             "sass-loader"
 146                         ],
 147                         fallback: "style-loader",
 148                         publicPath: ""
 149                     })
 150                 },
 151                 {
 152                     include: [ path.join(process.cwd(), "src/styles.less") ],
 153                     test: /\.less$/,
 154                     loaders: ExtractTextPlugin.extract({
 155                         use: [
 156                             "css-loader?{\"sourceMap\":false,\"importLoaders\":1}",
 157                             "postcss-loader",
 158                             "less-loader"
 159                         ],
 160                         fallback: "style-loader",
 161                         publicPath: ""
 162                     })
 163                 },
 164                 {
 165                     include: [ path.join(process.cwd(), "src/styles.less") ],
 166                     test: /\.styl$/,
 167                     loaders: ExtractTextPlugin.extract({
 168                         use: [
 169                             "css-loader?{\"sourceMap\":false,\"importLoaders\":1}",
 170                             "postcss-loader",
 171                             "stylus-loader?{\"sourceMap\":false,\"paths\":[]}"
 172                         ],
 173                         fallback: "style-loader",
 174                         publicPath: ""
 175                     })
 176                 },
 177                 { test: /\.ts$/, loader: "@ngtools/webpack" }
 178             ]
 179         },
 180         plugins: [
 181             new CleanWebpackPlugin(['dist', 'build'], {
 182                 root: path.join(__dirname, ''),
 183                 verbose: true,
 184                 dry: false,
 185                 exclude: ['shared.js']
 186             }),
 187             new webpack.LoaderOptionsPlugin({
 188                 debug: false
 189             }),
 190             new webpack.DefinePlugin({
 191                 process: {
 192                     env: {
 193                         sdcConfig: prod? '"production"': '"development"'
 194                     }
 195                 }
 196             }),
 197             new webpack.NoEmitOnErrorsPlugin(),
 198             new ProgressPlugin(),
 199             // new BundleAnalyzerPlugin(),
 200             // new HtmlWebpackPlugin({
 201             //     template: "./src/index.html",
 202             //     filename: "./index.html",
 203             //     hash: false,
 204             //     inject: true,
 205             //     compile: true,
 206             //     favicon: false,
 207             //     minify: false,
 208             //     cache: true,
 209             //     showErrors: true,
 210             //     chunks: "all",
 211             //     excludeChunks: [],
 212             //     title: "Webpack App",
 213             //     xhtml: true,
 214             //     chunksSortMode: function sort(left, right) {
 215             //         let paramsString = params.entryPoints + '';
 216             //         let leftString = left.names[0].replace('scripts/','');
 217             //         let rightString = right.names[0].replace('scripts/','');
 218             //         let leftIndex = paramsString.indexOf(leftString);
 219             //         let rightindex = paramsString.indexOf(rightString);
 220             //         //console.log("left: " + leftString + " | leftIndex: " + leftIndex);
 221             //         //console.log("right: " + rightString + " | rightindex: " + rightindex);
 222             //         //console.log("result: " + leftIndex-rightindex);
 223             //         //console.log("----------------------------------------");
 224             //         return leftIndex-rightindex;
 225             //     }
 226             // }),
 227             new GlobCopyWebpackPlugin({
 228                 patterns: [
 229                     "assets/preloading.css",
 230                     "assets/languages",
 231                     "assets/styles/fonts",
 232                     "assets/styles/images",
 233                     "assets/styles/app.css"
 234                 ],
 235                 globOptions: {
 236                     cwd: path.join(process.cwd(), "src"),
 237                     dot: true,
 238                     ignore: "**/.gitkeep"
 239                 }
 240             }),
 241             new GlobCopyWebpackPlugin({
 242                 patterns: [
 243                     "configurations"
 244                 ],
 245                 globOptions: {
 246                     cwd: path.join(process.cwd(), ""),
 247                     dot: true,
 248                     ignore: "**/.gitkeep"
 249                 }
 250             }),
 251             new BaseHrefWebpackPlugin({}),
 252             new CommonsChunkPlugin({
 253                 name: "scripts/inline",
 254                 minChunks: null
 255             }),
 256             new CommonsChunkPlugin({
 257                 name: "scripts/vendor",
 258                 minChunks: (module) => module.resource && module.resource.startsWith(nodeModules),
 259                 chunks: [
 260                     "main"
 261                 ]
 262             }),
 263             new ExtractTextPlugin({
 264                 filename: "[name].bundle.css",
 265                 disable: true
 266             }),
 267             new webpack.LoaderOptionsPlugin({
 268                 sourceMap: false,
 269                 options: {
 270                     postcss: [
 271                         autoprefixer(),
 272                         postcssUrl({
 273                             url: (URL) => {
 274                                 // Only convert absolute URLs, which CSS-Loader won't process into require().
 275                                 if (!URL.startsWith('/')) {
 276                                     return URL;
 277                                 }
 278                                 // Join together base-href, deploy-url and the original URL.
 279                                 // Also dedupe multiple slashes into single ones.
 280                                 return `/${baseHref || ''}/${deployUrl || ''}/${URL}`.replace(/\/\/+/g, '/');
 281                             }
 282                         })
 283                     ],
 284                     sassLoader: {
 285                         sourceMap: false,
 286                         includePaths: []
 287                     },
 288                     lessLoader: {
 289                         sourceMap: false
 290                     },
 291                     context: ""
 292                 }
 293             }),
 294             new AotPlugin({
 295                 mainPath: "main.ts",
 296                 exclude: [    "**/*.spec.ts" ],
 297                 tsConfigPath: "src/tsconfig.json",
 298                 skipCodeGeneration: true
 299             })
 300         ],
 301         node: {
 302             fs: "empty",
 303             global: true,
 304             crypto: "empty",
 305             tls: "empty",
 306             net: "empty",
 307             process: true,
 308             module: false,
 309             clearImmediate: false,
 310             setImmediate: false
 311         }
 312     }
 313
 314     return webpackCommonConfig;
 315 }