Skip to content

Rocket League replay viewer in React made for the browser

License

Notifications You must be signed in to change notification settings

SaltieRL/WebReplayViewer

Folders and files

NameName
Last commit message
Last commit date

Latest commit

21e392d · May 18, 2022
May 17, 2022
May 18, 2022
May 18, 2022
May 23, 2019
Apr 17, 2019
Mar 20, 2020
Mar 20, 2020
May 6, 2019
May 23, 2019
Apr 17, 2019
Apr 16, 2019
Dec 3, 2019
Dec 4, 2019
May 18, 2022
May 18, 2022
May 4, 2019
May 17, 2022
Mar 10, 2020

Repository files navigation

Replay Viewer

NPM package Language Grade Discord

An extension of the DistributedReplays website, this library aims to provide a React component + utilities for displaying a Rocket League replay viewer in WebGL using Three.js

Setup

Unix

First thing's first: install all of your dependencies. We rely on Webpack as a bundler and Babel as a transpiler, so most dependencies are plugins for this project.

$ npm install

Developing

To launch a hot-reloading configuration, run the following. All file changes will be detected and will cause the package to re-bundle. The examples current live inside of the docs/ folder but can be modified to show off newer features.

$ npm start

If you would like to test with a compiled version of the app, you can run the following command to link the package globally. Then, you can import the bundle as you normally would by replacing instances of ../src/foo with replay-viewer/foo. This will tell the docs/ directory to treat this package as though it were installed inside your node_modules/ directory.

$ npm run link

Building

After ensuring that your build successfully compiles, you can build using the pre-configured build scripts. When you're ready to build, the build scripts will generate typescript declaration files and source maps inside the lib/ folder for your consumption. When in doubt, look at where the main value is set in the package.json file.

$ npm run build