ウェブサイト検索

typescript - デフォルトの Angular-CLI プロジェクトが Safari で失敗 - 原因は strict モード?


私は最新バージョンの angular-cli をインストールし、新しいプロジェクト(ng new my-app)を作成しました。これにより、いつもスタイリッシュな「Welcome to App」が作成され、Angular のロゴと Tour of Heroes、CLI ドキュメント、Angular ブログへのリンクが表示されます。私はこれを ng serve で実行し、Windows マシン上で Chrome と Firefox を使ってローカルでアクセスすることができます。

これが奇妙になるのは、Browserstackを通じて同じローカルホストのアプリにアクセスしようとしたときです。Safari 11を実行しているMacからアクセスすると、すべてが予想通りに動作します。

しかし、Safari 10 以上を実行している Mac デバイス(たとえば iPad)からアクセスしようとすると、アプリは読み込まれず、エラーメッセージが表示されます: 「SyntaxError: 予期しないキーワード 'const'。厳格モードでは const 宣言はサポートされていません」。このエラーメッセージは、vendor.bundle.js の中のある場所(eval 内)に関連しています。

私の読んだところによると、古いバージョンの Safari は strict モードが有効になっている場合、const とうまく動作しないようです。しかし、何とか回避策があることを願っています。

他の人はこれにどう対処していますか?私はangular-cliの専門家ではないので、もし明白な解決策があるなら、それに気づかず申し訳ありません。

どんな助けでも大変感謝いたします。

回答 #1

私も同じ問題があります。これは webpack-dev-server(@angular/cli が内部で使用している)が ES6 の機能を使用しており、トランスパイルされていないことが原因のようです。

これは古いバージョンのSafariでのみ問題ですが、古いSafariのバージョンでテストしたい場合、Safariの更新は解決策にはなりません。

一時的な回避策として、古いバージョンの webpack-dev-server を使用し、インストールして手動でローカルの @angular/cli ディレクトリにコピーする方法があります:

yarn add [email  --dev
cp -R ./node_modules/webpack-dev-server ./node_modules/@angular/cli/node_modules/
./node_modules/.bin/ng serve

回答 #2

新しいバージョンの開発サーバーのES6機能がこれを引き起こしますが、より具体的にはライブリロード機能です。

もし --no-live-reload フラグを渡すと、ダウングレードする必要なく、古いデバイスでテストできるようになります。

例えば:ng serve --no-live-reload

関連記事