Question

我按照documentation使用BootStrap日期选择器。

这是我的HTML标题：

    <!--jquery & jquery cookie-->
    <script src="/node_modules/jquery/dist/jquery.min.js"></script>
    <script src="/node_modules/jquery-cookie/jquery.cookie.js"></script>

    <!--bootstrap-->
    <script src="/node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="/node_modules/bootstrap/dist/css/bootstrap.min.css">

    <!--font-awesome-->
    <link rel="stylesheet" href="/node_modules/font-awesome/css/font-awesome.min.css">

    <!--summernote-->
    <link rel="stylesheet" href="/node_modules/summernote/dist/summernote.css">
    <link rel="stylesheet" href="/node_modules/summernote/dist/summernote-bs3.css">
    <script src="/node_modules/summernote/dist/summernote.min.js"></script>


    <!--angular-->
    <!--Note: for debugging purpose use non-minified angular, need to use angular.min.js for production-->
    <script src="/node_modules/angular/angular.js"></script>
    <!--<script src="/node_modules/angular/angular.min.js"></script>-->
    <script src="/node_modules/angular-resource/angular-resource.min.js"></script>
    <script src="/node_modules/angular-route/angular-route.min.js"></script>
    <script src="/node_modules/angular-sanitize/angular-sanitize.min.js"></script>

    <!--angular-summernote-->
    <script src="/node_modules/angular-summernote/dist/angular-summernote.min.js"></script>


    <!--angular-bootstrap-->
    <script src="/node_modules/angular-bootstrap/ui-bootstrap-tpls.min.js"></script>
    <link rel="stylesheet" href="/node_modules/angular-bootstrap/ui-bootstrap-csp.css">

当我添加选择器时，我收到以下错误：

jquery.js:5246 GET http://localhost:8888/public/fonts/bootstrap/glyphicons-halflings-regular.woff2 (anonymous function) @ jquery.js:5246n.fn.extend.domManip @ jquery.js:5414n.fn.extend.after @ jquery.js:5244domInsert @ angular.js:5010$AnimateProvider.$get.enter @ angular.js:5173(anonymous function) @ angular.js:23761publicLinkFn @ angular.js:7408$get.boundTranscludeFn @ angular.js:7553controllersBoundTransclude @ angular.js:8169ngIfWatchAction @ angular.js:23752$get.Scope.$digest @ angular.js:15667$get.Scope.$apply @ angular.js:15935(anonymous function) @ angular.js:23244n.event.dispatch @ jquery.js:4435n.event.add.r.handle @ jquery.js:4121
public/fonts/bootstrap/glyphicons-halflings-regular.woff:1 GET http://localhost:8888/public/fonts/bootstrap/glyphicons-halflings-regular.woff 
public/fonts/bootstrap/glyphicons-halflings-regular.ttf:1 GET http://localhost:8888/public/fonts/bootstrap/glyphicons-halflings-regular.ttf

我没有public/fonts/bootstrap文件夹，但我有一个到node_modules/bootstrap文件夹的静态路由器。

如何在不移动文件夹的情况下使用它？

我的文件夹结构：

/root
    /server
        /blog
    /client
        /blog
    /public
        /script
        /style
        /image
        /blog
    /node_modules
        /angular
        /bootstrap
        /etc

Answer 1

您可能没有复制引导字体。某些第三方库假定/public下存在字体。

如果你正在使用gulp，这是一个虚拟任务，可以将字体从node_modules复制到public：

gulp.task('copy:font', function() {
    return gulp.src('/node_modules/bootstrap-sass/assets/fonts/**')
        .pipe(gulp.dest('/public/fonts'))
})

如何使用AngularJS从自定义URL获取字体？

1 个答案: