Docs/Components/m

m

m mirrors the motion API but ships without built-in animation features. Wrap your tree with <LazyMotion features={domAnimation} /> or domMax so features are loaded through a provider instead of bundled with every motion.X import.

import { LazyMotion, m, domAnimation } from 'motion-solidjs'

function App() {
  return (
    <LazyMotion features={domAnimation}>
      <m.div animate={{ opacity: 1 }} initial={{ opacity: 0 }} />
    </LazyMotion>
  )
}

Why m instead of motion?

Importing motion brings the full domMax feature set. m stays featureless until a LazyMotion provider loads capabilities above it, which makes route-level feature splitting possible.

ComponentBundles features?Use when
motionYes (domMax)One-page apps, prototyping
mNoYou want fine-grained bundle control

See also