私はブートストラップを使用するウェブサイトを持っています。技術的には、私は現在Bootstrap 4を使用しています。私は自分のページの一般公開されている部分にAccelerated Mobile Pages（AMP）を活用したいと思っています。しかし、私はいくつかの誤りを抱えています。これは私には不思議なことですが、ブートストラップを高速モバイルページで使用することはできますか？ブートストラップ付きアクセラレーションモバイルページの使用
アクセラレーションモバイルページでもJavaScriptを使用できますか？ブートストラップには、携帯電話のハンバーガーメニュー用JavaScriptがあります。しかし、バリデータを実行すると、次のようなエラーが表示されます。
Accelerated Mobile Pagesを使用するBootstrap 4サイトを持つことは可能ですか？
ありがとうございます！
私もこれも不思議でした。
HTML、CSS、JavaScriptの一部を制限することで、信頼性の高いパフォーマンスを実現しています。これらの制限は、AMP HTMLに付属しているバリデーターを使用して実行されます。これらの制限を補うために、AMP HTMLは、基本的なHTMLを超えてリッチコンテンツ用のカスタム要素のセットを定義します。
これまでのようにカスタムJSを使用することはできません。代わりに、AMPの方法でページを構築し、カスタム要素を指定して使用する必要があります。
今、それが不要なCSSの多くを挿入し、AMPは、パフォーマンスのために最適化されているので、あなたがAMPとブートストラップを使用することはできませんが、あなたがそうのようにそれを含めることによって、AMP HTMLのfont-素晴らしいを使用することができます。
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css" rel="stylesheet">
githubに関するオリジナルの問題を参照してください：https://github.com/ampproject/amphtml/issues/2413
AMP仕様では、最大50kbのサイズのインラインCSSしか使用できません。 bootstrap cssとコンポーネントをAMPで使用することができます。これらのコンポーネントがbootstrap.jsに依存していない場合、AMP dosentはサードパーティーのJSを今のところ許可しています。
また、AMPが!importantの使用をインラインCSSで制限するため、ブートストラップCSSで使用される場合は、!importantを削除する必要があります。
次の場所からカスタムブートストラップバージョンを作成することができます：Customize Bootstrap
のチェックを外し、不要なプロパティと、それをエクスポートします。それは50kb未満でなければなりません。すべての "重要な"ルールを削除し、インラインCSSとしてサイトに配置します。あなたが一緒にAMPとBootstrapを使用する場合、著者のCSSの最大サイズとの誤差を取り除くために
、あなたはまた、手順に従って行うことができます。
purifycss entire.css yourpage.html --min --info --out minified.cssentire.css<style amp-custom>EDIT： 回避策には困難である一つの問題は残念ながらあります。 Bootstrapは、多くの場所で!importantキーワードを使用しています。これは、で、AMPと制限されています。 AMP validatorには、CSS以下のカスタムがある場合にこのエラーが最初に表示されます。50kb。このプロジェクトはorginalブートストラップ4フォークに基づいています https://github.com/jupeter/bootstrap/blob/v4-dev/dist/css/bootstrap-amp.min.css
：
はAMP projectのために用意し、このブートストラップ4 CSSを試してみてください。 すべてのCSSファイルにロードされたコンポーネントが配置されています https://github.com/jupeter/bootstrap/blob/v4-dev/scss/bootstrap-amp.scss
カスタムコンポーネントを追加する必要がある場合は、あなたが「SCSS /ブートストラップ・amp.scss」ファイルに追加して使用して再コンパイルすることができます
$ npm run amp-css
ありませんあなたの答えを正しく読んでいるかどうか、またはインラインスタイルのみを許可する部分が間違っているかどうかを確認してください。ドキュメントを読むと、内部スタイルシート（
タグ）を使用できますが、インラインスタイルは使用できないようです。https://www.ampproject.org/docs/guides/responsive/style_pagesを参照してください。 – NivF007