Loading file error
robmi10 opened this issue · comments
The error message should be clearer here. That rive file most likely may not be discoverable when your app is run.
If you place your rive/
folder in the public/assets/
folder of your NextJS app, you could set src as /assets/rives/pharao.riv
and that might work.
I just ran into this as well and it seems like a duplicate of #90
i know its an old stuff, but ive been trying to fix that to work with React/Capacitor since we dont have /public as all the magic is happening on build. for us the fix was:
import { useRive } from '@rive-app/react-canvas';
import React from 'react';
import BouncyBall from '../images/rive/bouncy_ball.riv?url';
import styles from './riveWrapper.module.scss';
export default function RiveWrapper() {
const { rive, RiveComponent } = useRive({
src: BouncyBall,
stateMachines: 'Motion',
autoplay: false,
});
return (
<div className={styles.riveContainer}>
<RiveComponent onClick={() => rive && rive.play()} />
</div>
);
}
our setup is React/Capacitor/VIte - no additional config in vite or ts required just this ?url
suffix