From c8380524149260c15f43e86653fe34d850c22c14 Mon Sep 17 00:00:00 2001 From: Rinat Date: Wed, 1 Jan 2025 12:55:38 +0400 Subject: [PATCH] Update templates and args related info (#185) --- CONTRIBUTING.md | 1 + contributors/TEMPLATE-FILES.md | 79 ++++++++++++++++++++++++---------- contributors/TEMPLATING.md | 2 +- 3 files changed, 59 insertions(+), 23 deletions(-) diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 313479ca3..e84dcbec1 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -37,6 +37,7 @@ Contributions are made via Issues and Pull Requests (PRs). A few general guideli - If you're running into an error, please give context. Explain what you're trying to do and how to reproduce the error. - Please use the same formatting in the code repository. You can configure your IDE to do it by using the prettier / linting config files included in each package. - If applicable, please edit the README.md file to reflect the changes. +- If you're adding a new template file or modifying arguments of existing templates, please create a corresponding PR to the [Example Extension branch](https://github.com/scaffold-eth/create-eth-extensions/tree/example) of the [create-eth-extensions](https://github.com/scaffold-eth/create-eth-extensions) repository ### Issues diff --git a/contributors/TEMPLATE-FILES.md b/contributors/TEMPLATE-FILES.md index 40662a3ca..81c87784d 100644 --- a/contributors/TEMPLATE-FILES.md +++ b/contributors/TEMPLATE-FILES.md @@ -6,28 +6,63 @@ Template files are the base files that can be extended by third-party extensions If you're interested in developing third-party extensions, the [THIRD-PARTY-EXTENSION.md](./THIRD-PARTY-EXTENSION.md) guide provides detailed instructions on the process. Additionally, we have a [YouTube tutorial](https://www.youtube.com/watch?v=XQCv533XGZk) that walks you through the process of creating an extension step-by-step. -#### Useful for third-party extensions - -| Template | Example args file | -| ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -| [(NextJS component) `Header.tsx.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/packages/nextjs/components/Header.tsx.template.mjs) | [(NextJS component) `Header.tsx.args.mjs`](https://github.com/scaffold-eth/create-eth-extensions/blob/subgraph/extension/packages/nextjs/components/Header.tsx.args.mjs) | -| [(NextJS component) `ScaffoldEthAppWithProviders.tsx.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/packages/nextjs/components/ScaffoldEthAppWithProviders.tsx.template.mjs) | [(NextJS component) `ScaffoldEthAppWithProviders.tsx.args.mjs`](https://github.com/scaffold-eth/create-eth-extensions/blob/subgraph/extension/packages/nextjs/components/ScaffoldEthAppWithProviders.tsx.args.mjs) | -| [(NextJS app) `layout.tsx.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/packages/nextjs/app/layout.tsx.template.mjs) | [(NextJS app) `layout.tsx.args.mjs`](https://github.com/scaffold-eth/create-eth-extensions/blob/onchainkit/extension/packages/nextjs/app/layout.tsx.args.mjs) | -| [(NextJS config) `scaffold.config.ts.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/packages/nextjs/scaffold.config.ts.template.mjs) | [(NextJS config) `scaffold.config.ts.args.mjs`](https://github.com/scaffold-eth/create-eth-extensions/blob/onchainkit/extension/packages/nextjs/scaffold.config.ts.args.mjs) | -| [(NextJS) `.env.example.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/packages/nextjs/.env.example.template.mjs) | [(NextJS) `.env.example.args.mjs`](https://github.com/scaffold-eth/create-eth-extensions/blob/onchainkit/extension/packages/nextjs/.env.example.args.mjs) | -| [(Foundry script) `Deploy.s.sol.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/solidity-frameworks/foundry/packages/foundry/script/Deploy.s.sol.template.mjs) | [(Foundry script) `Deploy.s.sol.args.mjs`](https://github.com/scaffold-eth/create-eth-extensions/blob/erc-20/extension/packages/foundry/script/Deploy.s.sol.args.mjs) | -| [(Root) `README.md.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/README.md.template.mjs) | [(Root) `README.md.args.mjs`](https://github.com/scaffold-eth/create-eth-extensions/blob/subgraph/extension/README.md.args.mjs) | -| [(NextJS config) `tailwind.config.js.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/packages/nextjs/tailwind.config.js.template.mjs) | [(NextJS config) `tailwind.config.js.args.mjs`](https://github.com/technophile-04/tailwind-hardhat-tasks-extension/blob/main/extension/packages/nextjs/tailwind.config.js.args.mjs) | -| [(Hardhat config) `hardhat.config.ts.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/solidity-frameworks/hardhat/packages/hardhat/hardhat.config.ts.template.mjs) | [(Hardhat config) `hardhat.config.ts.args.mjs`](https://github.com/technophile-04/tailwind-hardhat-tasks-extension/blob/main/extension/packages/hardhat/hardhat.config.ts.args.mjs) | - -#### create-eth internal use - -| Template | Example args file | -| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -| [(GitHub workflow) `lint.yaml.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/.github/workflows/lint.yaml.template.mjs) | [(GitHub workflow) `lint.yaml.args.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/solidity-frameworks/hardhat/.github/workflows/lint.yaml.args.mjs) | -| [(Nextjs blockExplorer address) `page.tsx.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/packages/nextjs/app/blockexplorer/address/[address]/page.tsx.template.mjs) | [(BlockExplorer address) `page.tsx.args.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/solidity-frameworks/hardhat/packages/nextjs/app/blockexplorer/address/[address]/page.tsx.args.mjs) | -| [(Foundry) `.env.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/solidity-frameworks/foundry/packages/foundry/.env.template.mjs) | we need to create a `.env` file for the foundry to work properly out of box | -| [(Foundry) `deployments/.gitignore.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/solidity-frameworks/foundry/packages/foundry/deployments/.gitignore.template.mjs) | this makes sure we have empty `deployments` out of box | +### Useful for third-party extensions + +#### Foundry + +| Template | Example args file | +| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------- | +| [(script) `Deploy.s.sol.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/solidity-frameworks/foundry/packages/foundry/script/Deploy.s.sol.template.mjs) | [`Deploy.s.sol.args.mjs`](https://github.com/scaffold-eth/create-eth-extensions/blob/example/extension/packages/foundry/script/Deploy.s.sol.args.mjs) | +| [(config) `Makefile.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/solidity-frameworks/foundry/packages/foundry/Makefile.template.mjs) | [`Makefile.args.mjs`](https://github.com/scaffold-eth/create-eth-extensions/blob/example/extension/packages/foundry/Makefile.args.mjs) | + +#### Hardhat + +| Template | Example args file | +| --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------- | +| [(config) `hardhat.config.ts.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/solidity-frameworks/hardhat/packages/hardhat/hardhat.config.ts.template.mjs) | [`hardhat.config.ts.args.mjs`](https://github.com/scaffold-eth/create-eth-extensions/blob/example/extension/packages/hardhat/hardhat.config.ts.args.mjs) | + +#### NextJS + +| Template | Example args file | +| --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| [(app) `layout.tsx.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/packages/nextjs/app/layout.tsx.template.mjs) | [`layout.tsx.args.mjs`](https://github.com/scaffold-eth/create-eth-extensions/blob/example/extension/packages/nextjs/app/layout.tsx.args.mjs) | +| [(app) `page.tsx.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/packages/nextjs/app/page.tsx.template.mjs) | [`page.tsx.args.mjs`](https://github.com/scaffold-eth/create-eth-extensions/blob/example/extension/packages/nextjs/app/page.tsx.args.mjs) | +| [(component) `Header.tsx.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/packages/nextjs/components/Header.tsx.template.mjs) | [`Header.tsx.args.mjs`](https://github.com/scaffold-eth/create-eth-extensions/blob/example/extension/packages/nextjs/components/Header.tsx.args.mjs) | +| [(component) `ScaffoldEthAppWithProviders.tsx.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/packages/nextjs/components/ScaffoldEthAppWithProviders.tsx.template.mjs) | [`ScaffoldEthAppWithProviders.tsx.args.mjs`](https://github.com/scaffold-eth/create-eth-extensions/blob/example/extension/packages/nextjs/components/ScaffoldEthAppWithProviders.tsx.args.mjs) | +| [(contract) `externalContracts.ts.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/packages/nextjs/contracts/externalContracts.ts.template.mjs) | [`externalContracts.ts.args.mjs`](https://github.com/scaffold-eth/create-eth-extensions/blob/example/extension/packages/nextjs/contracts/externalContracts.ts.args.mjs) | +| [(styles) `globals.css.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/packages/nextjs/styles/globals.css.template.mjs) | [`globals.css.args.mjs`](https://github.com/scaffold-eth/create-eth-extensions/blob/example/extension/packages/nextjs/styles/globals.css.args.mjs) | +| [(utils) `getMetadata.ts.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/packages/nextjs/utils/scaffold-eth/getMetadata.ts.template.mjs) | [`getMetadata.ts.args.mjs`](https://github.com/scaffold-eth/create-eth-extensions/blob/example/extension/packages/nextjs/utils/scaffold-eth/getMetadata.ts.args.mjs) | +| [(config) `scaffold.config.ts.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/packages/nextjs/scaffold.config.ts.template.mjs) | [`scaffold.config.ts.args.mjs`](https://github.com/scaffold-eth/create-eth-extensions/blob/example/extension/packages/nextjs/scaffold.config.ts.args.mjs) | +| [(config) `next.config.js.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/packages/nextjs/next.config.js.template.mjs) | [`next.config.js.args.mjs`](https://github.com/scaffold-eth/create-eth-extensions/blob/example/extension/packages/nextjs/next.config.js.args.mjs) | +| [(config) `tailwind.config.js.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/packages/nextjs/tailwind.config.js.template.mjs) | [`tailwind.config.js.args.mjs`](https://github.com/scaffold-eth/create-eth-extensions/blob/example/extension/packages/nextjs/tailwind.config.js.args.mjs) | +| [(env) `.env.example.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/packages/nextjs/.env.example.template.mjs) | [`.env.example.args.mjs`](https://github.com/scaffold-eth/create-eth-extensions/blob/example/extension/packages/nextjs/.env.example.args.mjs) | + +#### Root + +| Template | Example args file | +| ---------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------- | +| [(doc) `README.md.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/README.md.template.mjs) | [`README.md.args.mjs`](https://github.com/scaffold-eth/create-eth-extensions/blob/example/extension/README.md.args.mjs) | + +### create-eth internal use + +#### GitHub + +| Template | Example args file | +| --------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------- | +| [(workflow) `lint.yaml.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/.github/workflows/lint.yaml.template.mjs) | [`lint.yaml.args.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/solidity-frameworks/hardhat/.github/workflows/lint.yaml.args.mjs) | + +#### NextJS + +| Template | Example args file | +| ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| [(blockExplorer) `page.tsx.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/packages/nextjs/app/blockexplorer/address/[address]/page.tsx.template.mjs) | [`page.tsx.args.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/solidity-frameworks/hardhat/packages/nextjs/app/blockexplorer/address/[address]/page.tsx.args.mjs) | + +#### Foundry + +| Template | Example args file | +| ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------- | +| [(env) `.env.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/solidity-frameworks/foundry/packages/foundry/.env.template.mjs) | we need to create a `.env` file for the foundry to work properly out of box | +| [(gitignore) `.gitignore.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/solidity-frameworks/foundry/packages/foundry/deployments/.gitignore.template.mjs) | this makes sure we have empty `deployments` out of box | We also have `.gitignore.template.mjs` files in [root](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/.gitignore.template.mjs), [nextjs](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/packages/nextjs/.gitignore.template.mjs), [hardhat](https://github.com/scaffold-eth/create-eth/blob/main/templates/solidity-frameworks/hardhat/packages/hardhat/.gitignore.template.mjs), [foundry](https://github.com/scaffold-eth/create-eth/blob/main/templates/solidity-frameworks/foundry/packages/foundry/.env.template.mjs) that are used to prevent npm from ignoring the `.gitignore` files in the generated project. diff --git a/contributors/TEMPLATING.md b/contributors/TEMPLATING.md index af5f41be2..d9f8b5bf0 100644 --- a/contributors/TEMPLATING.md +++ b/contributors/TEMPLATING.md @@ -194,7 +194,7 @@ import { stringify } from "../path/to/templates/utils.js"; | Array, add new items | `const arrWithAdditionalItems = ${stringify(['a', 'b', ...arrayToSpread[0]])}` | `const arrayToSpread = ["Spread", "This"]` | `const arrWithAdditionalItems = ["a", "b", "Spread", "This"]` | | BigInt | `const bigInt = ${stringify(someBigInt[0])};` | `const someBigInt = 123n` | `const bigInt = 123n;` | -> NOTE: If the object contains function as a value `stringify` utility truncates it to `[Function keyName]`. In this case we have to use object spread operator while merging the objects and `JSON.stringify` while replacing the objects. Checkout [`next.config.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/packages/nextjs/next.config.template.mjs) for an example. +> NOTE: If the object contains function as a value `stringify` utility truncates it to `[Function keyName]`. In this case we have to use object spread operator while merging the objects and `JSON.stringify` while replacing the objects. Checkout [`next.config.js.template.mjs`](https://github.com/scaffold-eth/create-eth/blob/main/templates/base/packages/nextjs/next.config.js.template.mjs) for an example. ## Merging package.json files