[{"data":1,"prerenderedAt":1211},["ShallowReactive",2],{"docs-/posts/tech/pnpm-monorepo-custom-condition":3,"docs-/tech/pnpm-monorepo-custom-condition-surround":1205},{"id":4,"title":5,"body":6,"categories":1193,"description":1195,"draft":1196,"extension":1197,"meta":1198,"navigation":612,"path":1199,"priority":1200,"publishedAt":1201,"secret":1196,"seo":1202,"stem":1203,"updatedAt":1201,"__hash__":1204},"posts/tech/pnpm-monorepo-custom-condition.md","pnpm monorepo でビルドいらずのパッケージ参照を実現する — Custom Condition という選択肢",{"type":7,"value":8,"toc":1178},"minimal",[9,13,17,30,33,37,40,50,57,127,134,140,146,152,155,157,161,174,177,183,185,188,196,208,379,390,395,410,516,520,529,715,717,720,748,758,764,772,778,781,783,787,794,911,917,919,923,986,988,991,1089,1091,1094,1097,1171,1174],[10,11,12],"h2",{"id":12},"はじめに",[14,15,16],"p",{},"pnpm の monorepo でコンポーネントライブラリとそれを使うカタログサイトを同時に開発していると、「ライブラリを変更するたびにビルドが必要」という問題に直面します。",[14,18,19,20,24,25,29],{},"この記事では、",[21,22,23],"code",{},"package.json"," の ",[26,27,28],"strong",{},"Custom Condition（カスタムコンディション）"," を使って、ビルドなしで TypeScript ソースを直接参照できるようにする方法を紹介します。今回は Astro（SSR あり）の構成を例に説明します。",[31,32],"hr",{},[10,34,36],{"id":35},"背景monorepo-でよくある問題","背景：monorepo でよくある問題",[14,38,39],{},"次のような構成を考えます。",[41,42,48],"pre",{"className":43,"code":45,"language":46,"meta":47},[44],"language-text","packages/\n  component-lib/      ← React コンポーネント群\n  catalog-site/       ← Astro コンポーネントカタログサイト\n","text","",[21,49,45],{"__ignoreMap":47},[14,51,52,53,56],{},"カタログサイトは ",[21,54,55],{},"workspace:*"," でコンポーネントライブラリに依存しています。",[41,58,62],{"className":59,"code":60,"language":61,"meta":47,"style":47},"language-json shiki shiki-themes material-theme","{\n  \"dependencies\": {\n    \"@myorg/component-lib\": \"workspace:*\"\n  }\n}\n","json",[21,63,64,73,92,115,121],{"__ignoreMap":47},[65,66,69],"span",{"class":67,"line":68},"line",1,[65,70,72],{"class":71},"sAklC","{\n",[65,74,76,79,83,86,89],{"class":67,"line":75},2,[65,77,78],{"class":71},"  \"",[65,80,82],{"class":81},"sJ14y","dependencies",[65,84,85],{"class":71},"\"",[65,87,88],{"class":71},":",[65,90,91],{"class":71}," {\n",[65,93,95,98,102,104,106,109,112],{"class":67,"line":94},3,[65,96,97],{"class":71},"    \"",[65,99,101],{"class":100},"s5Dmg","@myorg/component-lib",[65,103,85],{"class":71},[65,105,88],{"class":71},[65,107,108],{"class":71}," \"",[65,110,55],{"class":111},"sfyAc",[65,113,114],{"class":71},"\"\n",[65,116,118],{"class":67,"line":117},4,[65,119,120],{"class":71},"  }\n",[65,122,124],{"class":67,"line":123},5,[65,125,126],{"class":71},"}\n",[14,128,129,130,133],{},"コンポーネントライブラリは ",[21,131,132],{},"dist/"," をビルド成果物として publish しているため、ディレクトリ構成は以下のようになっています。",[41,135,138],{"className":136,"code":137,"language":46,"meta":47},[44],"component-lib/\n  src/        ← TypeScript ソース\n  dist/       ← ビルド成果物（.mjs / .cjs / .d.mts）\n",[21,139,137],{"__ignoreMap":47},[14,141,142,143,145],{},"カタログサイトの Vite はデフォルトで ",[21,144,132],{}," の成果物を参照するため、ライブラリを変更するたびに次の手順が必要です。",[41,147,150],{"className":148,"code":149,"language":46,"meta":47},[44],"コンポーネントライブラリを変更\n    ↓\npnpm --filter component-lib build  ← 毎回これが必要\n    ↓\nカタログサイトで変更が反映される\n",[21,151,149],{"__ignoreMap":47},[14,153,154],{},"これが開発体験を大きく損ないます。",[31,156],{},[10,158,160],{"id":159},"解決策custom-condition","解決策：Custom Condition",[14,162,163,164,167,168,24,170,173],{},"Node.js / Vite には ",[26,165,166],{},"条件付きエクスポート（Conditional Exports）"," という仕組みがあります。\n",[21,169,23],{},[21,171,172],{},"exports"," フィールドで「どの条件のときにどのファイルを返すか」を定義できます。",[14,175,176],{},"この仕組みを使って、開発時だけ TypeScript ソースを直接参照させます。",[41,178,181],{"className":179,"code":180,"language":46,"meta":47},[44],"コンポーネントライブラリを変更\n    ↓\n即座に反映される ✅（ビルド不要）\n",[21,182,180],{"__ignoreMap":47},[31,184],{},[10,186,187],{"id":187},"設定方法",[189,190,192,193,195],"h3",{"id":191},"_1-コンポーネントライブラリ側exports-にカスタムコンディションを追加","1. コンポーネントライブラリ側：",[21,194,172],{}," にカスタムコンディションを追加",[14,197,198,24,201,203,204,207],{},[21,199,200],{},"packages/component-lib/package.json",[21,202,172],{}," フィールドに、",[21,205,206],{},"@lib/source"," というカスタムコンディションを追加します。",[41,209,211],{"className":59,"code":210,"language":61,"meta":47,"style":47},"{\n  \"exports\": {\n    \".\": {\n      \"@lib/source\": \"./src/index.ts\",\n      \"types\": {\n        \"import\": \"./dist/index.d.mts\",\n        \"require\": \"./dist/index.d.cts\"\n      },\n      \"import\": \"./dist/index.mjs\",\n      \"require\": \"./dist/index.cjs\"\n    }\n  }\n}\n",[21,212,213,217,229,242,264,277,300,319,325,345,363,369,374],{"__ignoreMap":47},[65,214,215],{"class":67,"line":68},[65,216,72],{"class":71},[65,218,219,221,223,225,227],{"class":67,"line":75},[65,220,78],{"class":71},[65,222,172],{"class":81},[65,224,85],{"class":71},[65,226,88],{"class":71},[65,228,91],{"class":71},[65,230,231,233,236,238,240],{"class":67,"line":94},[65,232,97],{"class":71},[65,234,235],{"class":100},".",[65,237,85],{"class":71},[65,239,88],{"class":71},[65,241,91],{"class":71},[65,243,244,247,250,252,254,256,259,261],{"class":67,"line":117},[65,245,246],{"class":71},"      \"",[65,248,206],{"class":249},"sx098",[65,251,85],{"class":71},[65,253,88],{"class":71},[65,255,108],{"class":71},[65,257,258],{"class":111},"./src/index.ts",[65,260,85],{"class":71},[65,262,263],{"class":71},",\n",[65,265,266,268,271,273,275],{"class":67,"line":123},[65,267,246],{"class":71},[65,269,270],{"class":249},"types",[65,272,85],{"class":71},[65,274,88],{"class":71},[65,276,91],{"class":71},[65,278,280,283,287,289,291,293,296,298],{"class":67,"line":279},6,[65,281,282],{"class":71},"        \"",[65,284,286],{"class":285},"s-wAU","import",[65,288,85],{"class":71},[65,290,88],{"class":71},[65,292,108],{"class":71},[65,294,295],{"class":111},"./dist/index.d.mts",[65,297,85],{"class":71},[65,299,263],{"class":71},[65,301,303,305,308,310,312,314,317],{"class":67,"line":302},7,[65,304,282],{"class":71},[65,306,307],{"class":285},"require",[65,309,85],{"class":71},[65,311,88],{"class":71},[65,313,108],{"class":71},[65,315,316],{"class":111},"./dist/index.d.cts",[65,318,114],{"class":71},[65,320,322],{"class":67,"line":321},8,[65,323,324],{"class":71},"      },\n",[65,326,328,330,332,334,336,338,341,343],{"class":67,"line":327},9,[65,329,246],{"class":71},[65,331,286],{"class":249},[65,333,85],{"class":71},[65,335,88],{"class":71},[65,337,108],{"class":71},[65,339,340],{"class":111},"./dist/index.mjs",[65,342,85],{"class":71},[65,344,263],{"class":71},[65,346,348,350,352,354,356,358,361],{"class":67,"line":347},10,[65,349,246],{"class":71},[65,351,307],{"class":249},[65,353,85],{"class":71},[65,355,88],{"class":71},[65,357,108],{"class":71},[65,359,360],{"class":111},"./dist/index.cjs",[65,362,114],{"class":71},[65,364,366],{"class":67,"line":365},11,[65,367,368],{"class":71},"    }\n",[65,370,372],{"class":67,"line":371},12,[65,373,120],{"class":71},[65,375,377],{"class":67,"line":376},13,[65,378,126],{"class":71},[14,380,381,383,384,386,387,389],{},[21,382,206],{}," という条件が有効なときだけ ",[21,385,258],{},"（TypeScript ソース）を返し、それ以外は従来どおり ",[21,388,132],{}," の成果物を返します。",[391,392,394],"h4",{"id":393},"️-条件の順番が重要","⚠️ 条件の順番が重要",[14,396,397,398,403,404,406,407,409],{},"カスタムコンディションは ",[26,399,400,402],{},[21,401,172],{}," 内で一番上に配置","してください。Node.js / Vite は条件を上から順に評価し、最初にマッチしたものを使います。",[21,405,286],{}," や ",[21,408,270],{}," より下に置くと先にマッチしてしまい、カスタムコンディションが無視されます。",[41,411,413],{"className":59,"code":412,"language":61,"meta":47,"style":47},"{\n  \"exports\": {\n    \".\": {\n      \"@lib/source\": \"./src/index.ts\",  // ✅ 一番上に置く\n      \"import\": \"./dist/index.mjs\",     // 下にあるので @lib/source が優先される\n      \"default\": \"./dist/index.mjs\"\n    }\n  }\n}\n",[21,414,415,419,431,443,466,487,504,508,512],{"__ignoreMap":47},[65,416,417],{"class":67,"line":68},[65,418,72],{"class":71},[65,420,421,423,425,427,429],{"class":67,"line":75},[65,422,78],{"class":71},[65,424,172],{"class":81},[65,426,85],{"class":71},[65,428,88],{"class":71},[65,430,91],{"class":71},[65,432,433,435,437,439,441],{"class":67,"line":94},[65,434,97],{"class":71},[65,436,235],{"class":100},[65,438,85],{"class":71},[65,440,88],{"class":71},[65,442,91],{"class":71},[65,444,445,447,449,451,453,455,457,459,462],{"class":67,"line":117},[65,446,246],{"class":71},[65,448,206],{"class":249},[65,450,85],{"class":71},[65,452,88],{"class":71},[65,454,108],{"class":71},[65,456,258],{"class":111},[65,458,85],{"class":71},[65,460,461],{"class":71},",",[65,463,465],{"class":464},"s0_hs","  // ✅ 一番上に置く\n",[65,467,468,470,472,474,476,478,480,482,484],{"class":67,"line":123},[65,469,246],{"class":71},[65,471,286],{"class":249},[65,473,85],{"class":71},[65,475,88],{"class":71},[65,477,108],{"class":71},[65,479,340],{"class":111},[65,481,85],{"class":71},[65,483,461],{"class":71},[65,485,486],{"class":464},"     // 下にあるので @lib/source が優先される\n",[65,488,489,491,494,496,498,500,502],{"class":67,"line":279},[65,490,246],{"class":71},[65,492,493],{"class":249},"default",[65,495,85],{"class":71},[65,497,88],{"class":71},[65,499,108],{"class":71},[65,501,340],{"class":111},[65,503,114],{"class":71},[65,505,506],{"class":67,"line":302},[65,507,368],{"class":71},[65,509,510],{"class":67,"line":321},[65,511,120],{"class":71},[65,513,514],{"class":67,"line":327},[65,515,126],{"class":71},[189,517,519],{"id":518},"_2-カタログサイト側vite-に条件を渡す","2. カタログサイト側：Vite に条件を渡す",[14,521,522,525,526,528],{},[21,523,524],{},"packages/catalog-site/astro.config.mjs"," で、開発時のみ ",[21,527,206],{}," コンディションを有効化します。",[41,530,534],{"className":531,"code":532,"language":533,"meta":47,"style":47},"language-js shiki shiki-themes material-theme","const resolve =\n  process.env.NODE_ENV === \"development\"\n    ? { conditions: [\"@lib/source\"] }\n    : undefined;\n\nexport default defineConfig({\n  vite: {\n    resolve: resolve,\n    ssr: {\n      noExternal: [\"@myorg/component-lib\"],\n      resolve: resolve,\n    },\n  },\n});\n","js",[21,535,536,548,573,600,608,614,632,641,653,662,682,693,698,703],{"__ignoreMap":47},[65,537,538,541,545],{"class":67,"line":68},[65,539,540],{"class":81},"const",[65,542,544],{"class":543},"svy0-"," resolve ",[65,546,547],{"class":71},"=\n",[65,549,550,553,555,558,560,563,566,568,571],{"class":67,"line":75},[65,551,552],{"class":543},"  process",[65,554,235],{"class":71},[65,556,557],{"class":543},"env",[65,559,235],{"class":71},[65,561,562],{"class":543},"NODE_ENV ",[65,564,565],{"class":71},"===",[65,567,108],{"class":71},[65,569,570],{"class":111},"development",[65,572,114],{"class":71},[65,574,575,578,581,584,586,589,591,593,595,598],{"class":67,"line":94},[65,576,577],{"class":71},"    ?",[65,579,580],{"class":71}," {",[65,582,583],{"class":285}," conditions",[65,585,88],{"class":71},[65,587,588],{"class":543}," [",[65,590,85],{"class":71},[65,592,206],{"class":111},[65,594,85],{"class":71},[65,596,597],{"class":543},"] ",[65,599,126],{"class":71},[65,601,602,605],{"class":67,"line":117},[65,603,604],{"class":71},"    :",[65,606,607],{"class":71}," undefined;\n",[65,609,610],{"class":67,"line":123},[65,611,613],{"emptyLinePlaceholder":612},true,"\n",[65,615,616,620,623,627,630],{"class":67,"line":279},[65,617,619],{"class":618},"s6cf3","export",[65,621,622],{"class":618}," default",[65,624,626],{"class":625},"sdLwU"," defineConfig",[65,628,629],{"class":543},"(",[65,631,72],{"class":71},[65,633,634,637,639],{"class":67,"line":302},[65,635,636],{"class":285},"  vite",[65,638,88],{"class":71},[65,640,91],{"class":71},[65,642,643,646,648,651],{"class":67,"line":321},[65,644,645],{"class":285},"    resolve",[65,647,88],{"class":71},[65,649,650],{"class":543}," resolve",[65,652,263],{"class":71},[65,654,655,658,660],{"class":67,"line":327},[65,656,657],{"class":285},"    ssr",[65,659,88],{"class":71},[65,661,91],{"class":71},[65,663,664,667,669,671,673,675,677,680],{"class":67,"line":347},[65,665,666],{"class":285},"      noExternal",[65,668,88],{"class":71},[65,670,588],{"class":543},[65,672,85],{"class":71},[65,674,101],{"class":111},[65,676,85],{"class":71},[65,678,679],{"class":543},"]",[65,681,263],{"class":71},[65,683,684,687,689,691],{"class":67,"line":365},[65,685,686],{"class":285},"      resolve",[65,688,88],{"class":71},[65,690,650],{"class":543},[65,692,263],{"class":71},[65,694,695],{"class":67,"line":371},[65,696,697],{"class":71},"    },\n",[65,699,700],{"class":67,"line":376},[65,701,702],{"class":71},"  },\n",[65,704,706,709,712],{"class":67,"line":705},14,[65,707,708],{"class":71},"}",[65,710,711],{"class":543},")",[65,713,714],{"class":71},";\n",[31,716],{},[10,718,719],{"id":719},"動作の仕組み",[41,721,723],{"className":531,"code":722,"language":533,"meta":47,"style":47},"import { Button } from \"@myorg/component-lib\";\n",[21,724,725],{"__ignoreMap":47},[65,726,727,729,731,734,737,740,742,744,746],{"class":67,"line":68},[65,728,286],{"class":618},[65,730,580],{"class":71},[65,732,733],{"class":543}," Button",[65,735,736],{"class":71}," }",[65,738,739],{"class":618}," from",[65,741,108],{"class":71},[65,743,101],{"class":111},[65,745,85],{"class":71},[65,747,714],{"class":71},[14,749,750,753,754,757],{},[26,751,752],{},"開発時","（",[21,755,756],{},"NODE_ENV=development","）",[41,759,762],{"className":760,"code":761,"language":46,"meta":47},[44],"Vite が exports を解決\n  → conditions に \"@lib/source\" が含まれる\n  → \"./src/index.ts\" を返す\n  → ビルド不要でソース直参照 ✅\n",[21,763,761],{"__ignoreMap":47},[14,765,766,753,769,757],{},[26,767,768],{},"本番ビルド時",[21,770,771],{},"NODE_ENV=production",[41,773,776],{"className":774,"code":775,"language":46,"meta":47},[44],"Vite が exports を解決\n  → conditions に \"@lib/source\" が含まれない\n  → \"./dist/index.mjs\" を返す\n  → 通常のビルド成果物を参照 ✅\n",[21,777,775],{"__ignoreMap":47},[14,779,780],{},"本番ビルドの挙動は従来と変わらないため、安心して導入できます。",[31,782],{},[10,784,786],{"id":785},"astrossrでの注意点","Astro（SSR）での注意点",[14,788,789,790,793],{},"Astro は SSR を持つため、",[26,791,792],{},"クライアント / サーバーの両側","で条件を設定する必要があります。",[41,795,797],{"className":531,"code":796,"language":533,"meta":47,"style":47},"vite: {\n  // クライアントサイドバンドル向け\n  resolve: { conditions: [\"@lib/source\"] },\n\n  ssr: {\n    // サーバーサイドバンドル向け\n    noExternal: [\"@myorg/component-lib\"],  // ← これも必要\n    resolve: { conditions: [\"@lib/source\"] },\n  },\n}\n",[21,798,799,808,813,839,843,852,857,879,903,907],{"__ignoreMap":47},[65,800,801,804,806],{"class":67,"line":68},[65,802,803],{"class":100},"vite",[65,805,88],{"class":71},[65,807,91],{"class":71},[65,809,810],{"class":67,"line":75},[65,811,812],{"class":464},"  // クライアントサイドバンドル向け\n",[65,814,815,818,820,822,824,826,828,830,832,834,836],{"class":67,"line":94},[65,816,817],{"class":100},"  resolve",[65,819,88],{"class":71},[65,821,580],{"class":71},[65,823,583],{"class":100},[65,825,88],{"class":71},[65,827,588],{"class":285},[65,829,85],{"class":71},[65,831,206],{"class":111},[65,833,85],{"class":71},[65,835,597],{"class":285},[65,837,838],{"class":71},"},\n",[65,840,841],{"class":67,"line":117},[65,842,613],{"emptyLinePlaceholder":612},[65,844,845,848,850],{"class":67,"line":123},[65,846,847],{"class":100},"  ssr",[65,849,88],{"class":71},[65,851,91],{"class":71},[65,853,854],{"class":67,"line":279},[65,855,856],{"class":464},"    // サーバーサイドバンドル向け\n",[65,858,859,862,864,866,868,870,872,874,876],{"class":67,"line":302},[65,860,861],{"class":100},"    noExternal",[65,863,88],{"class":71},[65,865,588],{"class":285},[65,867,85],{"class":71},[65,869,101],{"class":111},[65,871,85],{"class":71},[65,873,679],{"class":285},[65,875,461],{"class":71},[65,877,878],{"class":464},"  // ← これも必要\n",[65,880,881,883,885,887,889,891,893,895,897,899,901],{"class":67,"line":321},[65,882,645],{"class":100},[65,884,88],{"class":71},[65,886,580],{"class":71},[65,888,583],{"class":100},[65,890,88],{"class":71},[65,892,588],{"class":285},[65,894,85],{"class":71},[65,896,206],{"class":111},[65,898,85],{"class":71},[65,900,597],{"class":285},[65,902,838],{"class":71},[65,904,905],{"class":67,"line":327},[65,906,702],{"class":71},[65,908,909],{"class":67,"line":347},[65,910,126],{"class":71},[14,912,913,916],{},[21,914,915],{},"ssr.noExternal"," を指定しないと、SSR バンドル時にコンポーネントライブラリが「外部パッケージ」扱いされ、カスタムコンディションが無視されます。Astro を使う場合は忘れずに設定してください。",[31,918],{},[10,920,922],{"id":921},"メリットデメリット","メリット・デメリット",[924,925,926,938],"table",{},[927,928,929],"thead",{},[930,931,932,935],"tr",{},[933,934],"th",{},[933,936,937],{},"内容",[939,940,941,950,957,964,972,979],"tbody",{},[930,942,943,947],{},[944,945,946],"td",{},"✅",[944,948,949],{},"ビルド不要で即座にソース変更が反映される",[930,951,952,954],{},[944,953,946],{},[944,955,956],{},"HMR が正しく動作する",[930,958,959,961],{},[944,960,946],{},[944,962,963],{},"本番ビルドは従来と変わらない",[930,965,966,969],{},[944,967,968],{},"⚠️",[944,970,971],{},"Vite / バンドラ側での設定が必要",[930,973,974,976],{},[944,975,968],{},[944,977,978],{},"TS ソースをそのまま食わせるため、消費側が TypeScript に対応している必要がある",[930,980,981,983],{},[944,982,968],{},[944,984,985],{},"カスタム条件名の命名を慣習として統一する必要がある",[31,987],{},[10,989,990],{"id":990},"代替手法との比較",[924,992,993,1009],{},[927,994,995],{},[930,996,997,1000,1003,1006],{},[933,998,999],{},"手法",[933,1001,1002],{},"ビルド不要",[933,1004,1005],{},"設定コスト",[933,1007,1008],{},"備考",[939,1010,1011,1026,1045,1061,1075],{},[930,1012,1013,1018,1020,1023],{},[944,1014,1015],{},[26,1016,1017],{},"Custom Condition",[944,1019,946],{},[944,1021,1022],{},"低",[944,1024,1025],{},"本記事の手法",[930,1027,1028,1038,1040,1042],{},[944,1029,1030,1033,1034,1037],{},[21,1031,1032],{},"exports[\".\"]"," を ",[21,1035,1036],{},"src/"," に直接向ける",[944,1039,946],{},[944,1041,1022],{},[944,1043,1044],{},"本番も src 参照になってしまう",[930,1046,1047,1053,1055,1058],{},[944,1048,1049,1052],{},[21,1050,1051],{},"vite-plugin-turbo-resolve"," 等",[944,1054,946],{},[944,1056,1057],{},"中",[944,1059,1060],{},"追加依存が増える",[930,1062,1063,1068,1070,1072],{},[944,1064,1065],{},[21,1066,1067],{},"tsconfig paths",[944,1069,946],{},[944,1071,1057],{},[944,1073,1074],{},"バンドラによっては動かない",[930,1076,1077,1080,1083,1086],{},[944,1078,1079],{},"毎回 build",[944,1081,1082],{},"❌",[944,1084,1085],{},"なし",[944,1087,1088],{},"開発体験が辛い",[31,1090],{},[10,1092,1093],{"id":1093},"まとめ",[14,1095,1096],{},"Custom Condition を使ったビルドレス参照の設定は、次の 3 ステップです。",[1098,1099,1100,1135,1161],"ol",{},[1101,1102,1103,1104,24,1106,1108,1109,1112,1113],"li",{},"コンポーネントライブラリの ",[21,1105,23],{},[21,1107,172],{}," にカスタムコンディションを追加する（",[26,1110,1111],{},"一番上に配置","すること）",[41,1114,1116],{"className":59,"code":1115,"language":61,"meta":47,"style":47},"\"@lib/source\": \"./src/index.ts\"\n",[21,1117,1118],{"__ignoreMap":47},[65,1119,1120,1122,1124,1126,1129,1131,1133],{"class":67,"line":68},[65,1121,85],{"class":71},[65,1123,206],{"class":111},[65,1125,85],{"class":71},[65,1127,1128],{"class":543},": ",[65,1130,85],{"class":71},[65,1132,258],{"class":111},[65,1134,114],{"class":71},[1101,1136,1137,1138],{},"カタログサイトの Vite 設定で、開発時のみ条件を渡す",[41,1139,1141],{"className":531,"code":1140,"language":533,"meta":47,"style":47},"conditions: [\"@lib/source\"]\n",[21,1142,1143],{"__ignoreMap":47},[65,1144,1145,1148,1150,1152,1154,1156,1158],{"class":67,"line":68},[65,1146,1147],{"class":100},"conditions",[65,1149,88],{"class":71},[65,1151,588],{"class":543},[65,1153,85],{"class":71},[65,1155,206],{"class":111},[65,1157,85],{"class":71},[65,1159,1160],{"class":543},"]\n",[1101,1162,1163,1164,1166,1167,1170],{},"Astro（SSR あり）の場合は ",[21,1165,915],{}," と ",[21,1168,1169],{},"ssr.resolve.conditions"," も設定する",[14,1172,1173],{},"設定量は少なく、本番ビルドへの影響もありません。monorepo で複数パッケージを並行開発している方はぜひ試してみてください。",[1175,1176,1177],"style",{},"html pre.shiki code .sAklC, html code.shiki .sAklC{--shiki-default:#89DDFF}html pre.shiki code .sJ14y, html code.shiki .sJ14y{--shiki-default:#C792EA}html pre.shiki code .s5Dmg, html code.shiki .s5Dmg{--shiki-default:#FFCB6B}html pre.shiki code .sfyAc, html code.shiki .sfyAc{--shiki-default:#C3E88D}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html pre.shiki code .sx098, html code.shiki .sx098{--shiki-default:#F78C6C}html pre.shiki code .s-wAU, html code.shiki .s-wAU{--shiki-default:#F07178}html pre.shiki code .s0_hs, html code.shiki .s0_hs{--shiki-default:#546E7A;--shiki-default-font-style:italic}html pre.shiki code .svy0-, html code.shiki .svy0-{--shiki-default:#EEFFFF}html pre.shiki code .s6cf3, html code.shiki .s6cf3{--shiki-default:#89DDFF;--shiki-default-font-style:italic}html pre.shiki code .sdLwU, html code.shiki .sdLwU{--shiki-default:#82AAFF}",{"title":47,"searchDepth":75,"depth":75,"links":1179},[1180,1181,1182,1183,1188,1189,1190,1191,1192],{"id":12,"depth":75,"text":12},{"id":35,"depth":75,"text":36},{"id":159,"depth":75,"text":160},{"id":187,"depth":75,"text":187,"children":1184},[1185,1187],{"id":191,"depth":94,"text":1186},"1. コンポーネントライブラリ側：exports にカスタムコンディションを追加",{"id":518,"depth":94,"text":519},{"id":719,"depth":75,"text":719},{"id":785,"depth":75,"text":786},{"id":921,"depth":75,"text":922},{"id":990,"depth":75,"text":990},{"id":1093,"depth":75,"text":1093},[1194],"Tech","pnpm monorepo でコンポーネントライブラリを変更するたびにビルドが必要な問題を、package.json の Custom Condition を使ってビルドなしで TypeScript ソースを直接参照できるように解決する方法を紹介します。",false,"md",{},"/tech/pnpm-monorepo-custom-condition",null,"2026-04-03",{"title":5,"description":1195},"tech/pnpm-monorepo-custom-condition","x9NdF3Pp6hp8-QaBTszRTFeL4ik5-23MjP73UhS4-P4",[1200,1206],{"title":1207,"path":1208,"stem":1209,"description":1210,"children":-1},"CustomSingleChildLayout と仲良くなって自由にウィジェットを配置しよう","/tech/custom-single-child-layout","tech/custom-single-child-layout","Stack + Positioned では対応できない動的なウィジェット配置を CustomSingleChildLayout で解決する方法を、Flutter の UI 構築フェーズの仕組みとともに解説する",1778491807107]