Loading non-media assets (markdown)

#1

Hey there, I’m building an application that’s meant to be an offline reader for a website powered by markdown. In order to work offline, I want to bundle the markdown with the application, but be able to fetch and store new markdown as new posts are made / old posts are updated. Right now I’m struggling with how to bundle / request / save the markdown using Expo.

I initially tried using Expo.Asset, but require doesn’t seem to like markdown files, and Expo.Asset seems to only work with require.

Next I tried react-native-fetch-blob, but soon found out that doesn’t work without detaching.

Does anyone have any suggestion for the workflow of:

  1. Check if file is stored locally (From initial app or stored network file)
  2. Request file over network if not
  3. Store network file, so that case 1 triggers in the future

I’m really hoping there’s an answer here that ISN’T detach from / ditch Expo.

1 Like
#2

I’m also trying to use local Markdown assets and prioritize first-load-offline support.

This seems to work on both iOS and Android devices in Expo client

import { FileSystem, Asset } from 'expo'

// ...

const getMarkdown = markdownId => {
  const markdownAsset = await Asset.fromModule(require(`./assets/markdown/${markdownId}.md`))
  const markdown = await FileSystem.readAsStringAsync(markdownAsset.localUri)
  return markdown
}

getMarkdown(`filename`)

app.json excerpt

"packagerOpts": {
  "assetExts": [
    "md"
  ]
},
"assetBundlePatterns": [
  "assets/**/*"
]

Here’s a related snack I was working on.

Hope that helps, and would love to know if you have found some other approach.

#3

@jiku Does this still (SDK 30.0) work?

I’m having a lot of trouble getting it to work.

Would like to update the files via OTA and read the markdown (as a string) so I can use it with react-native-markdown-renderer

#4

@wbobeirne (and @jiku) do you have a working solution for it?