JHipster Docker Build with UI Grid不显示字体

时间:2016-10-01 06:53:16

标签: angularjs gulp angular-ui-grid jhipster

我正在使用JHipster 3.8与UI-Grid,即ui-grid.info,当我在本地运行应用程序时,其工作正常。但是当我使用此命令部署到Docker

./gradlew bootRepackage -Pprod buildDocker

docker-compose -f src/main/docker/app.yml up

我可以在开发者控制台中看到以下关于字体的错误

generated.js:174220 GET http://192.168.99.100:8585/content/css/ui-grid-f53764c7a4.woff
GET http://192.168.99.100:8585/content/css/ui-grid-c6fa199a3e.ttf 

并且页面显示一些字符而不是图标如下: - enter image description here

我为UI Grid link1 link2提供了几个解决方案,但它对我不起作用,因为根据错误文件的名称和位置不同,为gulp做出这样的改变。

不确定如何解决此问题。有人可以一次指导我吗?

修改

我的Gulp文件: -

// Generated on 2016-09-20 using generator-jhipster 3.7.1
'use strict';

var gulp = require('gulp'),
    expect = require('gulp-expect-file'),
    es = require('event-stream'),
    flatten = require('gulp-flatten'),
    sass = require('gulp-sass'),
    rev = require('gulp-rev'),
    templateCache = require('gulp-angular-templatecache'),
    htmlmin = require('gulp-htmlmin'),
    imagemin = require('gulp-imagemin'),
    ngConstant = require('gulp-ng-constant'),
    rename = require('gulp-rename'),
    eslint = require('gulp-eslint'),
    argv = require('yargs').argv,
    gutil = require('gulp-util'),
    protractor = require('gulp-protractor').protractor,
    del = require('del'),
    runSequence = require('run-sequence'),
    browserSync = require('browser-sync'),
    KarmaServer = require('karma').Server,
    plumber = require('gulp-plumber'),
    changed = require('gulp-changed'),
    gulpIf = require('gulp-if');

var handleErrors = require('./gulp/handle-errors'),
    serve = require('./gulp/serve'),
    util = require('./gulp/utils'),
    copy = require('./gulp/copy'),
    inject = require('./gulp/inject'),
    build = require('./gulp/build');

var config = require('./gulp/config');

gulp.task('clean', function () {
    return del([config.dist], { dot: true });
});

gulp.task('copy', ['copy:i18n', 'copy:fonts', 'copy:common']);

gulp.task('copy:i18n', copy.i18n);

gulp.task('copy:languages', copy.languages);

gulp.task('copy:fonts', copy.fonts);

gulp.task('copy:common', copy.common);

gulp.task('copy:swagger', copy.swagger);

gulp.task('copy:images', copy.images);

gulp.task('images', function () {
    return gulp.src(config.app + 'content/images/**')
        .pipe(plumber({errorHandler: handleErrors}))
        .pipe(changed(config.dist + 'content/images'))
        .pipe(imagemin({optimizationLevel: 5, progressive: true, interlaced: true}))
        .pipe(rev())
        .pipe(gulp.dest(config.dist + 'content/images'))
        .pipe(rev.manifest(config.revManifest, {
            base: config.dist,
            merge: true
        }))
        .pipe(gulp.dest(config.dist))
        .pipe(browserSync.reload({stream: true}));
});

gulp.task('sass', function () {
    return es.merge(
        gulp.src(config.sassSrc)
        .pipe(plumber({errorHandler: handleErrors}))
        .pipe(expect(config.sassSrc))
        .pipe(changed(config.cssDir, {extension: '.css'}))
        .pipe(sass({includePaths:config.bower}).on('error', sass.logError))
        .pipe(gulp.dest(config.cssDir)),
        gulp.src(config.bower + '**/fonts/**/*.{woff,woff2,svg,ttf,eot,otf}')
        .pipe(plumber({errorHandler: handleErrors}))
        .pipe(changed(config.app + 'content/fonts'))
        .pipe(flatten())
        .pipe(gulp.dest(config.app + 'content/fonts'))
    );
});

