GAS上のWebアプリケーションとしてAngularを利用する際にコケた点のメモ。

Google Apps ScriptのWebアプリケーションを作るにあたり、Angularを利用することにしました。

その際考えることとしては以下の様なこととなります。

• インラインスクリプトを利用してライブラリ読み込みをなくす

• （ファイルを読もうとするとCORSで読み込めず詰む）

• 外部ライブラリを利用する際はcdnから読み込む

• これらをWebpackでよしなに実行する。

というわけでここらへんをうまいことやっている先人がいないか探ってみると情報を発見。ありがたく拝借します。

https://www.monotalk.xyz/blog/Publish-SPA-using-Google-Apps-Script-Angular-7-as-a-Web-application/

が。自分の環境ではインラインスクリプト化がうまく行かず手間取る。
最終的には以下の対応で完了。

    new HtmlWebpackPlugin({
              filename: 'index.htm',
              template: './src/index.html',                  inlineSource: '^(?!http).\*.(js|css)$',                  minify: {
                removeAttributeQuotes: false,
                removeScriptTypeAttributes: false
              }
        }),

templateとして読み込むファイルと実際に書き出すファイル名を違うものにする。
これで、index.htmlに各種ファイルがインラインスクリプト化され、 Gas上のWebアプリケーションでAngularが動作するようになりました。

Angularの環境は8.2.14。自分用メモとして。