{"id":47531,"date":"2023-11-20T03:47:27","date_gmt":"2024-01-11T02:24:42","guid":{"rendered":"https:\/\/www.silicloud.com\/zh\/blog\/%e5%85%88%e8%af%95%e7%9d%80%e8%bf%90%e8%a1%8c%e4%b8%80%e4%b8%8b-yarn-graphql-codegen-init%e3%80%82\/"},"modified":"2024-05-04T09:55:42","modified_gmt":"2024-05-04T01:55:42","slug":"%e5%85%88%e8%af%95%e7%9d%80%e8%bf%90%e8%a1%8c%e4%b8%80%e4%b8%8b-yarn-graphql-codegen-init%e3%80%82","status":"publish","type":"post","link":"https:\/\/www.silicloud.com\/zh\/blog\/%e5%85%88%e8%af%95%e7%9d%80%e8%bf%90%e8%a1%8c%e4%b8%80%e4%b8%8b-yarn-graphql-codegen-init%e3%80%82\/","title":{"rendered":"\u5148\u8bd5\u7740\u8fd0\u884c\u4e00\u4e0b `yarn graphql-codegen init`"},"content":{"rendered":"<p>\u8fd9\u53ea\u662f\u6211\u7684\u6267\u884c\u7ed3\u679c\u548c\u5f53\u65f6\u7684\u601d\u8003\u5907\u5fd8\u5f55\uff0c\u5b83\u53ea\u6709\u8fd9\u4e48\u591a\u4ef7\u503c\u7684\u6587\u7ae0\uff0c\u5e76\u4e0d\u80fd\u63d0\u4f9b\u50cf\u6700\u4f73\u5b9e\u8df5\u90a3\u6837\u7684\u660e\u667a\u6c34\u5e73\u3002<\/p>\n<h1>\u603b\u7ed3<\/h1>\n<p>\u6211\u53d1\u73b0\u5f88\u591a\u5173\u4e8e\u6267\u884c yarn graphql-codegen init \u7684\u6587\u6863\uff0c\u4f46\u662f\u5bf9\u4e8e\u5411\u5bfc\u7684\u8981\u6c42\u6211\u5e76\u4e0d\u592a\u61c2\uff08\u9009\u62e9\u540e\u4f1a\u751f\u6210\u4ec0\u4e48\u5e76\u4e0d\u786e\u5b9a\uff09\uff0c\u627e\u4e0d\u5230\u8bf4\u660e\u5e94\u8be5\u9009\u62e9\u4ec0\u4e48\u7684\u6587\u6863\u8ba9\u6211\u611f\u5230\u56f0\u60d1\u3002\u6211\u51b3\u5b9a\u5148\u5c1d\u8bd5\u6267\u884c\u4e00\u4e0b\u547d\u4ee4\uff0c\u7136\u540e\u6839\u636e\u51fa\u73b0\u7684\u9519\u8bef\u6765\u586b\u5199\u4fe1\u606f\u3002<\/p>\n<p>\u5f53\u60a8\u4ee5 `yarn graphql-codegen init` \u547d\u4ee4\u8fd0\u884c\u65f6\u4f1a\u751f\u6210\u8fd9\u6837\u7684\u6587\u4ef6\uff0c\u8bf7\u67e5\u770b\u672c\u6587\u3002<br \/>\n\u5982\u679c\u4e0d\u7b26\u5408\u60a8\u7684\u9700\u6c42\uff0c\u6211\u5efa\u8bae\u60a8\u6839\u636e\u81ea\u5df1\u7684\u7528\u4f8b\u8fdb\u884c\u8c03\u6574\u3002<\/p>\n<h1>\u4e8b\u5148\u5f97\u51fa\u7ed3\u8bba<\/h1>\n<h2>\u64cd\u4f5c\u6b65\u9aa4<\/h2>\n<p>yarn graphql-codegen init\u5f8c\u306b\u3001codegen.yml\u304c\u751f\u6210\u3055\u308c\u308b<br \/>\n\u4e0a\u8a18\u30b3\u30de\u30f3\u30c9\u5b9f\u884c\u5f8c\u306byarn install\u3057\u3066package.json\u306b\u66f8\u304b\u308c\u305ftypescript-operations\u3068\u304b\u53d6\u308a\u8fbc\u3080\u5fc5\u8981\u3042\u308b<br \/>\n\u4f5c\u308a\u305f\u3044query\u307e\u305f\u306fmutation\u306e\u578b\u5b9a\u7fa9\uff08\u30b9\u30ad\u30fc\u30de\uff09\u3092\u66f8\u3044\u305f~.graphql\u30d5\u30a1\u30a4\u30eb\u3092\u81ea\u4f5c\u3059\u308b\u5fc5\u8981\u304c\u3042\u308b<\/p>\n<p>generate\u30b3\u30de\u30f3\u30c9\u3092\u6253\u3064\u3068~.graphql\u30d5\u30a1\u30a4\u30eb\u306b\u5408\u308f\u305b\u305f\u30c7\u30fc\u30bf\u30a2\u30af\u30bb\u30b9\u30d5\u30a1\u30a4\u30eb\u304c\u751f\u6210\u3055\u308c\u308b<\/p>\n<h2>\u6211\u7684\u611f\u89c9<\/h2>\n<p>\u5728\u8fd8\u4e0d\u4e86\u89e3\u60c5\u51b5\u7684\u65f6\u5019\uff0c\u53ef\u4ee5\u7528\u6765\u4e86\u89e3\u4f1a\u6709\u4ec0\u4e48\u6837\u7684\u884c\u4e3a\uff0c\u4f46\u662f\u4e00\u65e6\u719f\u6089\u4e86\uff0c\u5c31\u53ef\u4ee5\u7f16\u5199\u81ea\u5df1\u559c\u6b22\u7684codegen.yml\u5e76\u6dfb\u52a0\u81ea\u5df1\u559c\u6b22\u7684\u63d2\u4ef6\u3002<\/p>\n<h1>\u6211\u5c1d\u8bd5\u8fd0\u884c\u4e86`yarn graphql-codegen init`\u7684\u547d\u4ee4\u3002<\/h1>\n<p>\u8bf7\u6ce8\u610f<\/p>\n<ul class=\"post-ul\">\n<li style=\"list-style-type: none;\">\n<ul class=\"post-ul\">URL\u3068\u30a2\u30d7\u30ea\u540d\u306f\u30c0\u30df\u30fc\u306e\u5024\u3067\u7f6e\u63db\u3057\u3066\u304a\u308a\u3001\u305d\u306e\u90e8\u5206\u3060\u3051\u5b9f\u969b\u306e\u30ed\u30b0\u3068\u9055\u3063\u3066\u304a\u308a\u307e\u3059<\/ul>\n<\/li>\n<\/ul>\n<p>url:http:\/\/hogehoge.com:4000\/graphql<\/p>\n<p>\u30a2\u30d7\u30ea\u540d:sample_app<\/p>\n<pre class=\"post-pre\"><code>$ yarn add -D @graphql-codegen\/cli\r\n...\r\n\r\n$ yarn graphql-codegen init\r\nyarn run v1.22.0\r\n$ \/root\/sample_app\/node_modules\/.bin\/graphql-codegen init\r\n\r\n    Welcome to GraphQL Code Generator!\r\n    Answer few questions and we will setup everything for you.\r\n\r\n? What type of application are you building? Application built with React\r\n? Where is your schema?: (path or url) http:\/\/hogehoge.com:4000\/graphql\r\n? Where are your operations and fragments?: src\/**\/*.graphql\r\n? Pick plugins: TypeScript (required by other typescript plugins), TypeScri\r\npt Operations (operations and fragments), TypeScript React Apollo (typed co\r\nmponents and HOCs)\r\n? Where to write the output: src\/generated\/graphql.tsx\r\n? Do you want to generate an introspection file? Yes\r\n? How to name the config file? codegen.yml\r\n? What script in package.json should run the codegen? generate\r\n\r\n    Config file generated at codegen.yml\r\n\r\n      $ npm install\r\n\r\n    To install the plugins.\r\n\r\n      $ npm run generate\r\n\r\n    To run GraphQL Code Generator.\r\n\r\nDone in 496.46s.\r\n\r\n<\/code><\/pre>\n<p>\u751f\u6210\u7684codegen.yml\u6587\u4ef6<\/p>\n<pre class=\"post-pre\"><code><span class=\"na\">overwrite<\/span><span class=\"pi\">:<\/span> <span class=\"no\">true<\/span>\r\n<span class=\"na\">schema<\/span><span class=\"pi\">:<\/span> <span class=\"s2\">\"<\/span><span class=\"s\">http:\/\/hogehoge.com:4000\/graphql\"<\/span>\r\n<span class=\"na\">documents<\/span><span class=\"pi\">:<\/span> <span class=\"s2\">\"<\/span><span class=\"s\">src\/**\/*.graphql\"<\/span>\r\n<span class=\"na\">generates<\/span><span class=\"pi\">:<\/span>\r\n  <span class=\"s\">src\/generated\/graphql.tsx<\/span><span class=\"pi\">:<\/span>\r\n    <span class=\"na\">plugins<\/span><span class=\"pi\">:<\/span>\r\n      <span class=\"pi\">-<\/span> <span class=\"s2\">\"<\/span><span class=\"s\">typescript\"<\/span>\r\n      <span class=\"pi\">-<\/span> <span class=\"s2\">\"<\/span><span class=\"s\">typescript-operations\"<\/span>\r\n      <span class=\"pi\">-<\/span> <span class=\"s2\">\"<\/span><span class=\"s\">typescript-react-apollo\"<\/span>\r\n  <span class=\"s\">.\/graphql.schema.json<\/span><span class=\"pi\">:<\/span>\r\n    <span class=\"na\">plugins<\/span><span class=\"pi\">:<\/span>\r\n      <span class=\"pi\">-<\/span> <span class=\"s2\">\"<\/span><span class=\"s\">introspection\"<\/span>\r\n\r\n<\/code><\/pre>\n<p>\u5728src\u76ee\u5f55\u4e0b\u521b\u5efa\u4e00\u4e2a\u9002\u5f53\u7684graphql\u6587\u4ef6\uff08\u5b9e\u9645\u4e0a\u6ca1\u6709\u521b\u5efasrc\u76ee\u5f55\uff0c\u6240\u4ee5\u5c06codegen.yml\u6587\u4ef6\u7684documents\u90e8\u5206\u66ff\u6362\u4e3a\u653e\u7f6e\u67e5\u8be2\u7684\u9002\u5f53\u76ee\u5f55\u540d\u79f0\uff09\u3002<\/p>\n<p>\u6267\u884cgenerate\u547d\u4ee4\u4e4b\u540e<\/p>\n<pre class=\"post-pre\"><code><span class=\"nv\">$ <\/span>yarn generate\r\nyarn run v1.22.0\r\n<span class=\"nv\">$ <\/span>graphql-codegen <span class=\"nt\">--config<\/span> codegen.yml\r\n  \u2714 Parse configuration\r\n  \u2714 Generate outputs\r\nDone <span class=\"k\">in <\/span>2.02s.\r\n<\/code><\/pre>\n<p>\u5728 src\/generated\/graphql.tsx \u4e2d\u521b\u5efa\u4e86\u6570\u636e\u8bbf\u95ee\u51fd\u6570\u7684\u6587\u4ef6\uff01<\/p>\n<h2>\u4ee5\u4e0b\u662f\u5931\u8d25\u7684\u6848\u4f8b<\/h2>\n<ol>\n<li style=\"list-style-type: none;\">\n<ol>\u4f7f\u7528localhost\u800c\u4e0d\u662f\u4e3b\u673a\u540d\u5728docker\u5185\u90e8\u901a\u4fe1\u65f6\u7684\u8f93\u51fa\u7ed3\u679c<\/ol>\n<\/li>\n<\/ol>\n<p>&nbsp;<\/p>\n<ol>\n<li style=\"list-style-type: none;\">\n<ol>\u6ca1\u6709.graphql\u6587\u4ef6\u7684\u6267\u884c\u7ed3\u679c<\/ol>\n<\/li>\n<\/ol>\n<p>&nbsp;<\/p>\n<ol>\n<li style=\"list-style-type: none;\">\n<ol>\u5982\u679c\u6ca1\u6709\u5728\u6267\u884cyarn graphql-codegen init\u4e4b\u540e\u6267\u884cyarn install\u7684\u7ed3\u679c<\/ol>\n<\/li>\n<\/ol>\n<p>&nbsp;<\/p>\n<ol>\u5728codegen.yml\u521b\u5efa\u540e\u6267\u884cyarn install\u7684\u7ed3\u679c<\/ol>\n<h2>\u5f53\u5728docker\u5185\u8fdb\u884c\u901a\u4fe1\u65f6\uff0c\u610f\u5916\u5730\u4f7f\u7528\u4e86\u672c\u5730\u4e3b\u673a\u540d\uff0c\u800c\u4e0d\u662f\u6d4f\u89c8\u5668\u4e2d\u4f7f\u7528\u7684localhost\u65f6\u7684\u8f93\u51fa\u7ed3\u679c\u3002<\/h2>\n<p>\u56e0\u4e3a\u5b83\u662f\u5728Docker\u4e2d\u6267\u884c\u7684\uff0c\u6240\u4ee5\u5fc5\u987b\u901a\u8fc7\u5bb9\u5668\u7684\u4e3b\u673a\u540d\u6765\u8bbf\u95ee\u5176\u4ed6\u5bb9\u5668\u3002<\/p>\n<pre class=\"post-pre\"><code><span class=\"nv\">$ <\/span>yarn generate\r\nyarn run v1.22.0\r\n<span class=\"nv\">$ <\/span>graphql-codegen <span class=\"nt\">--config<\/span> codegen.yml\r\n  \u2714 Parse configuration\r\n  \u276f Generate outputs\r\n    \u276f Generate src\/generated\/graphql.tsx\r\n      \u2716 Load GraphQL schemas\r\n        \u2192 Failed to load schema\r\n        Load GraphQL documents\r\n        Generate\r\n    \u276f Generate .\/graphql.schema.json\r\n      \u2716 Load GraphQL schemas\r\n        \u2192 Failed to load schema\r\n        Load GraphQL documents\r\n        Generate\r\n\r\n\r\n Found 2 errors\r\n\r\n  \u2716 src\/generated\/graphql.tsx\r\n    Failed to load schema from http:\/\/localhost:4000\/graphql:\r\n\r\n        request to http:\/\/localhost:4000\/graphql failed, reason: co\r\nnnect ECONNREFUSED 127.0.0.1:4000\r\n        FetchError: request to http:\/\/localhost:4000\/graphql failed\r\n, reason: connect ECONNREFUSED 127.0.0.1:4000\r\n    at ClientRequest.&lt;anonymous&gt; <span class=\"o\">(<\/span>\/root\/sample_app\/node_modules\/node-fetch\/li\r\nb\/index.js:1455:11<span class=\"o\">)<\/span>\r\n    at ClientRequest.emit <span class=\"o\">(<\/span>events.js:311:20<span class=\"o\">)<\/span>\r\n    at Socket.socketErrorListener <span class=\"o\">(<\/span>_http_client.js:426:9<span class=\"o\">)<\/span>\r\n    at Socket.emit <span class=\"o\">(<\/span>events.js:311:20<span class=\"o\">)<\/span>\r\n    at emitErrorNT <span class=\"o\">(<\/span>internal\/streams\/destroy.js:92:8<span class=\"o\">)<\/span>\r\n    at emitErrorAndCloseNT <span class=\"o\">(<\/span>internal\/streams\/destroy.js:60:3<span class=\"o\">)<\/span>\r\n    at processTicksAndRejections <span class=\"o\">(<\/span>internal\/process\/task_queues.js:84:21<span class=\"o\">)<\/span>\r\n\r\n        GraphQL Code Generator supports:\r\n          - ES Modules and CommonJS exports <span class=\"o\">(<\/span><span class=\"nb\">export <\/span>as default or named exp\r\nort <span class=\"s2\">\"schema\"<\/span><span class=\"o\">)<\/span>\r\n          - Introspection JSON File\r\n          - URL of GraphQL endpoint\r\n          - Multiple files with <span class=\"nb\">type <\/span>definitions <span class=\"o\">(<\/span>glob expression<span class=\"o\">)<\/span>\r\n          - String <span class=\"k\">in <\/span>config file\r\n\r\n        Try to use one of above options and run codegen again.\r\n    Error: Failed to load schema\r\n        at loadSchema <span class=\"o\">(<\/span>\/root\/sample_app\/node_modules\/@graphql-codegen\/cli\/bin\r\n.js:407:15<span class=\"o\">)<\/span>\r\n        at processTicksAndRejections <span class=\"o\">(<\/span>internal\/process\/task_queues.js:97:5<span class=\"o\">)<\/span>\r\n    Error: Failed to load schema\r\n        at loadSchema <span class=\"o\">(<\/span>\/root\/sample_app\/node_modules\/@graphql-codegen\/cli\/bin\r\n.js:407:15<span class=\"o\">)<\/span>\r\n        at processTicksAndRejections <span class=\"o\">(<\/span>internal\/process\/task_queues.js:97:5<span class=\"o\">)<\/span>\r\n\r\n  \u2716 .\/graphql.schema.json\r\n    Failed to load schema from http:\/\/localhost:4000\/graphql:\r\n\r\n        request to http:\/\/localhost:4000\/graphql failed, reason: co\r\nnnect ECONNREFUSED 127.0.0.1:4000\r\n        FetchError: request to http:\/\/localhost:4000\/graphql failed\r\n, reason: connect ECONNREFUSED 127.0.0.1:4000\r\n    at ClientRequest.&lt;anonymous&gt; <span class=\"o\">(<\/span>\/root\/sample_app\/node_modules\/node-fetch\/li\r\nb\/index.js:1455:11<span class=\"o\">)<\/span>\r\n    at ClientRequest.emit <span class=\"o\">(<\/span>events.js:311:20<span class=\"o\">)<\/span>\r\n    at Socket.socketErrorListener <span class=\"o\">(<\/span>_http_client.js:426:9<span class=\"o\">)<\/span>\r\n    at Socket.emit <span class=\"o\">(<\/span>events.js:311:20<span class=\"o\">)<\/span>\r\n    at emitErrorNT <span class=\"o\">(<\/span>internal\/streams\/destroy.js:92:8<span class=\"o\">)<\/span>\r\n    at emitErrorAndCloseNT <span class=\"o\">(<\/span>internal\/streams\/destroy.js:60:3<span class=\"o\">)<\/span>\r\n    at processTicksAndRejections <span class=\"o\">(<\/span>internal\/process\/task_queues.js:84:21<span class=\"o\">)<\/span>\r\n\r\n        GraphQL Code Generator supports:\r\n          - ES Modules and CommonJS exports <span class=\"o\">(<\/span><span class=\"nb\">export <\/span>as default or named exp\r\nort <span class=\"s2\">\"schema\"<\/span><span class=\"o\">)<\/span>\r\n          - Introspection JSON File\r\n          - URL of GraphQL endpoint\r\n          - Multiple files with <span class=\"nb\">type <\/span>definitions <span class=\"o\">(<\/span>glob expression<span class=\"o\">)<\/span>\r\n          - String <span class=\"k\">in <\/span>config file\r\n\r\n        Try to use one of above options and run codegen again.\r\n    Error: Failed to load schema\r\n        at loadSchema <span class=\"o\">(<\/span>\/root\/sample_app\/node_modules\/@graphql-codegen\/cli\/bin\r\n.js:407:15<span class=\"o\">)<\/span>\r\n        at processTicksAndRejections <span class=\"o\">(<\/span>internal\/process\/task_queues.js:97:5<span class=\"o\">)<\/span>\r\n    Error: Failed to load schema\r\n        at loadSchema <span class=\"o\">(<\/span>\/root\/sample_app\/node_modules\/@graphql-codegen\/cli\/bin\r\n.js:407:15<span class=\"o\">)<\/span>\r\n        at processTicksAndRejections <span class=\"o\">(<\/span>internal\/process\/task_queues.js:97:5<span class=\"o\">)<\/span>\r\n\r\n\r\nSomething went wrong\r\nerror Command failed with <span class=\"nb\">exit <\/span>code 1.\r\ninfo Visit https:\/\/yarnpkg.com\/en\/docs\/cli\/run <span class=\"k\">for <\/span>documentation about this command.\r\n<\/code><\/pre>\n<h2>\u6ca1\u6709graphql\u6587\u4ef6\u7684\u8fd0\u884c\u7ed3\u679c<\/h2>\n<pre class=\"post-pre\"><code><span class=\"nv\">$ <\/span>yarn generate\r\nyarn run v1.22.0\r\n<span class=\"nv\">$ <\/span>graphql-codegen <span class=\"nt\">--config<\/span> codegen.yml\r\n  \u2714 Parse configuration\r\n  \u276f Generate outputs\r\n    \u276f Generate src\/generated\/graphql.tsx\r\n      \u2714 Load GraphQL schemas\r\n      \u2716 Load GraphQL documents\r\n        \u2192           - src\/<span class=\"k\">**<\/span>\/<span class=\"k\">*<\/span>.graphql\r\n        Generate\r\n    \u276f Generate .\/graphql.schema.json\r\n      \u2714 Load GraphQL schemas\r\n      \u2716 Load GraphQL documents\r\n        \u2192           - src\/<span class=\"k\">**<\/span>\/<span class=\"k\">*<\/span>.graphql\r\n        Generate\r\n\r\n\r\n Found 2 errors\r\n\r\n  \u2716 src\/generated\/graphql.tsx\r\n    Error:\r\n          Unable to find any GraphQL <span class=\"nb\">type <\/span>definitions <span class=\"k\">for <\/span>the following poi\r\nnters:\r\n\r\n              - src\/<span class=\"k\">**<\/span>\/<span class=\"k\">*<\/span>.graphql\r\n\r\n        at prepareResult <span class=\"o\">(<\/span>\/root\/sample_app\/node_modules\/@graphql-tools\/load\/i\r\nndex.cjs.js:573:15<span class=\"o\">)<\/span>\r\n        at loadTypedefs <span class=\"o\">(<\/span>\/root\/sample_app\/node_modules\/@graphql-tools\/load\/in\r\ndex.cjs.js:545:12<span class=\"o\">)<\/span>\r\n        at processTicksAndRejections <span class=\"o\">(<\/span>internal\/process\/task_queues.js:97:5<span class=\"o\">)<\/span>\r\n        at async loadDocuments <span class=\"o\">(<\/span>\/root\/sample_app\/node_modules\/@graphql-codege\r\nn\/cli\/bin.js:427:31<span class=\"o\">)<\/span>\r\n        at async \/root\/sample_app\/node_modules\/@graphql-codegen\/cli\/bin.js:78\r\n8:55\r\n        at async Task.task <span class=\"o\">(<\/span>\/root\/sample_app\/node_modules\/@graphql-codegen\/cl\r\ni\/bin.js:634:17<span class=\"o\">)<\/span>\r\n    Error:\r\n          Unable to find any GraphQL <span class=\"nb\">type <\/span>definitions <span class=\"k\">for <\/span>the following poi\r\nnters:\r\n\r\n              - src\/<span class=\"k\">**<\/span>\/<span class=\"k\">*<\/span>.graphql\r\n\r\n        at prepareResult <span class=\"o\">(<\/span>\/root\/sample_app\/node_modules\/@graphql-tools\/load\/i\r\nndex.cjs.js:573:15<span class=\"o\">)<\/span>\r\n        at loadTypedefs <span class=\"o\">(<\/span>\/root\/sample_app\/node_modules\/@graphql-tools\/load\/in\r\ndex.cjs.js:545:12<span class=\"o\">)<\/span>\r\n        at processTicksAndRejections <span class=\"o\">(<\/span>internal\/process\/task_queues.js:97:5<span class=\"o\">)<\/span>\r\n        at async loadDocuments <span class=\"o\">(<\/span>\/root\/sample_app\/node_modules\/@graphql-codege\r\nn\/cli\/bin.js:427:31<span class=\"o\">)<\/span>\r\n        at async \/root\/sample_app\/node_modules\/@graphql-codegen\/cli\/bin.js:78\r\n8:55\r\n        at async Task.task <span class=\"o\">(<\/span>\/root\/sample_app\/node_modules\/@graphql-codegen\/cl\r\ni\/bin.js:634:17<span class=\"o\">)<\/span>\r\n\r\n  \u2716 .\/graphql.schema.json\r\n    Error:\r\n          Unable to find any GraphQL <span class=\"nb\">type <\/span>definitions <span class=\"k\">for <\/span>the following poi\r\nnters:\r\n\r\n              - src\/<span class=\"k\">**<\/span>\/<span class=\"k\">*<\/span>.graphql\r\n\r\n        at prepareResult <span class=\"o\">(<\/span>\/root\/sample_app\/node_modules\/@graphql-tools\/load\/i\r\nndex.cjs.js:573:15<span class=\"o\">)<\/span>\r\n        at loadTypedefs <span class=\"o\">(<\/span>\/root\/sample_app\/node_modules\/@graphql-tools\/load\/in\r\ndex.cjs.js:545:12<span class=\"o\">)<\/span>\r\n        at processTicksAndRejections <span class=\"o\">(<\/span>internal\/process\/task_queues.js:97:5<span class=\"o\">)<\/span>\r\n        at async loadDocuments <span class=\"o\">(<\/span>\/root\/sample_app\/node_modules\/@graphql-codege\r\nn\/cli\/bin.js:427:31<span class=\"o\">)<\/span>\r\n        at async \/root\/sample_app\/node_modules\/@graphql-codegen\/cli\/bin.js:78\r\n8:55\r\n        at async Task.task <span class=\"o\">(<\/span>\/root\/sample_app\/node_modules\/@graphql-codegen\/cl\r\ni\/bin.js:634:17<span class=\"o\">)<\/span>\r\n    Error:\r\n          Unable to find any GraphQL <span class=\"nb\">type <\/span>definitions <span class=\"k\">for <\/span>the following poi\r\nnters:\r\n\r\n              - src\/<span class=\"k\">**<\/span>\/<span class=\"k\">*<\/span>.graphql\r\n\r\n        at prepareResult <span class=\"o\">(<\/span>\/root\/sample_app\/node_modules\/@graphql-tools\/load\/i\r\nndex.cjs.js:573:15<span class=\"o\">)<\/span>\r\n        at loadTypedefs <span class=\"o\">(<\/span>\/root\/sample_app\/node_modules\/@graphql-tools\/load\/in\r\ndex.cjs.js:545:12<span class=\"o\">)<\/span>\r\n        at processTicksAndRejections <span class=\"o\">(<\/span>internal\/process\/task_queues.js:97:5<span class=\"o\">)<\/span>\r\n        at async loadDocuments <span class=\"o\">(<\/span>\/root\/sample_app\/node_modules\/@graphql-codege\r\nn\/cli\/bin.js:427:31<span class=\"o\">)<\/span>\r\n        at async \/root\/sample_app\/node_modules\/@graphql-codegen\/cli\/bin.js:78\r\n8:55\r\n        at async Task.task <span class=\"o\">(<\/span>\/root\/sample_app\/node_modules\/@graphql-codegen\/cl\r\ni\/bin.js:634:17<span class=\"o\">)<\/span>\r\n\r\n\r\nSomething went wrong\r\nerror Command failed with <span class=\"nb\">exit <\/span>code 1.\r\ninfo Visit https:\/\/yarnpkg.com\/en\/docs\/cli\/run <span class=\"k\">for <\/span>documentation about this command.\r\n<\/code><\/pre>\n<h3>\u5982\u679c\u5728\u8fd0\u884c`yarn graphql-codegen init`\u4e4b\u540e\u6ca1\u6709\u8fd0\u884c`yarn install`\uff0c\u5219\u4f1a\u5f97\u5230\u4ee5\u4e0b\u7ed3\u679c\u3002<\/h3>\n<p>\u521b\u5efa\u4e86codegen.yml\u540e\uff0c\u6267\u884cyarn install\u3002<\/p>\n<pre class=\"post-pre\"><code><span class=\"nv\">$ <\/span>yarn generate\r\nyarn run v1.22.0\r\n<span class=\"nv\">$ <\/span>graphql-codegen <span class=\"nt\">--config<\/span> codegen.yml\r\n  \u2714 Parse configuration\r\n  \u276f Generate outputs\r\n    \u276f Generate src\/generated\/graphql.tsx\r\n      \u2714 Load GraphQL schemas\r\n      \u2714 Load GraphQL documents\r\n      \u2716 Generate\r\n        \u2192 Unable to find template plugin matching typescript-operations\r\n    \u276f Generate .\/graphql.schema.json\r\n      \u2714 Load GraphQL schemas\r\n      \u2714 Load GraphQL documents\r\n      \u2716 Generate\r\n        \u2192 Unable to find template plugin matching introspection\r\n\r\n\r\n Found 2 errors\r\n\r\n  \u2716 src\/generated\/graphql.tsx\r\n    Unable to find template plugin matching <span class=\"s1\">'typescript-operations'<\/span>\r\n    Install one of the following packages:\r\n\r\n\r\n    - @graphql-codegen\/typescript-operations\r\n    - @graphql-codegen\/typescript-operations-template\r\n    - @graphql-codegen\/typescript-operations-plugin\r\n    - graphql-codegen-typescript-operations\r\n    - graphql-codegen-typescript-operations-template\r\n    - graphql-codegen-typescript-operations-plugin\r\n    - codegen-typescript-operations\r\n    - codegen-typescript-operations-template\r\n    - typescript-operations\r\n    Error: Unable to find template plugin matching typescript-operations\r\n        at getPluginByName <span class=\"o\">(<\/span>\/root\/sample_app\/node_modules\/@graphql-codegen\/cl\r\ni\/bin.js:289:11<span class=\"o\">)<\/span>\r\n    Error: Unable to find template plugin matching typescript-operations\r\n        at getPluginByName <span class=\"o\">(<\/span>\/root\/sample_app\/node_modules\/@graphql-codegen\/cl\r\ni\/bin.js:289:11<span class=\"o\">)<\/span>\r\n\r\n  \u2716 .\/graphql.schema.json\r\n    Unable to find template plugin matching <span class=\"s1\">'introspection'<\/span>\r\n    Install one of the following packages:\r\n\r\n\r\n    - @graphql-codegen\/introspection\r\n    - @graphql-codegen\/introspection-template\r\n    - @graphql-codegen\/introspection-plugin\r\n    - graphql-codegen-introspection\r\n    - graphql-codegen-introspection-template\r\n    - graphql-codegen-introspection-plugin\r\n    - codegen-introspection\r\n    - codegen-introspection-template\r\n    - introspection\r\n    Error: Unable to find template plugin matching introspection\r\n        at getPluginByName <span class=\"o\">(<\/span>\/root\/sample_app\/node_modules\/@graphql-codegen\/cl\r\ni\/bin.js:289:11<span class=\"o\">)<\/span>\r\n    Error: Unable to find template plugin matching introspection\r\n        at getPluginByName <span class=\"o\">(<\/span>\/root\/sample_app\/node_modules\/@graphql-codegen\/cl\r\ni\/bin.js:289:11<span class=\"o\">)<\/span>\r\n\r\n\r\nSomething went wrong\r\nerror Command failed with <span class=\"nb\">exit <\/span>code 1.\r\ninfo Visit https:\/\/yarnpkg.com\/en\/docs\/cli\/run <span class=\"k\">for <\/span>documentation about this command.\r\n<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>\u8fd9\u53ea\u662f\u6211\u7684\u6267\u884c\u7ed3\u679c\u548c\u5f53\u65f6\u7684\u601d\u8003\u5907\u5fd8\u5f55\uff0c\u5b83\u53ea\u6709\u8fd9\u4e48\u591a\u4ef7\u503c\u7684\u6587\u7ae0\uff0c\u5e76\u4e0d\u80fd\u63d0\u4f9b\u50cf\u6700\u4f73\u5b9e\u8df5\u90a3\u6837\u7684\u660e\u667a\u6c34\u5e73\u3002 \u603b\u7ed3 \u6211\u53d1 [&hellip;]<\/p>\n","protected":false},"author":7,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-47531","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v21.5 (Yoast SEO v21.5) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>\u5148\u8bd5\u7740\u8fd0\u884c\u4e00\u4e0b `yarn graphql-codegen init` - Blog - Silicon Cloud<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.silicloud.com\/zh\/blog\/\u5148\u8bd5\u7740\u8fd0\u884c\u4e00\u4e0b-yarn-graphql-codegen-init\u3002\/\" \/>\n<meta property=\"og:locale\" content=\"zh_CN\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"\u5148\u8bd5\u7740\u8fd0\u884c\u4e00\u4e0b `yarn graphql-codegen init`\" \/>\n<meta property=\"og:description\" content=\"\u8fd9\u53ea\u662f\u6211\u7684\u6267\u884c\u7ed3\u679c\u548c\u5f53\u65f6\u7684\u601d\u8003\u5907\u5fd8\u5f55\uff0c\u5b83\u53ea\u6709\u8fd9\u4e48\u591a\u4ef7\u503c\u7684\u6587\u7ae0\uff0c\u5e76\u4e0d\u80fd\u63d0\u4f9b\u50cf\u6700\u4f73\u5b9e\u8df5\u90a3\u6837\u7684\u660e\u667a\u6c34\u5e73\u3002 \u603b\u7ed3 \u6211\u53d1 [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.silicloud.com\/zh\/blog\/\u5148\u8bd5\u7740\u8fd0\u884c\u4e00\u4e0b-yarn-graphql-codegen-init\u3002\/\" \/>\n<meta property=\"og:site_name\" content=\"Blog - Silicon Cloud\" \/>\n<meta property=\"article:published_time\" content=\"2024-01-11T02:24:42+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-05-04T01:55:42+00:00\" \/>\n<meta name=\"author\" content=\"\u79d1, \u9896\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u4f5c\u8005\" \/>\n\t<meta name=\"twitter:data1\" content=\"\u79d1, \u9896\" \/>\n\t<meta name=\"twitter:label2\" content=\"\u9884\u8ba1\u9605\u8bfb\u65f6\u95f4\" \/>\n\t<meta name=\"twitter:data2\" content=\"7 \u5206\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/%e5%85%88%e8%af%95%e7%9d%80%e8%bf%90%e8%a1%8c%e4%b8%80%e4%b8%8b-yarn-graphql-codegen-init%e3%80%82\/\",\"url\":\"https:\/\/www.silicloud.com\/zh\/blog\/%e5%85%88%e8%af%95%e7%9d%80%e8%bf%90%e8%a1%8c%e4%b8%80%e4%b8%8b-yarn-graphql-codegen-init%e3%80%82\/\",\"name\":\"\u5148\u8bd5\u7740\u8fd0\u884c\u4e00\u4e0b `yarn graphql-codegen init` - Blog - Silicon Cloud\",\"isPartOf\":{\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#website\"},\"datePublished\":\"2024-01-11T02:24:42+00:00\",\"dateModified\":\"2024-05-04T01:55:42+00:00\",\"author\":{\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/8ca01ba7f7362ad4edb7da206a12f29e\"},\"breadcrumb\":{\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/%e5%85%88%e8%af%95%e7%9d%80%e8%bf%90%e8%a1%8c%e4%b8%80%e4%b8%8b-yarn-graphql-codegen-init%e3%80%82\/#breadcrumb\"},\"inLanguage\":\"zh-Hans\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.silicloud.com\/zh\/blog\/%e5%85%88%e8%af%95%e7%9d%80%e8%bf%90%e8%a1%8c%e4%b8%80%e4%b8%8b-yarn-graphql-codegen-init%e3%80%82\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/%e5%85%88%e8%af%95%e7%9d%80%e8%bf%90%e8%a1%8c%e4%b8%80%e4%b8%8b-yarn-graphql-codegen-init%e3%80%82\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"\u9996\u9875\",\"item\":\"https:\/\/www.silicloud.com\/zh\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"\u5148\u8bd5\u7740\u8fd0\u884c\u4e00\u4e0b `yarn graphql-codegen init`\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#website\",\"url\":\"https:\/\/www.silicloud.com\/zh\/blog\/\",\"name\":\"Blog - Silicon Cloud\",\"description\":\"\",\"inLanguage\":\"zh-Hans\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/8ca01ba7f7362ad4edb7da206a12f29e\",\"name\":\"\u79d1, \u9896\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"zh-Hans\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/8a6fb3cc7ba2f69d2189ba532aec4633ea7ed75ac0af162ec367cb3abc0fb2af?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/8a6fb3cc7ba2f69d2189ba532aec4633ea7ed75ac0af162ec367cb3abc0fb2af?s=96&d=mm&r=g\",\"caption\":\"\u79d1, \u9896\"},\"url\":\"https:\/\/www.silicloud.com\/zh\/blog\/author\/keying\/\"},{\"@type\":\"ImageObject\",\"inLanguage\":\"zh-Hans\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/%e5%85%88%e8%af%95%e7%9d%80%e8%bf%90%e8%a1%8c%e4%b8%80%e4%b8%8b-yarn-graphql-codegen-init%e3%80%82\/#local-main-organization-logo\",\"url\":\"\",\"contentUrl\":\"\",\"caption\":\"Blog - Silicon Cloud\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"\u5148\u8bd5\u7740\u8fd0\u884c\u4e00\u4e0b `yarn graphql-codegen init` - Blog - Silicon Cloud","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.silicloud.com\/zh\/blog\/\u5148\u8bd5\u7740\u8fd0\u884c\u4e00\u4e0b-yarn-graphql-codegen-init\u3002\/","og_locale":"zh_CN","og_type":"article","og_title":"\u5148\u8bd5\u7740\u8fd0\u884c\u4e00\u4e0b `yarn graphql-codegen init`","og_description":"\u8fd9\u53ea\u662f\u6211\u7684\u6267\u884c\u7ed3\u679c\u548c\u5f53\u65f6\u7684\u601d\u8003\u5907\u5fd8\u5f55\uff0c\u5b83\u53ea\u6709\u8fd9\u4e48\u591a\u4ef7\u503c\u7684\u6587\u7ae0\uff0c\u5e76\u4e0d\u80fd\u63d0\u4f9b\u50cf\u6700\u4f73\u5b9e\u8df5\u90a3\u6837\u7684\u660e\u667a\u6c34\u5e73\u3002 \u603b\u7ed3 \u6211\u53d1 [&hellip;]","og_url":"https:\/\/www.silicloud.com\/zh\/blog\/\u5148\u8bd5\u7740\u8fd0\u884c\u4e00\u4e0b-yarn-graphql-codegen-init\u3002\/","og_site_name":"Blog - Silicon Cloud","article_published_time":"2024-01-11T02:24:42+00:00","article_modified_time":"2024-05-04T01:55:42+00:00","author":"\u79d1, \u9896","twitter_card":"summary_large_image","twitter_misc":{"\u4f5c\u8005":"\u79d1, \u9896","\u9884\u8ba1\u9605\u8bfb\u65f6\u95f4":"7 \u5206"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.silicloud.com\/zh\/blog\/%e5%85%88%e8%af%95%e7%9d%80%e8%bf%90%e8%a1%8c%e4%b8%80%e4%b8%8b-yarn-graphql-codegen-init%e3%80%82\/","url":"https:\/\/www.silicloud.com\/zh\/blog\/%e5%85%88%e8%af%95%e7%9d%80%e8%bf%90%e8%a1%8c%e4%b8%80%e4%b8%8b-yarn-graphql-codegen-init%e3%80%82\/","name":"\u5148\u8bd5\u7740\u8fd0\u884c\u4e00\u4e0b `yarn graphql-codegen init` - Blog - Silicon Cloud","isPartOf":{"@id":"https:\/\/www.silicloud.com\/zh\/blog\/#website"},"datePublished":"2024-01-11T02:24:42+00:00","dateModified":"2024-05-04T01:55:42+00:00","author":{"@id":"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/8ca01ba7f7362ad4edb7da206a12f29e"},"breadcrumb":{"@id":"https:\/\/www.silicloud.com\/zh\/blog\/%e5%85%88%e8%af%95%e7%9d%80%e8%bf%90%e8%a1%8c%e4%b8%80%e4%b8%8b-yarn-graphql-codegen-init%e3%80%82\/#breadcrumb"},"inLanguage":"zh-Hans","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.silicloud.com\/zh\/blog\/%e5%85%88%e8%af%95%e7%9d%80%e8%bf%90%e8%a1%8c%e4%b8%80%e4%b8%8b-yarn-graphql-codegen-init%e3%80%82\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.silicloud.com\/zh\/blog\/%e5%85%88%e8%af%95%e7%9d%80%e8%bf%90%e8%a1%8c%e4%b8%80%e4%b8%8b-yarn-graphql-codegen-init%e3%80%82\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"\u9996\u9875","item":"https:\/\/www.silicloud.com\/zh\/blog\/"},{"@type":"ListItem","position":2,"name":"\u5148\u8bd5\u7740\u8fd0\u884c\u4e00\u4e0b `yarn graphql-codegen init`"}]},{"@type":"WebSite","@id":"https:\/\/www.silicloud.com\/zh\/blog\/#website","url":"https:\/\/www.silicloud.com\/zh\/blog\/","name":"Blog - Silicon Cloud","description":"","inLanguage":"zh-Hans"},{"@type":"Person","@id":"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/8ca01ba7f7362ad4edb7da206a12f29e","name":"\u79d1, \u9896","image":{"@type":"ImageObject","inLanguage":"zh-Hans","@id":"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/8a6fb3cc7ba2f69d2189ba532aec4633ea7ed75ac0af162ec367cb3abc0fb2af?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/8a6fb3cc7ba2f69d2189ba532aec4633ea7ed75ac0af162ec367cb3abc0fb2af?s=96&d=mm&r=g","caption":"\u79d1, \u9896"},"url":"https:\/\/www.silicloud.com\/zh\/blog\/author\/keying\/"},{"@type":"ImageObject","inLanguage":"zh-Hans","@id":"https:\/\/www.silicloud.com\/zh\/blog\/%e5%85%88%e8%af%95%e7%9d%80%e8%bf%90%e8%a1%8c%e4%b8%80%e4%b8%8b-yarn-graphql-codegen-init%e3%80%82\/#local-main-organization-logo","url":"","contentUrl":"","caption":"Blog - Silicon Cloud"}]}},"_links":{"self":[{"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/posts\/47531","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/comments?post=47531"}],"version-history":[{"count":2,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/posts\/47531\/revisions"}],"predecessor-version":[{"id":97629,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/posts\/47531\/revisions\/97629"}],"wp:attachment":[{"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/media?parent=47531"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/categories?post=47531"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/tags?post=47531"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}