gulp.task('copyAngularUiGridFonts', function() {
       gulp.src(config.app + '/bower_components/angular-ui-grid/*.{ttf,woff,eof,svg}')
       .pipe(gulp.dest(config.dist + 'content/css/'));
    });

gulp.task('styles', ['sass'], function () {
    return gulp.src(config.app + 'content/css')
        .pipe(browserSync.reload({stream: true}));
});

gulp.task('inject', function() {
    runSequence('inject:dep', 'inject:app');
});

gulp.task('inject:dep', ['inject:test', 'inject:vendor']);

gulp.task('inject:app', inject.app);

gulp.task('inject:vendor', inject.vendor);

gulp.task('inject:test', inject.test);

gulp.task('inject:troubleshoot', inject.troubleshoot);

gulp.task('assets:prod', ['images', 'styles', 'html', 'copy:swagger', 'copy:images'], build);

gulp.task('html', function () {
    return gulp.src(config.app + 'app/**/*.html')
        .pipe(htmlmin({collapseWhitespace: true}))
        .pipe(templateCache({
            module: 'dashboardApp',
            root: 'app/',
            moduleSystem: 'IIFE'
        }))
        .pipe(gulp.dest(config.tmp));
});

gulp.task('ngconstant:dev', function () {
    return ngConstant({
        name: 'dashboardApp',
        constants: {
            VERSION: util.parseVersion(),
            DEBUG_INFO_ENABLED: true
        },
        template: config.constantTemplate,
        stream: true
    })
    .pipe(rename('app.constants.js'))
    .pipe(gulp.dest(config.app + 'app/'));
});

gulp.task('ngconstant:prod', function () {
    return ngConstant({
        name: 'dashboardApp',
        constants: {
            VERSION: util.parseVersion(),
            DEBUG_INFO_ENABLED: false
        },
        template: config.constantTemplate,
        stream: true
    })
    .pipe(rename('app.constants.js'))
    .pipe(gulp.dest(config.app + 'app/'));
});

/*gulp.task('fonts:prod', function () {
    return gulp.src($.mainBowerFiles())
      .pipe($.filter(config.bower + 'angular-ui-grid/*.{eot,svg,ttf,woff,woff2}'))
      .pipe($.flatten())
      .pipe(gulp.dest(options.tmp + 'content/css/'));
  });*/

// check app for eslint errors
gulp.task('eslint', function () {
    return gulp.src(['gulpfile.js', config.app + 'app/**/*.js'])
        .pipe(plumber({errorHandler: handleErrors}))
        .pipe(eslint())
        .pipe(eslint.format())
        .pipe(eslint.failOnError());
});

// check app for eslint errors anf fix some of them
gulp.task('eslint:fix', function () {
    return gulp.src(config.app + 'app/**/*.js')
        .pipe(plumber({errorHandler: handleErrors}))
        .pipe(eslint({
            fix: true
        }))
        .pipe(eslint.format())
        .pipe(gulpIf(util.isLintFixed, gulp.dest(config.app + 'app')));
});

gulp.task('test', ['inject:test', 'ngconstant:dev'], function (done) {
    new KarmaServer({
        configFile: __dirname + '/' + config.test + 'karma.conf.js',
        singleRun: true
    }, done).start();
});

/* to run individual suites pass `gulp itest --suite suiteName` */
gulp.task('protractor', function () {
    var configObj = {
        configFile: config.test + 'protractor.conf.js'
    };
    if (argv.suite) {
        configObj['args'] = ['--suite', argv.suite];
    }
    return gulp.src([])
        .pipe(plumber({errorHandler: handleErrors}))
        .pipe(protractor(configObj))
        .on('error', function () {
            gutil.log('E2E Tests failed');
            process.exit(1);
        });
});

