如何为我的 scully 插件应用配置？答案

【问题标题】：How to apply config for my scully plugin?如何为我的 scully 插件应用配置？
【发布时间】：2021-05-11 11:40:34
【问题描述】：

我在 scully 上做了一个插件，angular 上的静态站点生成器。但我无法为我的插件添加我的配置对象。

我可以：

安装 markdown 支持并从 scully 的 markdown 生成一些帖子..
制作一个插件来制作一些路由。
通过 registerPlugin func 将插件注册为“路由进程”。
根据我的配置对象运行并成功生成路由...在插件脚本文件上。

问题：

现在，配置对象与插件代码在同一个 .ts 脚本文件中定义。
我想将我的配置对象注入另一个脚本文件，例如 scully.**.config.ts。我想让我的插件更易于重复使用。
但我无法通过 setConfig 函数覆盖配置。

插件代码：

import { HandledRoute, registerPlugin, RouteTypes } from "@scullyio/scully"

export const ARCHIVES_PLUGIN = 'archive'

export interface ArchivePluginConfig {
    root:string;
    articleRoute: string;
    archivePrefixRoute: string;
    archiveSize:number;
}

export const EXAMPLE_CONFIGS: ArchivePluginConfig[] =[{
    root:"/blog",
    articleRoute: "/blog/articles",
    archivePrefixRoute: "/archives",
    archiveSize:8,
}];

export function archivePlugin(routes: HandledRoute[], config?:ArchivePluginConfig[]): Promise<HandledRoute[]> {
    config = (config ==undefined || config.length<1)? EXAMPLE_CONFIGS:config;

    config.forEach(config => {       
        //add archives for blog
        let posts = routes.filter((route) => route.route.startsWith(config.articleRoute));
        let archiveCount=Math.floor(posts.length/config.archiveSize)+1;
        
        let archives:HandledRoute[]=[];
        for (let page = 1; page <= archiveCount; page++) {
            archives.push({route:`${config.root}${config.archivePrefixRoute}/${page}`}) 
        }
        archives.forEach(element => {
            routes.push(element);
        });
    });
    return Promise.resolve(routes);
}

registerPlugin("routeProcess", ARCHIVES_PLUGIN, archivePlugin, [])

scully.{myproject}.config.ts 代码：

import { ScullyConfig, setPluginConfig } from '@scullyio/scully';
import './scully/plugins/archive';
import { ArchivePluginConfig, ARCHIVES_PLUGIN  ,archivePlugin} from './scully/plugins/archive';

setPluginConfig('md', { enableSyntaxHighlighting: true });

const archiveConfig:ArchivePluginConfig[]=[
  {
    root:"/blog",
    articleRoute:"blog/article",
    archiveSize:8,
    archivePrefixRoute:"/articles",
  }
]
setPluginConfig<ArchivePluginConfig[]>(ARCHIVES_PLUGIN,'routeProcess',archiveConfig);

const defaultPostRenderers = ['seoHrefOptimise'];

export const config: ScullyConfig = {
  defaultPostRenderers,
  projectRoot: "./",
  projectName: "jl-dotnet",
  outDir: './dist/static',
  routes: {
    '/blog/article/:post': {
      type: 'contentFolder',
      post: {
        folder: "./article/blog"
      }
    },
  }
};

结果：生成了一些不依赖于在 scully.**.config.ts 中定义的配置但在插件中定义的路由；生成的路由位于“/archives”而不是“/articles”

环境？：

操作系统：Windows 10
编辑器：vscode
控制台：git-bash
nodejs:v14.16.1
npm:7.12.0
我通过 ngcli 创建了新项目
我在 gitbash 上通过 npm 安装了 scully。

我尝试通过 angular 和 scully 将我的博客制作为静态站点。我制作了一个用于生成档案的插件，由多个页面组成。我制作了一个类似的插件，可以生成类别存档。但是会出现同样的问题。

此行有效，为 markdown 插件注入配置，

setPluginConfig('md', { enableSyntaxHighlighting: true });

【问题讨论】：

标签： angular typescript

【解决方案1】：

我有一个解决办法。

从插件函数中移除“config”参数
调用 getConfig 函数并将结果缓存到变量中
config 不需要是数组。所以我需要定义包装接口。我也使用界面。

【讨论】：