next-amp-element v0.0.1

Getting Started

Add amp element easily.

Install

npm

npm install next-amp-element    

pnpm

pnpm add next-amp-element

yarn

yarn add next-amp-element

Example

AmpState

import { AmpState } from "next-amp-element"

const App = () => {
  return (
    <>
      <AmpState id="testState">
        <>
          {{
            message: "Hello World",
          }}
        </>
      </AmpState>
      <button
        on="tap:AMP.setState({
            hello: testState.message
            })"
      >
        Click
      </button>
      <span data-amp-bind-text="hello" />
    </>
  )
}

AmpScript

import { AmpScript } from "next-amp-element"

const App = () => {
  return (
    <AmpScript
      src={`your-script-url-or-path`}
    />
  )
}

AmpCustomElement

import { AmpVideo } from "next-amp-element"

const App = () => {
  return <AmpVideo>Your Video</AmpVideo>
}

You can check here to see all amp custom elements.