gulp.task('itest', ['protractor']);

gulp.task('watch', function () {
    gulp.watch('bower.json', ['install']);
    gulp.watch(['gulpfile.js', 'build.gradle'], ['ngconstant:dev']);
    gulp.watch(config.sassSrc, ['styles']);
    gulp.watch(config.app + 'content/images/**', ['images']);
    gulp.watch(config.app + 'app/**/*.js', ['inject:app']);
    gulp.watch([config.app + '*.html', config.app + 'app/**', config.app + 'i18n/**']).on('change', browserSync.reload);
});

gulp.task('install', function () {
    runSequence(['inject:dep', 'ngconstant:dev'], 'sass', 'copy:languages', 'inject:app', 'inject:troubleshoot');
});

gulp.task('serve', ['install'], serve);

gulp.task('build', ['clean'], function (cb) {
    runSequence(['copy','copyAngularUiGridFonts', 'inject:vendor', 'ngconstant:prod', 'copy:languages'], 'inject:app', 'inject:troubleshoot', 'assets:prod', cb);
});

gulp.task('default', ['serve']);

编辑: -

buildscript {
    repositories {
        mavenLocal()
        mavenCentral()
        jcenter()
        maven { url "http://repo.spring.io/plugins-release" }
        maven { url "http://repo.spring.io/milestone" }
        maven { url "https://plugins.gradle.org/m2/" }
    }
    dependencies {
        classpath "org.sonarsource.scanner.gradle:sonarqube-gradle-plugin:2.0.1"
        classpath "net.ltgt.gradle:gradle-apt-plugin:0.6"
        classpath "org.springframework.boot:spring-boot-gradle-plugin:${spring_boot_version}"
        classpath "org.springframework.build.gradle:propdeps-plugin:0.0.7"
        classpath "com.moowork.gradle:gradle-node-plugin:0.12"
        classpath "com.moowork.gradle:gradle-gulp-plugin:0.12"
        classpath "se.transmode.gradle:gradle-docker:1.2"
        classpath "io.spring.gradle:dependency-management-plugin:0.5.6.RELEASE"
        //jhipster-needle-gradle-buildscript-dependency - JHipster will add additional gradle build script plugins here
    }
}

apply plugin: 'java'
sourceCompatibility=1.8
targetCompatibility=1.8
apply plugin: 'maven'
apply plugin: 'spring-boot'
apply plugin: 'war'
apply plugin: 'propdeps'
apply plugin: 'io.spring.dependency-management'
/* downgrade Hibernate to 4.3 */
ext['hibernate.version'] = '${hibernate_entitymanager_version}'
defaultTasks 'bootRun'


sourceSets {
    generated {
        java {
            srcDirs = ['src/main/generated']
        }
    }
} 

bootRepackage {
   mainClass = 'com.equidity.dashboard.XboardApp'
}

war {

}

springBoot {
    mainClass = 'com.equidity.dashboard.XboardApp'
    executable = true
    buildInfo()
}

bootRun {
    addResources = false
}

apply from: 'gradle/yeoman.gradle'
apply from: 'gradle/sonar.gradle'

apply from: 'gradle/liquibase.gradle'

apply from: 'gradle/gatling.gradle'
apply from: 'gradle/mapstruct.gradle'
apply from: 'gradle/docker.gradle'
//jhipster-needle-gradle-apply-from - JHipster will add additional gradle scripts to be applied here

if (project.hasProperty('prod')) {
    apply from: 'gradle/profile_prod.gradle'
} else {
    apply from: 'gradle/profile_dev.gradle'
}

group = 'com.equidity.dashboard'
version = '0.0.1-SNAPSHOT'

description = ''

configurations {
    providedRuntime
    compile.exclude module: "spring-boot-starter-tomcat"
}

