Всем доброго времени суток! Вот суть проблемы:
Захожу через консоль в папку проекта и пишу
npm i story-json-to-amp
После добавляю в main.js
import story from './story.json';
import storyJsonToAmp from 'story-json-to-amp';
const ampHtml = storyJsonToAmp(story);
Затем топаю в нужный мне компонент и вызываю story.json (код из примера на
этом сайте)
<amp-story standalone
title="Stories in AMP - Hello World"
publisher="AMP Project"
publisher-logo-src="https://amp.dev/favicons/coast-228x228.png"
poster-portrait-src="https://amp.dev/static/samples/img/story_dog2_portrait.jpg"
poster-square-src="https://amp.dev/static/samples/img/story_dog2_square.jpg"
poster-landscape-src="https://amp.dev/static/samples/img/story_dog2_landscape.jpg">
<amp-story-page id="page-1">
<amp-story-grid-layer template="fill">
<amp-img src="https://amp.dev/static/samples/img/story_dog2.jpg"
width="720"
height="1280"
layout="responsive">
</amp-img>
</amp-story-grid-layer>
<amp-story-grid-layer template="vertical">
<h1>Hello World</h1>
<p>This is an AMP Story.</p>
</amp-story-grid-layer>
</amp-story-page>
<amp-story-page id="page-2">
<amp-story-grid-layer template="fill">
<amp-video autoplay
loop
width="720"
height="960"
poster="https://amp.dev/static/samples/img/story_video_dog_cover.jpg"
layout="responsive">
<source src="https://amp.dev/samples/video/story_video_dog.mp4"
type="video/mp4">
</amp-video>
</amp-story-grid-layer>
</amp-story-page>
<amp-story-page id="animation-demo">
<amp-story-grid-layer template="fill">
<amp-img src="https://amp.dev/static/samples/img/story_dog4.jpg"
animate-in="fly-in-top"
width="720"
height="1280"
layout="responsive">
</amp-img>
</amp-story-grid-layer>
<amp-story-grid-layer template="thirds">
<h2 animate-in="fly-in-bottom"
grid-area="lower-third"
animate-in-delay="0.4s">
Best walk ever!
</h2>
</amp-story-grid-layer>
</amp-story-page>
<amp-story-page id="layout-demo">
<amp-story-grid-layer template="thirds">
<amp-img grid-area="upper-third"
src="https://amp.dev/static/samples/img/story_thirds_1.jpg"
width="560"
height="420"
layout="responsive">
</amp-img>
<amp-img grid-area="middle-third"
src="https://amp.dev/static/samples/img/story_thirds_2.jpg"
width="560"
height="420"
layout="responsive">
</amp-img>
<amp-img grid-area="lower-third"
src="https://amp.dev/static/samples/img/story_thirds_3.jpg"
width="560"
height="420"
layout="responsive">
</amp-img>
</amp-story-grid-layer>
</amp-story-page>
И пишет что такой компонент не зарегистрирован, подскажите где косячу?
При том что когда я делаю это вне проекта wbpack (статикой на html) все работает прекрасно..
Пробовал скрипты подключать через CDN на прямую тоже не получается. Буду благодарен за любую помощь!
Средний
Сложный
