react / react/metro

Documentation for assetPlugins

Open
#457 1 comment 15 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
JavaScript
Stars
5.6k
Forks
696
Avg merge
8m
Merged PRs (30d)
7

Description

The metro asset plugins are a powerful tool to extend the capabilities of the bundler as part of React Native mobile projects. I've used them to convert SVG source images to PNG at build time in https://github.com/aeirola/react-native-svg-asset-plugin, but found that the developer experience of building an asset plugin wasn't the best it could be, due to the lack of documentation. Similarly, looking at the marginal community effort for building asset plugins, I think better documentation could inspire more community members to extend the React Native build time tooling with new asset plugins.

So I'm proposing the addition of documentation around asset plugins. This could include both API reference documentation and more verbose guides for potential asset plugin developers. In the reference documentation I would be happy to see things like:

  • When and how the bundler loads and calls the asset plugin
  • What data is passed to the asset plugin
  • What data is expected to be returned by the asset plugin
  • How the bundler cache affects the asset plugin behaviour

For an asset plugin developer guide it would be interesting to see broader discussion on the topics of:

  • Templates / examples of asset simple plugins
  • Best practices on how to cache and store any derivative asset files
  • Providing configuration of asset plugins

If this is something that resonates with the maintainers of metro, I'd be happy to help out with producing the documentation based on my own experiences of writing asset plugins. Since my knowledge in the area is only based on my own studies of the bundler codebase and types, I might not get all the essential details correct. Thus I would ask for at least some support from maintainers in ensuring that any produced documentation wouldn't be misleading or contradictory to any possible future plans of metro.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reviewing the Metro bundler codebase and types that define asset plugins, focusing on when they are loaded, their inputs and outputs, and cache behavior. Use those details to outline API reference documentation and a developer guide covering examples, derivative-asset caching, and configuration. Done means the documentation is accurate and maintainers have confirmed it does not conflict with future Metro plans.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react-native
Domain
build-system, documentation
Issue type
Documentation
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.