Query data from any file #72

<!-- Please don't delete this template or we'll close your issue -->

<!-- Before creating an issue please make sure you are using the latest version of Saber. -->

Feature request

<!-- Please ask questions via following several ways. -->

<!-- https://chat.saber.land/ -->

<!-- https://stackoverflow.com/questions/ask?tags=saberjs -->

What problem does this feature solve?

Allow users to pull data in components when they actually need it.

What does the proposed API look like?

Introducing the saber-data.js (supported in project-level and theme-level):

exports.allTagNames = () => ['foo', 'bar']

In a component:

<script>
import { allTagNames } from 'saber/data'

export default {
  data() {
    return { allTagNames }
  }
}
</script>

How should this be implemented in your opinion?

Convert this with a babel plugin:

import { allTagNames } from 'saber/data'

to:

import allTagNames from '#cache/data.js?name=allTagNames'

The content of #cache/data.js:

const saberData = Object.assign(
  require('/path/to/project/saber-data.js'),
  require('/path/to/theme/saber-data.js')
)

module.exports = name => {
  return saberData[name] && saberData[name]()
}

Add a webpack loader just for #cache/data.js:

const devalue = require('devalue')

module.exports = async function(source) {
    const done = this.async()
    const mod = runCodeInSandbox(source, this.resourcePath)
    const result = await mod(this.resourceQuery.name)
    return `export default ${devalue(result)}`
}

Are you willing to work on this yourself?

Yes.