diff --git a/README.md b/README.md index e6d2ca4..c18a957 100644 --- a/README.md +++ b/README.md @@ -99,18 +99,26 @@ export default function App() { ### Loading assets -The Metro bundler cannot load arbitrary file types like (`.obj`, `.mtl`, `.dae`, etc..). In order to support them you must create a `./metro.config.js` in your project root, and add the file extensions you want to support. +The Metro bundler cannot load arbitrary file types like (`.obj`, `.mtl`, `.dae`, etc..). In order to support them you must customize metro config and add the file extensions that you want to support. +Run `npx expo customize metro.config.js` and add following line to your `.metro.config.js` file. Make sure to add file types that you would like to support. -`metro.config.js` +```js +config.resolver.assetExts.push("db", "mp3", "ttf", "obj", "png", "jpg", "mtl"); +``` +Example after the edit: ```js -module.exports = { - resolver: { - assetExts: ['db', 'mp3', 'ttf', 'obj', 'png', 'jpg'], - }, -}; +// Learn more https://docs.expo.io/guides/customizing-metro +const { getDefaultConfig } = require("expo/metro-config"); + +/** @type {import('expo/metro-config').MetroConfig} */ +const config = getDefaultConfig(__dirname); +config.resolver.assetExts.push("db", "mp3", "ttf", "obj", "png", "jpg", "mtl"); + +module.exports = config; ``` + All assets require a local URI to be loaded. You can resolve a local URI with `expo-asset`. ```ts @@ -174,16 +182,6 @@ A function that will asynchronously load files based on their extension. > **Notice**: Remember to update your `metro.config.js` to bundle obscure file types! -`metro.config.js` - -```js -module.exports = { - resolver: { - assetExts: ['db', 'mp3', 'ttf', 'obj', 'png', 'jpg'], - }, -}; -``` - #### Props | Property | Type | Description |