score:0
i've decided to go with uploading the video to cloudinary, a remote source instead. thanks for everyone's help.
score:0
this way works for local photos and videos:
import concert from '../../assets/videos/concert.mp4'
render(){
return (
<video controls>
<source src={concert} type="video/mp4"/>
your browser doesn't support html video.
</video>
); }
score:1
this is a fix for me. https://github.com/facebook/create-react-app/issues/6822#issuecomment-483079845
you can use src/react-app-env.d.ts to test it out:
declare module '*.mp4' {
const src: string;
export default src;
}
score:2
this works for local file:
import videos from '../../app/assets/videos/concert.mp4'
render(){
return (
<video loop autoplay>
<source src={videos} type="video/mp4"/>
</video>
); }
Source: stackoverflow.com
Related Query
- Can't load local video with React
- How to load a local video in React using webpack?
- React local video does not load in production
- load local mp4 file as source for video tag in React Gatsby website
- How can i load local video react application
- import LOCAL .obj to load with Three.js OBJLoader using React
- React won't load local images
- Updating source URL on HTML5 video with React
- Dynamically load a stylesheet with React
- Dealing with local state in react and redux
- How to run production react app in local with local back-end
- How do I use local state along with redux store state in the same react component?
- Dynamically load redux reducers with react router 4
- Cant load a react app after starting server
- React Native local images load slowly
- Cant use Hooks with my React Component Library. Invariant Violation: Invalid hook call
- Symlinking react modules with npm link for local development gives error
- React Native - How to load local image using the uri in Image Component?
- React app with Server-side rendering crashes with load
- React Router doesn't load images properly with nested routes
- How to load tinymce editor in React using local tinymce js
- React Router v4: Cant load page on GitHub pages
- Async Image Load with React and Redux
- Combining React local state with Redux global state
- Can't seek through video from Rails Active Storage with Rails-Webpacker React Frontend
- Deploy React with Nginx failed to load resources
- React Native - Share local image with showShareActionSheetWithOptions
- How to load facebook page plugin with react
- React Select with Async - Failing to load options
- How to load child component with props on first render with React Hooks
More Query from same tag
- React DELETE method not allowed
- Different main entry point in package.json for node and browser
- How to call a function onClick which is defined in React Hooks useEffect()?
- correct webpack config for babel 6, react hot load, webpack middleware
- How to subtract 2 values from an API in JavaScript
- How to use konva on windows without Visual studio and GTK
- Cannot read property 'apply' of undefined Konva.js
- How to know an asynchronous call has finished with redux-saga?
- useMutation result returning weird structure/ not returning requested fields
- Integrating Bulma Sass with Preact
- React Js PropTypes required without type
- Why do I get TypeError when I try adding express to my first react app
- Running react and node in a single port using Dockerfile
- Container props changing after state changes within children
- Handle multiple input values with React Redux Toolkit
- How to pass array objects or store them in reducer using interface and how does filter works on it?
- How to add custom dropdown menu in react-draft-wysiwyg?
- login from single device at a time, logout others MERN, JWT, Google login
- How can you stop third party Javascript from loading in a cleanup function?
- Gatsby Link pass previous page's location.path to next page via Props
- Creating a dynamic list of Links in react-router
- How can I add flowbite to the React.Js . Followed the guide on the flowbite but components doesn't working well
- React Beautiful DnD- set the drag handle to be ONLY the list item MARKER
- Mongoose Schema User Submitted Date Value
- Run function only once in React?
- Get an Icon with subtext and then a list on the same line?
- React Hooks - Removing component after use
- How to give border to this react tooltip and remove the arrow?
- redux-observable + socket.io: Actions must be plain objects. Use custom middleware for async actions
- Tooltip inside TextInput label is not working. Material-UI + React