0

TideSDK を使って Web サイトを .exe と .app に展開しようと試み始めたところですが、これはほとんどの場合素晴らしいものです。

私が現在直面している問題は、すべての CSS スタイルが、less.js フレームワークを利用した .less スタイルで記述されていることです。この内部では、カスタムの font-faces が宣言されており、標準の Web ブラウザーに展開すると、それらを使用するすべての要素に適切に適用されます。

Tide を介して展開すると、すべてのスタイリングを .less スタイル シートから取り出して通常の .CSS ファイルに戻さない限り、固執しないようです。アプリケーションの実際のビューをデプロイするときに内部的に使用しています。

これを修正する方法がわかりません。注意として、私は何も得ていません

[Error] Error finding

Tide コンソールからのエラーで、.svg が見つかっただけで、適用されていないと思います。

アップデート：

src: url('...') で間違った構文を使用していたようです。そのため、.less ファイルの CSS は実際にはサイレントに失敗していました。.svg のかなり奇妙な [Error] Error Finding... ファイルが表示されます。CSS のこの行内にある URL は、app: 3 回によって先頭に追加されています。

4

1 に答える 1

2

この問題を数時間調べた後、私は最終的にそれを理解しました。これらのフレームワークを組み合わせて使用​​する場合は、次の点に注意してください。

  1. less.js を使用すると、非常に奇妙なパス ディレクトリが吐き出される

    ソース: URL('...');

    これに対する解決策として、less で利用できる import ディレクティブを使用して、その .css スタイル シート内に @font-face 宣言を配置できます。プレーンな .css スタイル シートをインポートすることで、less.js にそれを通常の .css として扱うように指示することになり、吐き出される多重化された URL は発生しません。

    @import "../css/style.css";

  2. インポート ディレクティブを配置し、Chrome インスペクタの Resources - Fonts で SVG が実際に生成されていることを確認した後、SVG ファイル自体を調べて、SVG ファイルの CSS 命名規則に問題があるかどうかを判断しました。 . この回答とその中のブログ投稿によると、SVG 名は次を使用する必要があります。

    フォントファミリー

SVG メタデータからの命名スキームの値

src: url('YourSVGFont.svg#Silkscreen') format('svg');

実際には、フォントIDを使用する必要がありますが、少なくとも私の場合はそれが解決策でした:

src: url('YourSVGFont.svg#slkscrb') format('svg');

これはブログ投稿に埋め込まれた画像で、私が話していることと、これら 2 つの名前が SVG メタ データのどこに配置されているかがわかります。

于 2013-04-12T16:45:35.207 に答える