repositories {
    mavenLocal()
    mavenCentral()
    jcenter()
    maven { url 'http://repo.spring.io/milestone' }
    maven { url 'http://repo.spring.io/snapshot' }
    maven { url 'https://repository.jboss.org/nexus/content/repositories/releases' }
    maven { url 'https://oss.sonatype.org/content/repositories/releases' }
    maven { url 'https://oss.sonatype.org/content/repositories/snapshots' }
    maven { url 'http://repo.maven.apache.org/maven2' }
}

dependencies {
    compile "io.dropwizard.metrics:metrics-core"
    compile "io.dropwizard.metrics:metrics-graphite:${dropwizard_metrics_version}"
    compile "io.dropwizard.metrics:metrics-healthchecks:${dropwizard_metrics_version}"
    compile "io.dropwizard.metrics:metrics-jvm:${dropwizard_metrics_version}"
    compile "io.dropwizard.metrics:metrics-servlet:${dropwizard_metrics_version}"
    compile "io.dropwizard.metrics:metrics-json:${dropwizard_metrics_version}"
    compile ("io.dropwizard.metrics:metrics-servlets:${dropwizard_metrics_version}") {
        exclude(module: 'metrics-healthchecks')
    }
    compile("net.logstash.logback:logstash-logback-encoder:${logstash_logback_encoder_version}") {
        exclude(module: 'ch.qos.logback')
    }
    compile "com.fasterxml.jackson.datatype:jackson-datatype-json-org:${jackson_version}"
    compile "com.fasterxml.jackson.datatype:jackson-datatype-hppc:${jackson_version}"
    compile "com.fasterxml.jackson.datatype:jackson-datatype-jsr310:${jackson_version}"
    compile "com.fasterxml.jackson.datatype:jackson-datatype-hibernate4"
    compile "com.fasterxml.jackson.core:jackson-annotations:${jackson_version}"
    compile "com.fasterxml.jackson.core:jackson-databind:${jackson_version}"
    compile ("com.ryantenney.metrics:metrics-spring:${metrics_spring_version}") {
        exclude(module: 'metrics-core')
        exclude(module: 'metrics-healthchecks')
    } 
    compile "com.hazelcast:hazelcast:${hazelcast_version}"
    compile "com.hazelcast:hazelcast-hibernate4:${hazelcast_version}"
    compile "com.hazelcast:hazelcast-spring:${hazelcast_version}"
    compile "com.hazelcast:hazelcast-wm:${hazelcast_version}"
    compile "org.hibernate:hibernate-core:${hibernate_entitymanager_version}"
    compile("com.zaxxer:HikariCP:${HikariCP_version}") {
        exclude(module: 'tools')
    }
    compile "org.apache.commons:commons-lang3:${commons_lang_version}"
    compile "commons-io:commons-io:${commons_io_version}"
    compile "javax.inject:javax.inject:${javax_inject_version}"
    compile "javax.transaction:javax.transaction-api"
    compile "org.apache.geronimo.javamail:geronimo-javamail_1.4_mail:${geronimo_javamail_1_4_mail_version}"

    compile "org.hibernate:hibernate-envers"
    compile "org.hibernate:hibernate-validator"
    compile ("org.liquibase:liquibase-core:${liquibase_core_version}") {
        exclude(module: 'jetty-servlet')
    }
    compile "com.mattbertolini:liquibase-slf4j:${liquibase_slf4j_version}"
    compile "org.springframework.boot:spring-boot-actuator"
    compile "org.springframework.boot:spring-boot-autoconfigure"
    compile "org.springframework.boot:spring-boot-loader-tools"
    compile "org.springframework.boot:spring-boot-starter-logging"
    compile "org.springframework.boot:spring-boot-starter-aop"
    compile "org.springframework.boot:spring-boot-starter-data-jpa"
    compile "org.springframework.boot:spring-boot-starter-data-elasticsearch"
    // needed to get around elasticsearch stacktrace about jna not found
    // https://github.com/elastic/elasticsearch/issues/13245
    compile "net.java.dev.jna:jna:${jna_version}"
    compile "org.springframework.boot:spring-boot-starter-security"
    compile ("org.springframework.boot:spring-boot-starter-web") {
        exclude module: 'spring-boot-starter-tomcat'
    }
    compile "org.springframework.boot:spring-boot-starter-undertow"
    compile "org.springframework.boot:spring-boot-starter-websocket"
    compile "org.springframework.boot:spring-boot-starter-thymeleaf"
    compile "org.springframework.cloud:spring-cloud-cloudfoundry-connector"
    compile "org.springframework.cloud:spring-cloud-spring-service-connector"
    compile "org.springframework.cloud:spring-cloud-localconfig-connector"
    compile ("org.springframework:spring-context-support") {
        exclude(module: 'quartz')
    }
    compile "org.springframework.security:spring-security-config:${spring_security_version}"
    compile "org.springframework.security:spring-security-data:${spring_security_version}"
    compile "org.springframework.security:spring-security-web:${spring_security_version}"
    compile "org.springframework.security:spring-security-messaging:${spring_security_version}" 
    compile("io.springfox:springfox-swagger2:${springfox_version}"){
        exclude module: 'mapstruct'
    }
    compile "mysql:mysql-connector-java"
    compile "fr.ippon.spark.metrics:metrics-spark-reporter:${metrics_spark_reporter_version}"
    compile "org.mapstruct:mapstruct-jdk8:${mapstruct_version}"
    compile "org.apache.httpcomponents:httpclient"
    compile "org.springframework.social:spring-social-security"
    compile "org.springframework.social:spring-social-google:${spring_social_google_version}"
    compile "org.springframework.social:spring-social-facebook"
    compile "org.springframework.social:spring-social-twitter"
    testCompile "com.jayway.awaitility:awaitility:${awaility_version}"
    testCompile "com.jayway.jsonpath:json-path"
    testCompile "info.cukes:cucumber-junit:${cucumber_version}"
    testCompile "info.cukes:cucumber-spring:${cucumber_version}"
    testCompile "org.springframework.boot:spring-boot-starter-test"
    testCompile "org.springframework.security:spring-security-test"
    testCompile "org.springframework.boot:spring-boot-test"
    testCompile "org.assertj:assertj-core:${assertj_core_version}"
    testCompile "junit:junit"
    testCompile "org.mockito:mockito-core"
    testCompile "com.mattbertolini:liquibase-slf4j:${liquibase_slf4j_version}"
    testCompile "org.hamcrest:hamcrest-library"

    testCompile "io.gatling.highcharts:gatling-charts-highcharts:${gatling_version}"

    testCompile "com.h2database:h2"
    optional "org.springframework.boot:spring-boot-configuration-processor:${spring_boot_version}"
    //jhipster-needle-gradle-dependency - JHipster will add additional dependencies here

    compile "com.querydsl:querydsl-core:${queryDslVersion}"
    compile "com.querydsl:querydsl-jpa:${queryDslVersion}"
    compile "com.querydsl:querydsl-apt:${queryDslVersion}"
    querydslapt "com.querydsl:querydsl-apt:${queryDslVersion}"

}
clean {
    delete "target"
}

