Reactive filesystem powered by @vue/reactivity

Reactive filesystem powered by @vue/reactivity

Install

npm i @vue-reactivity/**fs**

Usage

Work only in Node.js

Async usage

import { useFile } from '@vue-reactivity/fs'

const fileRef = await useFile('messages.txt').waitForReady()

console.log(fileRef.value) // output file content

fileRef.value += 'Hello World' // append to file

fileRef.value = 'Good Morning' // write to file

Callback usage

import { useFile } from '@vue-reactivity/fs'

useFile('messages.txt')
  .waitForReady()
  .then(fileRef => {
    console.log(fileRef.value) // output file content
  })

Watch for file changes (via chokidar)

const fileRef = useFile('messages.txt', { watchFileChanges: true })

useJson

import { useJSON } from '@vue-reactivity/fs'

const data = useJSON('data.json', { initialValue: { foo: 'bar' }})

console.log(data.value) // { foo: 'bar' }

data.value = { bar: 'foo' } // write to json file

Custom serializer

import YAML from 'js-yaml'
import { useFileWithSerializer } from '@vue-reactivity/fs'

export function useYAML<T>(path: string, options: JSONSerializerOptions<T> = {}) {
  return useFileWithSerializer<T>(
    path,
    {
      ...options,
      serialize: v => YAML.safeDump(v)
      deserialize: v => YAML.safeLoad(v),
    },
  )
}

Download Details:

Author: vue-reactivity

Source Code: https://github.com/vue-reactivity/fs

#vuejs #vue #javascript