React styleguidist 如何在视图代码块中显示外部文件

我想在Styleguidists标记文档中显示另一个文件的源代码。我不希望源代码在内联中始终可见；我只想在读者点击查看代码时出现

根据文档（），我已经在我的`styleguide.config.js中添加了updateExamples

  updateExample(props, exampleFilePath) {
    const { settings, lang } = props;
    if (typeof settings.file === 'string') {
      const filepath = path.resolve(
        path.dirname(exampleFilePath),
        settings.file
      );
      const { file, ...restSettings } = settings;
      return {
        content: fs.readFileSync(filepath, 'utf8'),
        settings: restSettings,
        lang,
      };
    }
    return props;
  }

这几乎奏效，但并不完全有效：

如果我包括

`` `jsx { "file": "./documentation-mocks.js", "static": true}
`` `

`` `jsx { "file": "./documentation-mocks.js"}
`` `

然后我看到了完整的源代码，总是展开的，而不是简化为“查看代码”按钮

或者，如果我包括

`` `jsx { "file": "./documentation-mocks.js", "static": true}
`` `

`` `jsx { "file": "./documentation-mocks.js"}
`` `

然后我得到了我想要的“查看代码”按钮，但它前面有一个尝试评估代码的按钮，因此我还得到了一个带有

SyntaxError:Unexpected token'export'

（以及Chrome控制台中匹配的丑陋错误）的框

如何将外部文件放入“查看代码”按钮中，而不进行评估