task cleanResources(type: Delete) {
    delete 'build/resources'
}

task wrapper(type: Wrapper) {
    gradleVersion = '3.1'
}

task stage(dependsOn: 'bootRepackage') {
}


compileJava.dependsOn processResources
processResources.dependsOn cleanResources,bootBuildInfo
bootBuildInfo.mustRunAfter cleanResources

编辑: - Profile_prod.gradle

import org.apache.tools.ant.taskdefs.condition.Os
apply plugin: 'spring-boot'
apply plugin: 'com.moowork.node'
apply plugin: 'com.moowork.gulp'


ext {
    logbackLoglevel = "INFO"
}

dependencies {

}

def profiles = 'prod'
if (project.hasProperty('no-liquibase')) {
    profiles += ',no-liquibase'
}

if (project.hasProperty('swagger')) {
    profiles += ',swagger'
}

bootRun {
    args = []
}

task gulpBuildWithOpts(type: GulpTask) {
    args = ["build", "--no-notification"]
}

war {
    webAppDirName = 'build/www/'
}

processResources {
    filesMatching('**/logback-spring.xml') {
        filter {
            it.replace('#logback.loglevel#', logbackLoglevel)
        }
    }
    filesMatching('**/application.yml') {
        filter {
            it.replace('#spring.profiles.active#', profiles)
        }
    }
}


