GUACAMOLE-773: Migrate to NPM for AngularJS portion of webapp build.

This commit is contained in:
Michael Jumper
2021-04-05 14:47:04 -07:00
parent 71948a54ca
commit 1ef61687d8
426 changed files with 7086 additions and 234 deletions

View File

@@ -0,0 +1,2 @@
src/main/frontend/dist/**/*
src/main/frontend/generated/**/*

View File

@@ -80,9 +80,18 @@
<webResources>
<!-- Filter translation strings -->
<!-- Add frontend folder to war package ... -->
<resource>
<directory>src/main/webapp</directory>
<directory>src/main/frontend/dist</directory>
<excludes>
<exclude>translations/*.json</exclude>
<exclude>index.html</exclude>
</excludes>
</resource>
<!-- ... but filter index.html and translation strings -->
<resource>
<directory>src/main/frontend/dist</directory>
<filtering>true</filtering>
<includes>
<include>translations/*.json</include>
@@ -119,81 +128,43 @@
</executions>
</plugin>
<!-- Pre-cache Angular templates with maven-angular-plugin -->
<!-- Build AngularJS portion of application using NPM -->
<plugin>
<groupId>com.keithbranton.mojo</groupId>
<artifactId>angular-maven-plugin</artifactId>
<version>0.3.4</version>
<groupId>com.github.eirslett</groupId>
<artifactId>frontend-maven-plugin</artifactId>
<version>1.6</version>
<configuration>
<workingDirectory>src/main/frontend</workingDirectory>
<installDirectory>${project.build.directory}</installDirectory>
</configuration>
<executions>
<execution>
<id>install-node-and-npm</id>
<goals>
<goal>install-node-and-npm</goal>
</goals>
<configuration>
<nodeVersion>v14.16.0</nodeVersion>
</configuration>
</execution>
<execution>
<id>npm-ci</id>
<goals>
<goal>npm</goal>
</goals>
<configuration>
<arguments>ci</arguments>
</configuration>
</execution>
<execution>
<id>npm-build</id>
<phase>generate-resources</phase>
<goals>
<goal>html2js</goal>
<goal>npm</goal>
</goals>
</execution>
</executions>
<configuration>
<sourceDir>${basedir}/src/main/webapp/app/</sourceDir>
<include>**/*.html</include>
<target>${basedir}/src/main/webapp/generated/templates-main/templates.js</target>
<prefix>app</prefix>
</configuration>
</plugin>
<!-- JS/CSS Minification Plugin -->
<plugin>
<groupId>com.github.buckelieg</groupId>
<artifactId>minify-maven-plugin</artifactId>
<executions>
<execution>
<id>default-cli</id>
<configuration>
<charset>UTF-8</charset>
<webappSourceDir>${project.build.directory}/${project.build.finalName}</webappSourceDir>
<cssSourceDir>/</cssSourceDir>
<cssTargetDir>/</cssTargetDir>
<cssFinalFile>guacamole.css</cssFinalFile>
<cssSourceFiles>
<cssSourceFile>license.txt</cssSourceFile>
</cssSourceFiles>
<cssSourceIncludes>
<cssSourceInclude>app/**/*.css</cssSourceInclude>
</cssSourceIncludes>
<jsSourceDir>/</jsSourceDir>
<jsTargetDir>/</jsTargetDir>
<jsFinalFile>guacamole.js</jsFinalFile>
<jsSourceFiles>
<jsSourceFile>license.txt</jsSourceFile>
<jsSourceFile>guacamole-common-js/all.js</jsSourceFile>
</jsSourceFiles>
<jsSourceIncludes>
<jsSourceInclude>app/**/*.js</jsSourceInclude>
<jsSourceInclude>generated/**/*.js</jsSourceInclude>
</jsSourceIncludes>
<!-- Do not minify and include tests -->
<jsSourceExcludes>
<jsSourceExclude>**/*.test.js</jsSourceExclude>
</jsSourceExcludes>
<jsEngine>CLOSURE</jsEngine>
<!-- Disable warnings for JSDoc annotations -->
<closureWarningLevels>
<misplacedTypeAnnotation>OFF</misplacedTypeAnnotation>
<nonStandardJsDocs>OFF</nonStandardJsDocs>
</closureWarningLevels>
<arguments>run build</arguments>
</configuration>
<goals>
<goal>minify</goal>
</goals>
</execution>
</executions>
</plugin>
@@ -249,117 +220,6 @@
<scope>runtime</scope>
</dependency>
<!-- WebJars servlet (for serving org.webjars.* resources) -->
<dependency>
<groupId>org.webjars</groupId>
<artifactId>webjars-servlet-2.x</artifactId>
<version>1.5</version>
</dependency>
<!-- Polyfills for the Blob and FileSaver APIs -->
<dependency>
<groupId>org.webjars.bower</groupId>
<artifactId>blob-polyfill</artifactId>
<version>1.0.20150320</version>
<scope>runtime</scope>
</dependency>
<dependency>
<groupId>org.webjars.bower</groupId>
<artifactId>filesaver</artifactId>
<version>1.3.3</version>
<scope>runtime</scope>
</dependency>
<!-- Lodash -->
<dependency>
<groupId>org.webjars.bower</groupId>
<artifactId>lodash</artifactId>
<version>4.17.10</version>
<scope>runtime</scope>
</dependency>
<!-- jQuery -->
<dependency>
<groupId>org.webjars.bower</groupId>
<artifactId>jquery</artifactId>
<version>3.3.1</version>
<scope>runtime</scope>
</dependency>
<!-- AngularJS -->
<dependency>
<groupId>org.webjars.bower</groupId>
<artifactId>angular</artifactId>
<version>1.6.9</version>
<scope>runtime</scope>
</dependency>
<dependency>
<groupId>org.webjars.bower</groupId>
<artifactId>angular-route</artifactId>
<version>1.6.9</version>
<scope>runtime</scope>
</dependency>
<dependency>
<groupId>org.webjars.bower</groupId>
<artifactId>angular-touch</artifactId>
<version>1.6.9</version>
<scope>runtime</scope>
</dependency>
<!-- Shim allowing arbitrary retrieval/creation order for AngularJS modules -->
<dependency>
<groupId>org.webjars.bower</groupId>
<artifactId>angular-module-shim</artifactId>
<version>0.0.4</version>
<scope>runtime</scope>
<exclusions>
<exclusion>
<groupId>org.webjars.bower</groupId>
<artifactId>angular</artifactId>
</exclusion>
</exclusions>
</dependency>
<!-- Translation support for AngularJS -->
<dependency>
<groupId>org.webjars.bower</groupId>
<artifactId>angular-translate</artifactId>
<version>2.16.0</version>
<scope>runtime</scope>
</dependency>
<dependency>
<groupId>org.webjars.bower</groupId>
<artifactId>angular-translate-interpolation-messageformat</artifactId>
<version>2.16.0</version>
<scope>runtime</scope>
<exclusions>
<exclusion>
<groupId>org.webjars.bower</groupId>
<artifactId>messageformat</artifactId>
</exclusion>
</exclusions>
</dependency>
<dependency>
<groupId>org.webjars.bower</groupId>
<artifactId>messageformat</artifactId>
<version>1.0.2</version>
<scope>runtime</scope>
</dependency>
<dependency>
<groupId>org.webjars.bower</groupId>
<artifactId>angular-translate-loader-static-files</artifactId>
<version>2.16.0</version>
<scope>runtime</scope>
</dependency>
<!-- Polyfill for <datalist> element support -->
<dependency>
<groupId>org.webjars.npm</groupId>
<artifactId>datalist-polyfill</artifactId>
<version>1.14.0</version>
<scope>runtime</scope>
</dependency>
<!-- Jetty 8 servlet API (websocket) -->
<dependency>
<groupId>org.eclipse.jetty</groupId>
@@ -474,20 +334,6 @@
<artifactId>guava</artifactId>
</dependency>
<!-- JSTZ for TimeZone Detection -->
<dependency>
<groupId>org.webjars.npm</groupId>
<artifactId>jstz</artifactId>
<version>1.0.10</version>
</dependency>
<!-- Pickr (JavaScript color picker) -->
<dependency>
<groupId>org.webjars.npm</groupId>
<artifactId>simonwep__pickr</artifactId>
<version>1.2.6</version>
</dependency>
</dependencies>
</project>

View File

@@ -0,0 +1,4 @@
*~
node_modules
dist
generated

View File

@@ -16,3 +16,19 @@
* specific language governing permissions and limitations
* under the License.
*/
/**
* @fileoverview External APIs referenced by the source of the Guacamole webapp
* and its dependencies.
* @externs
*/
// guacamole-common-js
const Guacamole = {};
// Web Storage API
const localStorage = {};
// matchMedia() function of Window object
const matchMedia = function matchMedia(str) {}

