2

在 Gridsome 中，如何将本地 markdown 文件添加到 GraphQL 层，以便将 graphql 添加到 vue 组件中？

在撰写本文时，用于从本地文件添加数据的 Gridsome 文档是空的。

4

1 回答 1

1

starter-blog 也有一个工作实现：https ://github.com/gridsome/gridsome-starter-blog/blob/master/gridsome.config.js

gridsome reposource-filesystem有一些文档可以提供帮助：https ://github.com/gridsome/gridsome/tree/master/packages/source-filesystem

此处导入的文档以防将来链接断开（但链接可能是最新的）。

@gridsome/源文件系统

将文件转换为可以在组件中使用 GraphQL 获取的内容。

安装

  • yarn add @gridsome/source-filesystem
  • npm install @gridsome/source-filesystem

用法

module.exports = {
  plugins: [
    {
      use: '@gridsome/source-filesystem',
      options: {
        path: 'blog/**/*.md',
        typeName: 'BlogPost',
        route: '/blog/:year/:month/:day/:slug'
      }
    }
  ]
}

文件系统源还需要一个转换器来解析文件。上面的例子是在寻找一组Markdown文件，所以为了让Gridsome理解文件的内容，你必须在你的项目中安装@gridsome/transformer-remark作为开发依赖。只要在您的package.json.

选项

小路
  • 类型：string 必填

在哪里查找文件。应该是一个全局路径。

类型名称
  • 类型：string
  • 默认：'FileNode'

GraphQL 类型和模板名称。中的.vue文件src/templates必须与 匹配typeName才能有模板。

路线
  • 类型：string

如果您的源能够具有特定的路径名​​结构，请定义动态路由。这将为来自该源的所有节点生成单个路由。可能的路径参数是year、month、day或slug任何自定义字段值。如果省略，将根据文件的路径和文件名生成每个文件的路由。阅读有关路由参数的更多信息。

参考
  • 类型：object

定义将引用另一个节点的字段。被引用typeName的应该存在。但是，如果您设置，也可以自动创建内容类型create: true。阅读有关参考的更多信息。

{
  refs: {
    // Reference to existing authors by id.
    author: 'Author',
    // Create a Tag content type and its nodes automatically.
    tags: {
      typeName: 'Tag',
      route: '/tag/:id',
      create: true
    }
  }
}
指数
  • 类型：Array
  • 默认：['index']

定义将哪些文件视为索引文件。这些文件的文件名不会出现在其路由路径中，将成为index.html目录的主文件。如果定义了多个索引名称，请确保每个目录只有一个可能的索引文件。

于 2019-04-24T14:02:37.327 回答