gulpBuildWithOpts.dependsOn 'npmInstall'
gulpBuildWithOpts.dependsOn 'bower'
processResources.dependsOn gulpBuildWithOpts
test.dependsOn gulp_test
bootRun.dependsOn gulp_test

1 个答案:

答案 0 :(得分:1)

如您提供的链接中所述,您需要gulpfile.js中的任务来复制丢失的文件。您可以将以下代码用于现有的复制任务,例如:

gulp.src(config.app + '/bower_components/angular-ui-grid/*.{ttf,woff,eof,svg}')
    .pipe(plumber({errorHandler: handleErrors}))
    .pipe(changed(config.dist + 'content/css/'))
    .pipe(flatten())
    .pipe(rev())
    .pipe(gulp.dest(config.dist + 'content/css/'))
    .pipe(rev.manifest(config.revManifest, {
        base: config.dist,
        merge: true
    }))
    .pipe(gulp.dest(config.dist)),

即。你的复制任务就像这样:

gulp.task('copy', function () {
return es.merge(
    gulp.src(config.app + 'i18n/**')
    .pipe(plumber({errorHandler: handleErrors}))
    .pipe(changed(config.dist + 'i18n/'))
    .pipe(gulp.dest(config.dist + 'i18n/')),
    gulp.src(config.bower + 'bootstrap/fonts/*.*')
    .pipe(plumber({errorHandler: handleErrors}))
    .pipe(changed(config.dist + 'content/fonts/'))
    .pipe(rev())
    .pipe(gulp.dest(config.dist + 'content/fonts/'))
    .pipe(rev.manifest(config.revManifest, {
        base: config.dist,
        merge: true
    }))
    .pipe(gulp.dest(config.dist)),
    gulp.src(config.app + '/bower_components/angular-ui-grid/*.{ttf,woff,eof,svg}')
    .pipe(plumber({errorHandler: handleErrors}))
    .pipe(changed(config.dist + 'content/css/'))
    .pipe(flatten())
    .pipe(rev())
    .pipe(gulp.dest(config.dist + 'content/css/'))
    .pipe(rev.manifest(config.revManifest, {
        base: config.dist,
        merge: true
    }))
    .pipe(gulp.dest(config.dist)),
    gulp.src(config.app + 'content/**/*.{woff,woff2,svg,ttf,eot,otf}')
    .pipe(plumber({errorHandler: handleErrors}))
    .pipe(changed(config.dist + 'content/fonts/'))
    .pipe(flatten())
    .pipe(rev())
    .pipe(gulp.dest(config.dist + 'content/fonts/'))
    .pipe(rev.manifest(config.revManifest, {
        base: config.dist,
        merge: true
    }))
    .pipe(gulp.dest(config.dist)),
    gulp.src([config.app + 'robots.txt', config.app + 'favicon.ico', config.app + '.htaccess'], { dot: true })
    .pipe(plumber({errorHandler: handleErrors}))
    .pipe(changed(config.dist))
    .pipe(gulp.dest(config.dist))
);

});

看起来像angular-grid-ui期待*。{ttf,woff,eof,svg}文件可以在content / css下找到而不是content / fonts