ビルド時に、ファイルの内容をロードしてTypeScriptの文字列として注入したいと思っています。私はこのコードは通常サーバーコードであると理解していますが、私が望むのは、ファイルを読み込んでその内容を文字列として注入するビルドステップを持つことです。私は私がこれを行うことができるようにすべきだと思うどのbabel-plugin-static-fsを発見したが、私はもともと(ng
を使用していたビルド時にAngularでスタティックファイルをロードする
template: `<pre>"Hello World"</pre>`
:example.code
を想定し
import { readFileSync } from 'fs';
import { Component } from '@angular/core';
@Component({
template: `<pre>${readFileSync('./example.code')}</pre>`
})
export class ExampleComponent { }
はちょうど私がこのファイルとして構築されたいと思う"Hello World"
を持っていますangle-cli)を使ってプロジェクトを構築します。それはのように思える、私はwebpack
を実行したとき、私はローダーの順序を逆にした場合しかし
module: {
rules: [
/* snip */
{
"test": /\.ts$/,
"use": [
{
loader: "babel-loader",
options: {
plugins: ['babel-plugin-static-fs']
}
},
{
"loader": "@ngtools/webpack"
}, ] } ] }
、私はまだ
Cannot find module 'fs'
取得:私はWebPACKのng eject
を行って、更新されていますババエルは、上記の@Component
などのmayアノテーションで使用されている@
が好きではないので、ローダーが機能しません。
Angularプロジェクトのビルド中に静的コンテンツとしてファイルをロードする方法はありますか?
WebPackは、インポートされたものをバンドルします。 'import str from 'を試しましたか?/ example.code''? * .codeルールにローダーを割り当てる必要があるかもしれません。 – cgTag
@ThinkingMediaこれは単なる例です。ファイル自体がタイプスクリプトファイルである可能性があります。私はこれらのファイルからソースコードを欲し、これらのファイルのいくつかはプロジェクトのソースコードとして使用することができますので、私はそれらのファイルを飛ばすことはできません。 –
ローダーは、ファイル拡張子やファイル自体の位置に基づいて適切に設定できます。それは比較的簡単です。 –