モジュール内のカスタムファイルは角を使用してインポートします

Question

古いアーキテクチャからモジュラーワールドに移動しようとしていて、npmからThreeとAngularのposprocessingパッケージを使用しようとしています。

それを後処理からモジュールをインポートし、次のエラーを与える：

Failed to compile. 

./~/postprocessing/src/materials/adaptive-luminosity/glsl/shader.frag 
Module parse failed: (...)/materials/adaptive-luminosity/glsl/shader.frag Unexpected token (1:8) 
You may need an appropriate loader to handle this file type. 
| uniform sampler2D tPreviousLum; 
| uniform sampler2D tCurrentLum; 
| uniform float minLuminance; 
@ ./~/postprocessing/src/materials/adaptive-luminosity/index.js 3:0-42 
@ ./~/postprocessing/src/materials/index.js 

私は角度のCLI設定でその何かを前提としています。 カスタムファイル拡張子のインポートを有効にする方法はありますか？

Answer 1

webglフラグメントをインポートしようとしているようです。完全な開示、私はそれらについて多くを知らない。ここにあなたがいるhttps://webpack.js.org/concepts/loaders/

：しかし、問題はWebPACKの（角-CLIに隠された設定は）あなたがここにローダーに読ん.frag

をインポートするファイルの種類を処理するためローダーを持っていないということですhttps://github.com/angular/angular-cli/wiki/eject

のWebPACKの設定にglslify-loaderを追加します：あなたが本当に出力にWebPACKのコンフィグをあなたの角度-cliのアプリを取り出し

1. を角度-cliを使用したい場合は、行うことができます01 glslify-loaderドキュメントから

：WebPACKのに

loaders: [ 
     { test: /\.(glsl|frag|vert)$/, loader: 'raw', exclude: /node_modules/ }, 
     { test: /\.(glsl|frag|vert)$/, loader: 'glslify', exclude: /node_modules/ } 
    ] 
    }