From 5dcc5a785843699c8f6034074fdf2c6f3201fb8c Mon Sep 17 00:00:00 2001 From: Vladislav Ganev Date: Mon, 13 Nov 2023 15:24:02 +0200 Subject: [PATCH] IAC-796 Upgrade VCD archetype to support Angular 15 Signed-off-by: Vladislav Ganev --- CHANGELOG.md | 2 + .../META-INF/maven/archetype-metadata.xml | 15 +- .../resources/archetype-resources/.gitignore | 3 + .../archetype-resources/angular.json | 75 ++++++ .../archetype-resources/package.json | 101 +++----- .../archetype-resources/postcss.config.js | 48 ---- .../scripts/build-process.ts | 30 +++ .../src/main/__projectName__.main.ts | 1 + .../src/main/__projectName__.module.ts | 29 ++- .../archetype-resources/src/main/index.html | 0 .../archetype-resources/src/main/index.ts | 1 - .../src/main/services/sample.service.ts | 3 +- .../src/public/manifest.json | 4 +- .../archetype-resources/tsconfig.json | 39 ++- .../archetype-resources/webpack.config.js | 222 ------------------ 15 files changed, 195 insertions(+), 378 deletions(-) create mode 100644 maven/archetypes/vcd-ng/src/main/resources/archetype-resources/angular.json delete mode 100644 maven/archetypes/vcd-ng/src/main/resources/archetype-resources/postcss.config.js create mode 100644 maven/archetypes/vcd-ng/src/main/resources/archetype-resources/scripts/build-process.ts create mode 100644 maven/archetypes/vcd-ng/src/main/resources/archetype-resources/src/main/__projectName__.main.ts create mode 100644 maven/archetypes/vcd-ng/src/main/resources/archetype-resources/src/main/index.html delete mode 100644 maven/archetypes/vcd-ng/src/main/resources/archetype-resources/src/main/index.ts delete mode 100644 maven/archetypes/vcd-ng/src/main/resources/archetype-resources/webpack.config.js diff --git a/CHANGELOG.md b/CHANGELOG.md index 886781049..f416df6cc 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,5 @@ +* [artifact-manager] IAC-796 / Upgrade VCD archetype to support Angular 15 + ## v2.35.2 ### Enhancements * [artifact-manager] IAC-786 / Set Aria Operations Default Policy vROPs 8.12.x. diff --git a/maven/archetypes/vcd-ng/src/main/resources/META-INF/maven/archetype-metadata.xml b/maven/archetypes/vcd-ng/src/main/resources/META-INF/maven/archetype-metadata.xml index 024cc3824..0334109d2 100644 --- a/maven/archetypes/vcd-ng/src/main/resources/META-INF/maven/archetype-metadata.xml +++ b/maven/archetypes/vcd-ng/src/main/resources/META-INF/maven/archetype-metadata.xml @@ -38,25 +38,26 @@ pom.xml package.json + angular.json - + - libs + src **/* - src + license_data **/* - - - license_data + + + scripts **/* - + diff --git a/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/.gitignore b/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/.gitignore index fc5b4f84d..513097ff3 100644 --- a/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/.gitignore +++ b/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/.gitignore @@ -47,3 +47,6 @@ Thumbs.db # awesome-typescript-loader cache .awcache/ + +# angular files +.angular diff --git a/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/angular.json b/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/angular.json new file mode 100644 index 000000000..5ec5aace6 --- /dev/null +++ b/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/angular.json @@ -0,0 +1,75 @@ +{ + "$schema": "./node_modules/@angular/cli/lib/config/schema.json", + "version": 1, + "newProjectRoot": "projects", + "projects": { + "uiPlugin": { + "projectType": "library", + "root": "", + "sourceRoot": "src", + "prefix": "lib", + "architect": { + "build": { + "builder": "@vcd/plugin-builders:plugin-builder", + "options": { + "modulePath": "src/main/${projectName}.module.ts#${projectHeading}Module", + "outputPath": "target/bundle", + "index": "src/main/index.html", + "main": "src/main/${projectName}.main.ts", + "tsConfig": "tsconfig.json", + "assets": [{ + "glob": "**/*", + "input": "./src/public", + "output": "/" + }], + "optimization": false, + "outputHashing": "all", + "sourceMap": false, + "extractCss": false, + "namedChunks": false, + "aot": false, + "extractLicenses": false, + "vendorChunk": false, + "buildOptimizer": false + } + }, + "serve": { + "builder": "@angular-devkit/build-angular:dev-server", + "options": { + "browserTarget": "uiPlugin:build", + "proxyConfig": ".env/proxy.conf.runtime.json" + }, + "configurations": { + "production": { + "browserTarget": "uiPlugin:build:production" + } + } + }, + "test": { + "builder": "@angular-devkit/build-angular:karma", + "options": { + "main": "src/test.ts", + "tsConfig": "tsconfig.spec.json", + "karmaConfig": "karma.conf.js" + } + }, + "lint": { + "builder": "@angular-devkit/build-angular:tslint", + "options": { + "tsConfig": [ + "tsconfig.lib.json", + "tsconfig.spec.json" + ], + "exclude": [ + "**/node_modules/**" + ] + } + } + } + } + }, + "defaultProject": "uiPlugin", + "cli": { + "analytics": false + } +} diff --git a/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/package.json b/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/package.json index e41f65749..81259197f 100644 --- a/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/package.json +++ b/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/package.json @@ -1,68 +1,37 @@ { - "name": "${projectHeading}", - "version": "1.0.0", - "description": "", - "scripts": { - "clean": "rimraf target", - "build": "webpack" - }, - "license": "VMware Confidential", - "dependencies": { - "@angular-devkit/core": "8.3.19", - "@angular-devkit/schematics": "8.3.19", - "@angular/animations": "8.2.8", - "@angular/common": "8.2.8", - "@angular/core": "8.2.8", - "@angular/forms": "8.2.8", - "@angular/http": "7.2.15", - "@angular/platform-browser": "8.2.8", - "@angular/platform-browser-dynamic": "8.2.8", - "@angular/router": "8.2.8", - "@clr/angular": "2.3.8", - "@clr/icons": "2.3.8", - "@clr/ui": "2.3.8", - "@ngrx/core": "1.2.0", - "@ngrx/effects": "6.0.1", - "@ngrx/store": "6.0.1", - "@vcd/bindings": "9.1.1", - "@vcd/sdk": "0.11.0", - "@webcomponents/custom-elements": "1.2.1", - "core-js": "2.5.1", - "es6-shim": "0.35.3", - "mutationobserver-shim": "0.3.2", - "reflect-metadata": "0.1.10", - "reselect": "3.0.0", - "rxjs": "6.5.3", - "rxjs-compat": "6.5.3", - "web-animations-js": "2.3.1", - "zone.js": "0.10.2" - }, - "devDependencies": { - "@types/jasmine": "2.5.47", - "@types/node": "14.0.1", - "angular2-template-loader": "0.6.2", - "autoprefixer": "9.3.1", - "awesome-typescript-loader": "5.2.1", - "copy-webpack-plugin": "5.0.3", - "css-loader": "1.0.0", - "cssnano": "4.1.10", - "exports-loader": "0.7.0", - "fast-xml-parser": "3.16.0", - "file-loader": "2.0.0", - "fs-extra": "9.0.0", - "happypack": "5.0.0", - "node-sass": "4.14.1", - "postcss": "7.0.5", - "postcss-loader": "3.0.0", - "postcss-url": "8.0.0", - "raw-loader": "0.5.1", - "rimraf": "2.6.1", - "sass-loader": "7.1.0", - "tslint": "4.5.1", - "typescript": "3.9.2", - "webpack": "4.22.0", - "webpack-cli": "3.1.2", - "webpack-sources": "1.4.3", - "zip-webpack-plugin": "3.0.0" - } + "name": "${projectHeading}", + "version": "1.0.0", + "description": "", + "scripts": { + "clean": "rimraf target", + "build": "ng build", + "prebuild": "node scripts/build-process.ts prebuild", + "postbuild": "node scripts/build-process.ts postbuild" + }, + "license": "VMware Confidential", + "dependencies": { + "@angular/animations": "15.2.0", + "@angular/common": "15.2.0", + "@angular/compiler": "15.2.0", + "@angular/core": "15.2.0", + "@angular/forms": "15.2.0", + "@angular/platform-browser": "15.2.0", + "@angular/platform-browser-dynamic": "15.2.0", + "@angular/router": "15.2.0", + "@cds/core": "6.3.1", + "@clr/angular": "15.0.3", + "@clr/ui": "15.0.3", + "@vcd/bindings": "9.1.1", + "@vcd/i18n": "12.0.0", + "@vcd/plugin-builders": "15.0.1", + "@vcd/sdk": "15.0.2", + "rxjs": "7.8.0", + "tslib": "2.3.0", + "zone.js": "0.12.0" + }, + "devDependencies": { + "@angular/cli": "15.2.3", + "fast-xml-parser": "4.3.2", + "typescript": "4.9.4" + } } diff --git a/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/postcss.config.js b/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/postcss.config.js deleted file mode 100644 index c31cef9ce..000000000 --- a/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/postcss.config.js +++ /dev/null @@ -1,48 +0,0 @@ -// This is the configuration that AngularJS uses for PostCSS. It has to be a separate file because -// HappyPack only supports separate config files for that particular plugin. - -const autoprefixer = require('autoprefixer'); -const postcssUrl = require('postcss-url'); -const cssnano = require('cssnano'); - -const minimizeCss = false; - -const postcssPlugins = function () { - // safe settings based on: https://github.com/ben-eb/cssnano/issues/358#issuecomment-283696193 - const importantCommentRe = /@preserve|@license|[@#]\s*source(?:Mapping)?URL|^!/i; - const minimizeOptions = { - autoprefixer: false, - safe: true, - mergeLonghand: false, - discardComments: {remove: (comment) => !importantCommentRe.test(comment)} - }; - return [ - postcssUrl({ - url: (URL) => { - // Only convert root relative URLs, which CSS-Loader won't process into require(). - if (!URL.startsWith('/') || URL.startsWith('//')) { - return URL; - } - if (deployUrl.match(/:\/\//)) { - // If deployUrl contains a scheme, ignore baseHref use deployUrl as is. - return `${deployUrl.replace(/\/$/, '')}${URL}`; - } - else if (baseHref.match(/:\/\//)) { - // If baseHref contains a scheme, include it as is. - return baseHref.replace(/\/$/, '') + - `/${deployUrl}/${URL}`.replace(/\/\/+/g, '/'); - } - else { - // Join together base-href, deploy-url and the original URL. - // Also dedupe multiple slashes into single ones. - return `/${baseHref}/${deployUrl}/${URL}`.replace(/\/\/+/g, '/'); - } - } - }), - autoprefixer(), - ].concat(minimizeCss ? [cssnano(minimizeOptions)] : []); -}; - -module.exports = { - plugins: postcssPlugins -}; diff --git a/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/scripts/build-process.ts b/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/scripts/build-process.ts new file mode 100644 index 000000000..7360f17f2 --- /dev/null +++ b/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/scripts/build-process.ts @@ -0,0 +1,30 @@ +const fs = require("fs"); +const { XMLParser } = require("fast-xml-parser"); + +const manifestFile = "src/public/manifest.json"; +const cycle = process.argv[2]; +if (cycle === "prebuild") { + fs.copyFileSync(manifestFile, `${manifestFile}.temp`); + const parser = new XMLParser(); + const pomJson = parser.parse(fs.readFileSync("pom.xml").toString().replace(/\r|\n/g, "")); + + let manifestContent = fs.readFileSync(manifestFile).toString(); + manifestContent = manifestContent.replace("VERSION_PLACEHOLDER", pomJson.project.version); + manifestContent = manifestContent.replace( + "NAME_PLACEHOLDER", + `${pomJson.project.groupId}.${pomJson.project.artifactId}` + ); + manifestContent = manifestContent.replace( + "URN_PLACEHOLDER", + `${pomJson.project.groupId}.${pomJson.project.artifactId}`.replace(/\./g, ":") + ); + + fs.writeFileSync(manifestFile, manifestContent); +} else if (cycle === "postbuild") { + fs.copyFileSync(`${manifestFile}.temp`, manifestFile); + fs.rmSync(`${manifestFile}.temp`, { + force: true + }); +} else { + console.log("Unknown argument"); +} diff --git a/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/src/main/__projectName__.main.ts b/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/src/main/__projectName__.main.ts new file mode 100644 index 000000000..fbb0dae88 --- /dev/null +++ b/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/src/main/__projectName__.main.ts @@ -0,0 +1 @@ +export * from 'src/main/${projectName}.module'; diff --git a/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/src/main/__projectName__.module.ts b/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/src/main/__projectName__.module.ts index 85b74347f..5635d0b6e 100644 --- a/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/src/main/__projectName__.module.ts +++ b/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/src/main/__projectName__.module.ts @@ -1,17 +1,21 @@ import { CommonModule } from "@angular/common"; import { Inject, NgModule } from "@angular/core"; import { Routes, RouterModule } from "@angular/router"; -import { HttpModule } from "@angular/http"; import { FormsModule } from "@angular/forms"; import { HttpClientModule } from "@angular/common/http"; -import { ClarityModule } from "clarity-angular"; import { Store } from "@ngrx/store"; -import { EXTENSION_ROUTE, ExtensionNavRegistration } from "@vcd/sdk/common"; -import { VcdApiClient, VcdSdkModule } from "@vcd/sdk"; -import { PluginModule } from "@vcd/sdk/core"; -import { TranslateService } from "@vcd/sdk/i18n"; +import { + EXTENSION_ASSET_URL, + VcdApiClient, + VcdSdkModule, + EXTENSION_ROUTE, + ExtensionNavRegistration, + PluginModule +} from "@vcd/sdk"; +import { ClarityModule } from "@clr/angular"; import { ${projectHeading}Component } from "./${projectName}.component"; import { SampleService } from "./services/sample.service"; +import { I18nModule, TranslationService } from "@vcd/i18n"; const ROUTES: Routes = [ { @@ -24,7 +28,8 @@ const ROUTES: Routes = [ imports: [ ClarityModule, CommonModule, - HttpModule, + I18nModule.forChild(EXTENSION_ASSET_URL, true), + VcdSdkModule.forRoot(), FormsModule, HttpClientModule, VcdSdkModule, @@ -41,8 +46,12 @@ const ROUTES: Routes = [ ], }) export class ${projectHeading}Module extends PluginModule { - constructor(appStore: Store, @Inject(EXTENSION_ROUTE) extensionRoute: string, translate: TranslateService) { - super(appStore, translate); + constructor( + appStore: Store, + @Inject(EXTENSION_ROUTE) extensionRoute: string, + translationService: TranslationService + ) { + super(appStore); let registrations: ExtensionNavRegistration[] = [ { @@ -51,7 +60,7 @@ export class ${projectHeading}Module extends PluginModule { descriptionCode: "${projectName}.nav.description" } ]; - + translationService.registerTranslations(); registrations.forEach(registration => this.registerExtension(registration)); } } diff --git a/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/src/main/index.html b/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/src/main/index.html new file mode 100644 index 000000000..e69de29bb diff --git a/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/src/main/index.ts b/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/src/main/index.ts deleted file mode 100644 index b05277717..000000000 --- a/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/src/main/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { ${projectHeading}Module } from "./${projectName}.module"; diff --git a/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/src/main/services/sample.service.ts b/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/src/main/services/sample.service.ts index f092822ae..f99b2eac8 100644 --- a/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/src/main/services/sample.service.ts +++ b/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/src/main/services/sample.service.ts @@ -1,6 +1,5 @@ import { Injectable, Inject } from "@angular/core"; -import { VcdApiClient } from "@vcd/sdk"; -import { SESSION_ORGANIZATION } from "@vcd/sdk/common"; +import { VcdApiClient, SESSION_ORGANIZATION } from "@vcd/sdk"; import { SampleMember } from "../model/sample-member"; @Injectable() diff --git a/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/src/public/manifest.json b/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/src/public/manifest.json index ad7ad494d..b25b34c3f 100644 --- a/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/src/public/manifest.json +++ b/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/src/public/manifest.json @@ -1,6 +1,6 @@ { - "urn": "vmware:vcloud:${projectName}", - "name": "${groupId}.${artifactId}", + "urn": "URN_PLACEHOLDER", + "name": "NAME_PLACEHOLDER", "containerVersion": "10.0.0", "version": "VERSION_PLACEHOLDER", "scope": ["tenant","service-provider"], diff --git a/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/tsconfig.json b/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/tsconfig.json index 3d8c4efe4..d9730cf0e 100644 --- a/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/tsconfig.json +++ b/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/tsconfig.json @@ -1,22 +1,21 @@ { - "compileOnSave": true, - "compilerOptions": { - "target": "es5", - "module": "es2015", - "moduleResolution": "node", - "lib": ["es2015", "dom"], - "sourceMap": true, - "emitDecoratorMetadata": true, - "experimentalDecorators": true, - "removeComments": false, - "noImplicitAny": true, - "suppressImplicitAnyIndexErrors": true, - "typeRoots": [ - "./node_modules/@types" - ] - }, - "exclude": [ - "node_modules", - "target" - ] + "compileOnSave": true, + "compilerOptions": { + "target": "ES2022", + "module": "esnext", + "moduleResolution": "node", + "lib": ["ES2022", "dom"], + "sourceMap": true, + "declaration": false, + "emitDecoratorMetadata": true, + "experimentalDecorators": true, + "removeComments": false, + "noImplicitAny": true, + "resolveJsonModule": true, + "allowSyntheticDefaultImports": true, + "skipLibCheck": true, + "typeRoots": ["./node_modules/@types"], + "baseUrl": "./" + }, + "exclude": ["node_modules", "target"] } diff --git a/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/webpack.config.js b/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/webpack.config.js deleted file mode 100644 index d48fce50e..000000000 --- a/maven/archetypes/vcd-ng/src/main/resources/archetype-resources/webpack.config.js +++ /dev/null @@ -1,222 +0,0 @@ -// This is the webpack configuration used for creating plugins. -const webpack = require("webpack"); -const path = require("path"); -const fs = require("fs-extra"); -const xmlParser = require("fast-xml-parser"); -const wps = require('webpack-sources'); -const CopyWebpackPlugin = require('copy-webpack-plugin'); -const Happypack = require('happypack'); -const UglifyJSPlugin = require('uglifyjs-webpack-plugin'); -const ZipPlugin = require('zip-webpack-plugin'); - -// All paths are relative to the `webpack.config.js` directory -const basePath = path.resolve(__dirname); -const outPath = path.join(basePath, "target", "bundle"); - -class VcdPluginVersion { - apply(compiler) { - compiler.hooks.emit.tapAsync(VcdPluginVersion.name, - (compilation, callback) => { - if (!compilation.compiler.isChild()) { - const pomJson = xmlParser.parse(fs.readFileSync("pom.xml").toString()); - let manifestContent = compilation.assets["manifest.json"].source().toString(); - manifestContent = manifestContent.replace("VERSION_PLACEHOLDER", pomJson.project.version); - compilation.assets["manifest.json"] = new wps.RawSource(manifestContent); - } - callback(); - } - ); - } -} - -// Create the configuration for the dev-server -module.exports = { - // Enable webpack cache. Not sure what this does, but it's free. - cache: true, - - // Default to production mode. This is the default anyway, so it - // just gets rid of a build-time warning - mode: 'production', - - // Ensure everything is completely relative to the `content/core` directory. - context: basePath, - - // Use the 'source-map' plugin if source-maps are enabled - devtool: 'source-map', - - // Write all output to `dist/[name].js` as an AMD library - output: { - filename: "[name].js", - libraryTarget: "amd", - path: outPath - }, - - // Create 'bundle.js' from 'src/main/index.ts' - entry: { - bundle: path.resolve(basePath, "src", "main", "index.ts") - }, - - // Declare everything the container provides as external. - // Because this is an AMD bundle, they will be resolved via AMD. - externals: [ - /^rxjs(\/.+)?$/, - /^@angular\/.+$/, - /^@clr\/.+$/, - /^@ngrx\/.+$/, - /^@vcd\/common$/, - /^@vcd-ui\/common$/, - { - 'clarity-angular': 'clarity-angular', - 'reselect': 'reselect' - } - ], - - // Resolve typescript first, then Javascript. - resolve: { - extensions: [".ts", ".js"] - }, - - module: { - rules: [ - { - sideEffects: false - }, - // Build typescript files using a cache (really useful for subsequent builds). - // Use the `tsconfig.json` settings. - // - // TS files are pre-processed by the `angular2-template-loader` which will inline - // HTML and CSS for components. - { - test: /\.ts$/, - loaders: [ - { - loader: "awesome-typescript-loader", - options: { - useCache: true, - configFileName: path.join(basePath, "tsconfig.json") - } - }, - "angular2-template-loader" - ] - }, - - // Delegate CSS to Happypack. See plugins section. - { - test: /\.css$/, - use: 'happypack/loader?id=css' - }, - - // Delegate SCSS to Happypack. See plugins section. - { - test: /\.scss$|\.sass$/, - use: 'happypack/loader?id=scss' - }, - - // HTML files will become raw strings. - { - test: /\.html$/, - loaders: ["raw-loader"] - }, - - // Fonts encountered by CSS will become files distributed with the project - { - test: /\.(ttf|eot|svg|woff|woff2)$/, - loader: "file-loader?name=fonts/[name].[ext]" - } - ] - }, - - plugins: [ - // CSS happypack plugin. Happypack multithreads the specified loader chain. - new Happypack({ - id: "css", - - // Apply PostCSS (using an external config - HappyPack requires this) to any CSS file, - // load it using the css-loader (which is a bit smarter than raw files), before - // converting it to a string for inclusion in the components directly. - loaders: [ - "exports-loader?module.exports.toString()", - { - loader: "css-loader", - options: { - sourceMap: true, - importLoaders: 1 - } - }, - { - loader: "postcss-loader", - options: { - ident: "postcss", - config: { - path: path.join(basePath, "postcss.config.js") - } - } - } - ] - }), - - // SCSS happypack plugin. Happypack multithreads the specified loader chain. - new Happypack({ - id: "scss", - - // Apply SASS compiling, then feed the resulting CSS into PostCSS (using an - // external config - HappyPack requires this) to any SCSS/SASS file. - // Then load this output CSS using the css-loader (which is a bit smarter than raw files), - // before converting it to a string for inclusion in the components directly. - loaders: [ - "exports-loader?module.exports.toString()", - { - loader: "css-loader", - options: { - sourceMap: true, - importLoaders: 1 - } - }, - { - loader: "postcss-loader", - options: { - ident: "postcss", - config: { - path: path.join(basePath, "postcss.config.js") - } - } - }, - { - loader: "sass-loader", - options: { - sourceMap: true, - precision: 8, - includePaths: [] - } - } - ] - }), - - // Needed for setting correct context. This is magic that is required by Angular. - new webpack.ContextReplacementPlugin( - /angular(\\|\/)core(\\|\/)@angular/, - path.join(basePath, "src") - ), - - // Skip the emitting phase whenever there are errors while compiling. - new webpack.NoEmitOnErrorsPlugin(), - - // Show progress. - new webpack.ProgressPlugin(), - - new CopyWebpackPlugin([{ from: 'src/public' }]), - new VcdPluginVersion(), - new ZipPlugin({ filename: 'plugin.zip' }), - ], - - // Configure minimizer to not interfere with DI as much as possible - optimization: { - minimizer: [ - new UglifyJSPlugin({ - uglifyOptions: { - keep_fnames: true - } - }) - ] - } -}