Skip to main content

Docusaurus 插件​

你可以使用 solive-docusaurus-theme-code 插件快速集成一个轻量级Solidity Editor嵌入你的文档. （完善中）

安装​

  1. 首先我们需要安装 solive-docusaurus-theme-code 插件：
npm install --save solive-docusaurus-theme-code
  1. 安装一些配置需要的依赖项(暂未找到较好的方案内置)：
npm install -D stream-http https-browserify stream-browserify crypto-browserify stream-browserify path-browserify events os-browserify buffer url assert tty-browserify util browserify-zlib
  1. 其次你需要在你的 docusaurus.config.js 中配置 solive 插件.
module.exports = {
  // ...
  themes: ['solive-docusaurus-theme-code'],
  // ...
};

快速使用​

  1. 你需要注意在代码块标记solive，和配置solive的属性：
  ```solidity solive height=500px
    // your code
  ```
  1. 你可以在代码块中配置solive相关属性 height（具体参考属性表）：
  ```solidity solive height=300px
    // your code
  ```
  1. 配置代码块文件名（可多文件）：
  ```solidity solive height=500px
    /**
     * @filename Storage.sol
     */

    // your code

    /**
     * @filename Storage2.sol
     */

    // your code
  ```
  1. 完整的代码块示例：
```solidity solive height=500px
/**
 * @filename Storage.sol
 */


// SPDX-License-Identifier: GPL-3.0

pragma solidity >=0.7.0 <0.9.0;

/**
 * @title Storage
 * @dev Store & retrieve value in a variable
 * @custom:dev-run-script ./scripts/deploy_with_ethers.ts
 */
contract Storage {

    uint256 number;

    /**
     * @dev Store value in variable
     * @param num value to store
     */
    function store(uint256 num) public {
        number = num;
    }

    /**
     * @dev Return value
     * @return value of 'number'
     */
    function retrieve() public view returns (uint256){
        return number;
    }
}
```

展示结果：​

  /**
   * @filename Storage.sol
   */

  // SPDX-License-Identifier: GPL-3.0

  pragma solidity >=0.7.0 <0.9.0;

  /**
   * @title Storage
   * @dev Store & retrieve value in a variable
   * @custom:dev-run-script ./scripts/deploy_with_ethers.ts
   */
  contract Storage {

      uint256 number;

      /**
       * @dev Store value in variable
       * @param num value to store
       */
      function store(uint256 num) public {
          number = num;
      }

      /**
       * @dev Return value
       * @return value of 'number'
       */
      function retrieve() public view returns (uint256){
          return number;
      }
  }