IE11 で Vue 2.0 を開くときにプロジェクト ページが空白になる問題を解決する方法

この記事では、IE 11 で Vue 2.0 でプロジェクト ページを開くときに発生する空白の問題の解決策を主に紹介します。この記事では、この問題の原因を詳細に分析し、詳細な解決策を提供します。必要な友達は参考にしてください。以下一緒に。

はじめに

仕事の都合で、しばらくVue2.0を勉強していましたが、Vue2.0の公式スキャフォールディングツールを使ってプロジェクトを構築していました。問題なく実行できています。 Chrome では実行できますが、IE11 で開くとバグがあります:

問題

ie11 で vue2.0 プロジェクトを開くと、コンソールでエラーが報告されます。vuex では、このブラウザーでは Promise ポリフィルが必要です。<code>vuex requires a Promise polyfill in this browser；

原因

Babel 默认只转换新的 JavaScript 句法（syntax），而不转换新的 API ，比如 Iterator、Generator、Set、Maps、Proxy、Reflect、Symbol、Promise 等全局对象，以及一些定义在全局对象上的方法（比如 Object.assign）都不会转码。为了解决这个问题，我们使用一种叫做 Polyfill（代码填充，也可译作兼容性补丁） 的技术。

简单地说，polyfill即是在当前运行环境中用来复制（意指模拟性的复制，而不是拷贝）尚不存在的原生 api 的代码。

解决

安装babel-polyfill

Reason

Babel は、デフォルトで新しい JavaScript 構文 (構文) のみを変換します。新しい API (Iterator、Generator、Set、Maps、Proxy、Reflect、Symbol、Promise、その他のグローバル オブジェクトなど) は変換しません。グローバル オブジェクトで定義された一部のメソッド (Object.assign など) もトランスコードされません。この問題を解決するために、Polyfill (コード充填、互換性パッチとも訳される) と呼ばれるテクノロジーを使用します。

簡単に言えば、polyfill は、現在の実行環境にまだ存在していないネイティブ API をコピー (コピーではなく、シミュレートされたコピーを意味します) するために使用されるコードです。

解決策

babel-polyfillをインストールします

手順

npmのインストール

npm install --save-dev babel-polyfill

それをエントリファイルに注ぐだけです

りー

公式のスキャフォールディング vue-cli も使用する場合は、webpack.config.js 設定ファイルにさまざまな変更を加える必要があります。

import 'babel-polyfill'

を使用して

module.exports = {
 entry: {
 app: ["babel-polyfill", "./src/main.js"]
 }
};

すべてこの記事の内容です。この内容が皆さんの学習に役立つことを願っています。その他の関連コンテンツについては、PHP 中国語 Web サイトに注目してください。

🎜関連する推奨事項: 🎜🎜🎜Vue 背景画像をパッケージ化した後のアクセス パスが正しくない問題を解決する方法🎜🎜🎜🎜🎜 パッケージ化後に Vue プロジェクトを開くときに空白のページが表示される問題を解決する方法🎜🎜🎜🎜🎜🎜🎜🎜 🎜

以上がIE11 で Vue 2.0 を開くときにプロジェクト ページが空白になる問題を解決する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。