問題タブ [webfont-loader]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
2 に答える
1771 参照

node.js - phantomjs + Web フォント + フォントローダー

環境内でphantomjsを実行していnode.jsますが、うまくいっています。現時点ではローカル フォントのみを使用していますが、phantomjs で動作するGoogle Web フォントを取得したいと考えています。

Web フォントを .NET で動作させることができるかどうか、またその方法については、さまざまな矛盾する紛らわしい報告がありますphantomjsこのようなリンク切れの古い情報を含む記事があります。そして、このような投稿は、 phantomjs 2.0が Web フォントをサポートする、またはサポートできることを示唆しています。この投稿では、Web フォントが2.0で機能するという提案があります

phantomjs 2.0および2.0.1バイナリを含む多くのオプションを試しましたが、機能しません。次のようなものを使用して、 Webフォントローダーを使用してjsにWebフォントをロードしている可能性があります。

しかし、私は常にinactiveブランチに到達しているため、フォントの読み込みは決して成功しません...ブラウザで同じコードが正常に機能しても(activeブランチに到達します.

フォントローダーのドキュメントでは、次のように述べています。

Web Font Loader が、現在のブラウザーが をサポートしていないと判断した場合@font-faceinactiveイベントがトリガーされます。

私の疑いでは、Web フォント ローダーは実際にブラウザー (phantomjs) がこれをサポートしていないと判断しているため、常にinactive.

phantomjs + Web フォント + Web フォント ローダーを動かした人はいますか?

0 投票する
1 に答える
1717 参照

javascript - webfontloader を node.js および jsdom で動作させる

私はwebfontloaderをブラウザのコンテキスト内でうまく動作させています。特にwebfontloaderがnpmモジュールとして利用可能であるため、 node.js + jsdomコンテキストで動作させることができるかどうかを確認しようとしています。

適切な出力を提供するために node + jsdom が機能しているので、その部分が機能していることがわかります。しかし、webfontloader を統合して Web フォントを有効にしようとすると、動けなくなります。

基本的に、README に記載されている webfontloader モジュールを使用しています。

しかし、できる限り試してみると、次のエラーが表示されます。

ReferenceError: ウィンドウが定義されていません

windowjsdom からオブジェクトを取得できます。

しかし、そのコンテキストwinで使用するために webfontloaderに渡すにはどうすればよいですか?window

多分私は私の素朴さを示し、不可能を求めています.

0 投票する
1 に答える
3341 参照

javascript - Web Font Loader - すべてのフォントが読み込まれたのはいつですか?

モジュールとして Web フォント ローダーを使用しています。

すべてのフォントがアクティブになっていることを確認するにはどうすればよいですか?

私は追加しようとしました:

しかし、エラーが発生します:

0 投票する
2 に答える
120 参照

html - body タグを介してブログ投稿に Web フォントを埋め込みますか?

Web フォントを組み込むために Web サイトのコード全体を変更せずに、ブログ投稿で Web フォントを使用したいと考えています。外部の css または head コードを使用せずに @font-face コードをページの body セクションに追加する方法はありますか?

0 投票する
1 に答える
693 参照

javascript - モジュラー js パターンの Webfont Loader

Webfont ローダーのドキュメントでは、次のサンプル スクリプトが提供されています。

それを自分のページのスクリプトタグに直接入れると、<head>うまくいきます。関数でラップしてエクスポートしようとすると、コンソールに次のエラーが表示されます。

Uncaught ReferenceError: WebFontConfig が定義されていません

これが私がそれをラップしようとした方法です:

ここで明らかに間違ったことをしていますか?

0 投票する
0 に答える
718 参照

internet-explorer - IE11で動作しないWebフォントローダーでGoogleフォントを提供する

WebFontLoader を使用して Google Fonts からフォントを読み込もうとしています。

IE 11 + Microsoft Edge を除くすべてのブラウザーで完全に動作します。

問題:フォントを初めてロードしたときに、フォントが表示されません。このページには 2 つの iFrame があります。最初の読み込みでは、最初の iFrame は読み込まれませんが、2 番目の iFrame は 正常に読み込まれます

しかし、更新を押すと、両方の iFrame が正しく読み込まれます

これは、キャッシングと関係があると思いました-最初にロードされなかったファイル。

私がここで読んだことから: IE11およびその他の場所でアイコンフォントがロードされない これは、IEがキャッシュなしフラグでファイルをロードしないという問題であることを理解しています。

Web 上のさまざまな回答では、サーバーから「キャッシュなし」フラグを削除するか、「Cache-Control "max-age=3600"」フラグを設定することでこれが解決されると主張しています。

問題は、私がファイルを自分で提供していないことです.Google Fontsから直接WebFont-Loaderを使用して動的にロードされ、これらのフラグを変更できません.

製品の考慮事項のため、自分でホストすることはできません。Google フォントからのファイルしか提供できません (また、他のブラウザーのキャッシュの利点を享受するためでもあります)。

0 投票する
1 に答える
534 参照

angularjs - ユーザーがフォントを変更できるようにする

Googleフォントからロードされた選択とオプションでユーザーが変更できるようにしようとしているテキストを含むSVGがあります。フォントのリストとそれに付随するすべての情報を取得するために、Google フォント API に対して $http 呼び出しを行っています。Google webfontloader については知っていますが (実装方法はよくわかりません)、テキストを選択した適切なフォントに変更するのにまだ苦労しています。私はAngularjsを使用しています。

質問に対して; API から取得した情報を実装して、ユーザーがフォントを変更できるようにするにはどうすればよいですか?

0 投票する
1 に答える
766 参照

angular - Webpack の CommonsChunkPlugin と "import * as" の使用

私はかなり長い間 Webpack を学んでいますが、奇妙な動作に遭遇しました。

angular.io のWebpack Introduction で説明されているように、 すべてのベンダー モジュールをvendor.ts-file にインポートし、すべてのポリフィルを -file にインポートし、polyfill.ts-file 内でアプリを初期化していますmain.ts。したがって、Webpack の構成に次のエントリ ポイントと CommonsChunkPlugin を追加しました。

したがって、Webpack はそれを認識しvendor.tsapp.ts共通のモジュールを使用して、それをvendor.js-file のみに追加する必要があります。-file は次のvendor.tsようになります。

残念ながら、この動作は、 経由でインポートしたすべてのモジュールで期待どおりに機能しますが、 経由import MODULEでインポートしたモジュールでは機能しませんimport * as ALIAS from MODULE。この例では、 -fileとの依存関係も共有する必要がありますが、 -module もそこにインポートするため、そこにwebfontloader書き込まれます。app.jsvendor.ts

私が変更import * as WebFont from 'webfontloader';すると、let WebFont = require('webfontloader');それは機能します。

どうしたの?それでは、角度のすべてのインポートが機能するのはなぜですか?