在Gridsome中向GraphQL层添加本地标记文件

Question

在Gridsome中，如何将本地标记文件添加到GraphQL层，以便您可以使用向vue组件添加graphql

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

Answer 1

初学者博客也有一个工作实现：https://github.com/gridsome/gridsome-starter-blog/blob/master/gridsome.config.js。

source-filesystem的网格式回购工具有一些文档需要帮助：https://github.com/gridsome/gridsome/tree/master/packages/source-filesystem

这里导入的文档是为了防止链接在将来中断(但是链接很可能是最新的)。

@gridsome/source-文件系统

将文件转换为可以在组件中使用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'
      }
    }
  ]
}

文件系统源还需要一个转换器来解析这些文件。上面的示例是寻找一组降价文件，因此为了让格利德理解文件的内容，您必须在项目中将@gridsome/转换器-备注作为一个dev依赖项安装。只要在package.json中找到支持您文件的转换器，Gridsome就会自动为您转换文件。

选项

路径

• 类型:需要string

到哪里去找文件。应该是一条幸运儿之路。

typeName

• 类型：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文件。如果定义了多个索引名，请确保每个目录只有一个可能的索引文件。