3

rnpm を使用してフォント アセットを含めるためのチュートリアルはたくさんあります。手順は次のとおりです。

  1. フォントを入れて、たとえば、./assets/fonts
  2. 次のスニペットを package.json に追加します。

    "rnpm": {
      "assets": [
        "./assets/fonts",
      ]
    }
    
  3. 実行しreact-native linkます。

フォント アセットには適していますが、他の種類のアセットについてはどうでしょうか。テキスト ファイルを含める必要がありますが、テキスト ファイル アセットに対して上記の手順を繰り返しても効果がないようです。私は何が欠けていますか?インターネット上で言及されていないので、rnpm でこれが可能かどうかさえわかりません。

編集:より具体的にはfile.txt./assets/rawディレクトリにa を追加し、package.jsonのconfigの./assets/raw隣に追加しました。実行後、Android プロジェクトのアセット ディレクトリ ( ) と、iOS プロジェクトの「バンドル リソースのコピー」ビルド フェーズに表示されることを期待していましたが、表示されませんでした。正常に実行され、エラーは発生しませんでした。./assets/fontsrnpmreact-native linkfile.txt/android/app/src/main/assetsreact-native link

最終的な目標は、アプリ バンドルにテキスト ファイルを含めて、実行時にアクセスできるようにすることです。もう 1 つのオプションは、テキストを JSON でラップすることですが、そうすると JS バンドルになってしまい、サイズが最大 25% 増加します。これはおそらく良くありません。ファイルを読むことを推奨する人もreact-native-fsいますが、Android と iOS の両方で利用できるようにどこに置くべきかわかりません。rnpm は Android と iOS のアセットを配置する場所 (およびそれらをバンドルにコピーする方法) を知っているので、それを使用するのがよいようですが、テキスト アセットでは機能しません。

何か考えや提案はありますか?

4

1 に答える 1

0

react-native linkReact Native CLI を掘り下げた後、 がフォントのみを処理することがわかりました。からの関連するコードは次の/node_modules/react-native/local-cli/link/android/copyAssets.jsとおりです。

/**
 * Copies each file from an array of assets provided to targetPath directory
 *
 * For now, the only types of files that are handled are:
 * - Fonts (otf, ttf) - copied to targetPath/fonts under original name
 */
module.exports = function copyAssetsAndroid(files, targetPath) {
  const assets = groupFilesByType(files);

  (assets.font || []).forEach(asset =>
    fs.copySync(asset, path.join(targetPath, 'fonts', path.basename(asset)))
  );
};

ご覧のとおりgroupFilesByType、MIME タイプ (フォント、テキストなど) ごとにすべてのファイルをグループ化しますが、実際にプロジェクトにコピーされるのはフォントだけです。

他の人は以前にこの問題に遭遇しました。ビデオ アセットのサポートを追加するプル リクエストがありましたが、マージされませんでした。どうやら行く方法は、パッケージャーを使用することです。

于 2017-10-18T12:01:59.793 に答える