View File

@@ -0,0 +1,105 @@
/*
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance
* with the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing,
* software distributed under the License is distributed on an
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
* KIND, either express or implied. See the License for the
* specific language governing permissions and limitations
* under the License.
*/
const angularFilesort = require('gulp-angular-filesort');
const cleanCss = require('gulp-clean-css');
const concat = require('gulp-concat');
const del = require('del');
const gulp = require('gulp');
const ngHtml2Js = require("gulp-ng-html2js");
const sourcemaps = require('gulp-sourcemaps');
const webpack = require('webpack-stream');
// Clean build files
gulp.task('clean', (callback) => del([
'dist',
'generated'
], callback));
// Build monolithic, minified CSS source
gulp.task('build-css',
() => gulp.src([
'node_modules/@simonwep/pickr/dist/themes/monolith.min.css',
'src/app/**/*.css'
])
.pipe(sourcemaps.init())
.pipe(concat('guacamole.min.css'))
.pipe(cleanCss())
.pipe(sourcemaps.write('./'))
.pipe(gulp.dest('dist'))
);
// Pre-cache AngularJS templates
gulp.task('build-template-js',
() => gulp.src('src/app/**/*.html')
.pipe(ngHtml2Js({
moduleName: 'templates-main',
prefix: 'app/'
}))
.pipe(concat('templates.js'))
.pipe(gulp.dest('generated'))
);
// Build monolithic combined JavaScript source containing all pre-cached
// templates and all AngularJS module declarations in the proper order
gulp.task('build-combined-js',
() => gulp.src([
'src/app/**/*.js',
'generated/templates.js'
])
.pipe(angularFilesort())
.pipe(sourcemaps.init())
.pipe(concat('guacamole.js'))
.pipe(sourcemaps.write('./'))
.pipe(gulp.dest('generated'))
);
// Process monolithic JavaScript source through WebPack to produce a bundle
// that contains all required dependencies
gulp.task('build-webpack-bundle',
() => gulp.src('generated/guacamole.js')
.pipe(webpack(require('./webpack.config.js')))
.pipe(gulp.dest('dist'))
);
// Build all JavaScript for the entire application
gulp.task('build-js', gulp.series(
'build-template-js',
'build-combined-js',
'build-webpack-bundle'
));
// Copy plain, static contents of application
gulp.task('copy-static',
() => gulp.src([
'src/relocateParameters.js',
'src/index.html',
'src/fonts/**/*',
'src/images/**/*',
'src/layouts/**/*',
'src/translations/**/*'
], { base: './src' })
.pipe(gulp.dest('dist'))
);
gulp.task('default', gulp.series(
'clean',
gulp.parallel('build-css', 'build-js', 'copy-static')
));

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,36 @@
{
"private": true,
"scripts": {
"build": "gulp"
},
"dependencies": {
"@simonwep/pickr": "1.2.6",
"angular": "1.6.9",
"angular-route": "1.6.9",
"angular-touch": "1.6.9",
"angular-translate": "2.16.0",
"angular-translate-interpolation-messageformat": "2.16.0",
"angular-translate-loader-static-files": "2.16.0",
"blob-polyfill": "1.0.20150320",
"datalist-polyfill": "1.14.0",
"file-saver": "1.3.3",
"jquery": "3.3.1",
"jstz": "1.0.10",
"lodash": "4.17.10",
"messageformat": "1.0.2"
},
"devDependencies": {
"closure-webpack-plugin": "^2.5.0",
"del": "^6.0.0",
"google-closure-compiler": "^20210302.0.0",
"gulp": "^4.0.2",
"gulp-angular-filesort": "^1.2.1",
"gulp-clean-css": "^4.3.0",
"gulp-concat": "^2.6.1",
"gulp-ng-html2js": "^0.2.3",
"gulp-sourcemaps": "^3.0.0",
"source-map-loader": "^1.1.3",
"webpack": "^4.46.0",
"webpack-stream": "^6.1.2"
}
}

Some files were not shown because too many files have changed in this diff Show More