Loading asset with custom extension not working

Question

I'm trying to implement my first application in react-native and I need to open database from a static file saved in my project folder.

I read that i need to allow loading custom extensions files from assets so i added following fragment into my app.json file:

"packagerOpts": {
    "assetExts": ["sqlite", "db"]
},

Next I'm trying to import this static file with .sqlite or .db extension inside my App.js component in componentDidMount() method:

componentDidMount = async () => {
  await Expo.FileSystem.downloadAsync(
    Expo.Asset.fromModule(require("./assets/db/local.db")).uri,
    `${Expo.FileSystem.documentDirectory}SQLite/local.db`
  );

  SQLite.openDatabase("local.db");
};

but expo builder keep saying Unable to resolve "./assets/db/local.db" from "App.js". Any suggestion please?

Answer 1

The following code is from 2 answers above

create metro.config.js in project root directory:

const defaultAssetExts = require("metro-config/src/defaults/defaults").assetExts;

module.exports = {
  resolver: {
    assetExts: [
      ...defaultAssetExts,
      // 3D Model formats
      "dae",
      "obj",
      "mtl",
      // sqlite format
      "db",
      "sqlite"
    ]
  }
};

Optionally install metro-dependency: npm i metro-config --save-dev

Answer 2

I found that expo has some kind of bug but there is PR raised/approved for this one. For anyone who can't wait for official bug fix there is also workaround for this one:

Create a metro.config.js file with assetExts fixed the problem for me:

module.exports = {
  resolver: {
    assetExts: ["db", "mp3", "ttf"]
  }
}

and import this file lets say in your App.js? I'm now able to open SQLite database from file.

Answer 3

Go to node_modules metro-config defaults.js ad extend type to the assetExts section Done~