[{"data":1,"prerenderedAt":474},["Reactive",2],{"$KyeTl6nybl":3,"page-data":4,"page-tree":454},[],{"_path":5,"_dir":6,"_draft":7,"_partial":7,"_locale":8,"title":9,"description":8,"body":10,"_type":449,"_id":450,"_source":451,"_file":452,"_extension":453},"/documentation/guides/pnpm-workspace","guides",false,"","Pnpm workspace",{"type":11,"children":12,"toc":446},"root",[13,62,169,299],{"type":14,"tag":15,"props":16,"children":18},"element","doc-component-demo",{"title":17},"Introduction",[19,26,31,36,40,45],{"type":14,"tag":20,"props":21,"children":22},"p",{},[23],{"type":24,"value":25},"text","Pnpm workspace is a powerful tool for managing multiple packages in a single repository. It can help you keep your dependencies in sync and reduce the time and disk space required for package installation. If you're working on a project that uses pnpm workspace, you can take advantage of this feature to manage your packages more efficiently.",{"type":14,"tag":20,"props":27,"children":28},{},[29],{"type":24,"value":30},"Another feature of pnpm workspace is hoisting, which allows you to install dependencies at the root level instead of in each workspace. This can further reduce the disk space and installation time required for your packages.",{"type":14,"tag":20,"props":32,"children":33},{},[34],{"type":24,"value":35},"Overall, pnpm workspace can be a powerful tool for managing multiple packages in a single repository. It can help you keep your dependencies in sync and reduce the time and disk space required for package installation. If you're new to pnpm workspace, it's worth taking the time to learn how to use it effectively.",{"type":14,"tag":37,"props":38,"children":39},"hr",{},[],{"type":14,"tag":20,"props":41,"children":42},{},[43],{"type":24,"value":44},"Useful resources:",{"type":14,"tag":46,"props":47,"children":48},"ul",{},[49],{"type":14,"tag":50,"props":51,"children":52},"li",{},[53],{"type":14,"tag":54,"props":55,"children":59},"a",{"href":56,"rel":57},"https://pnpm.io/workspaces",[58],"nofollow",[60],{"type":24,"value":61},"Read more about workspace on pnpm.io",{"type":14,"tag":15,"props":63,"children":65},{"title":64},"Workspace structure",[66,80,96,117,122,134,154],{"type":14,"tag":20,"props":67,"children":68},{},[69,71,78],{"type":24,"value":70},"Pnpm use a ",{"type":14,"tag":72,"props":73,"children":75},"code",{"className":74},[],[76],{"type":24,"value":77},"pnpm-workspace.yaml",{"type":24,"value":79}," file to define the workspace structure. This file is located at the root of the project and contains a list of workspace directories.",{"type":14,"tag":81,"props":82,"children":83},"code-group",{},[84],{"type":14,"tag":85,"props":86,"children":91},"pre",{"className":87,"code":89,"filename":77,"language":90,"meta":8},[88],"language-yaml","packages:\n  - .app\n  - .demo\n  - layers/*\n","yaml",[92],{"type":14,"tag":72,"props":93,"children":94},{"__ignoreMap":8},[95],{"type":24,"value":89},{"type":14,"tag":20,"props":97,"children":98},{},[99,101,107,109,115],{"type":24,"value":100},"All folders listed in this file that contains a ",{"type":14,"tag":72,"props":102,"children":104},{"className":103},[],[105],{"type":24,"value":106},"package.json",{"type":24,"value":108}," file will be considered in the workspace. You can use wildcards to automatically include all folders that match a pattern, like with the ",{"type":14,"tag":72,"props":110,"children":112},{"className":111},[],[113],{"type":24,"value":114},"layers/*",{"type":24,"value":116}," entry above.",{"type":14,"tag":20,"props":118,"children":119},{},[120],{"type":24,"value":121},"As an example, you could create a new folder for your backend and add it to the workspace:",{"type":14,"tag":81,"props":123,"children":124},{},[125],{"type":14,"tag":85,"props":126,"children":129},{"className":127,"code":128,"filename":77,"language":90,"meta":8},[88],"packages:\n  - .app\n  - .backend # replace unused .demo with .backend\n  - layers/*\n",[130],{"type":14,"tag":72,"props":131,"children":132},{"__ignoreMap":8},[133],{"type":24,"value":128},{"type":14,"tag":20,"props":135,"children":136},{},[137,139,144,146,152],{"type":24,"value":138},"Then create a ",{"type":14,"tag":72,"props":140,"children":142},{"className":141},[],[143],{"type":24,"value":106},{"type":24,"value":145}," file in the ",{"type":14,"tag":72,"props":147,"children":149},{"className":148},[],[150],{"type":24,"value":151},".backend",{"type":24,"value":153}," folder:",{"type":14,"tag":81,"props":155,"children":156},{},[157],{"type":14,"tag":85,"props":158,"children":164},{"className":159,"code":161,"filename":162,"language":163,"meta":8},[160],"language-json","{\n  \"name\": \"my-backend\",\n  \"private\": true,\n  \"version\": \"1.0.0\"\n}\n",".backend/package.json","json",[165],{"type":14,"tag":72,"props":166,"children":167},{"__ignoreMap":8},[168],{"type":24,"value":161},{"type":14,"tag":15,"props":170,"children":172},{"title":171},"Install dependencies in the right place",[173,185,198,213,241,274,287],{"type":14,"tag":20,"props":174,"children":175},{},[176,178,183],{"type":24,"value":177},"By default, if you don't specify a package filter, pnpm will install dependencies in the root ",{"type":14,"tag":72,"props":179,"children":181},{"className":180},[],[182],{"type":24,"value":106},{"type":24,"value":184}," file. This is not what we want when using pnpm workspace.",{"type":14,"tag":20,"props":186,"children":187},{},[188,190,196],{"type":24,"value":189},"Instead we want to install it in the package that contains our layer. For example, if we want to install a dependency in the ",{"type":14,"tag":72,"props":191,"children":193},{"className":192},[],[194],{"type":24,"value":195},".app",{"type":24,"value":197}," layer, we should use the following command:",{"type":14,"tag":81,"props":199,"children":200},{},[201],{"type":14,"tag":85,"props":202,"children":208},{"className":203,"code":205,"filename":206,"language":207,"meta":8},[204],"language-bash","pnpm --filter=app install --dev my-dependency\n","Terminal","bash",[209],{"type":14,"tag":72,"props":210,"children":211},{"__ignoreMap":8},[212],{"type":24,"value":205},{"type":14,"tag":20,"props":214,"children":215},{},[216,218,224,226,231,233,239],{"type":24,"value":217},"This will find packages in the workspace that has the name ",{"type":14,"tag":72,"props":219,"children":221},{"className":220},[],[222],{"type":24,"value":223},"app",{"type":24,"value":225}," in their ",{"type":14,"tag":72,"props":227,"children":229},{"className":228},[],[230],{"type":24,"value":106},{"type":24,"value":232}," and install the dependency in it (here it matches ",{"type":14,"tag":72,"props":234,"children":236},{"className":235},[],[237],{"type":24,"value":238},"\u003Capp>/package.json",{"type":24,"value":240}," name).",{"type":14,"tag":242,"props":243,"children":246},"doc-message",{"color":244,"icon":245},"muted-contrast","ph:info",[247],{"type":14,"tag":20,"props":248,"children":249},{},[250,252,258,260,265,267,272],{"type":24,"value":251},"We could use ",{"type":14,"tag":72,"props":253,"children":255},{"className":254},[],[256],{"type":24,"value":257},"my-backend",{"type":24,"value":259}," from the previous example instead of ",{"type":14,"tag":72,"props":261,"children":263},{"className":262},[],[264],{"type":24,"value":223},{"type":24,"value":266}," to install the dependency in the ",{"type":14,"tag":72,"props":268,"children":270},{"className":269},[],[271],{"type":24,"value":151},{"type":24,"value":273}," package.",{"type":14,"tag":20,"props":275,"children":276},{},[277,279,285],{"type":24,"value":278},"Another option is to run ",{"type":14,"tag":72,"props":280,"children":282},{"className":281},[],[283],{"type":24,"value":284},"pnpm install",{"type":24,"value":286}," in the layer directory. This will install dependencies in the layer directory instead of the root directory.",{"type":14,"tag":81,"props":288,"children":289},{},[290],{"type":14,"tag":85,"props":291,"children":294},{"className":292,"code":293,"filename":206,"language":207,"meta":8},[204],"cd .app\npnpm install --dev my-dependency\n",[295],{"type":14,"tag":72,"props":296,"children":297},{"__ignoreMap":8},[298],{"type":24,"value":293},{"type":14,"tag":15,"props":300,"children":302},{"title":301},"Upgrading dependencies in a workspace",[303,324,336,341,377,394,414,426,429,433],{"type":14,"tag":20,"props":304,"children":305},{},[306,308,314,316,322],{"type":24,"value":307},"If you want to update a dependency in a workspace, you should use the ",{"type":14,"tag":72,"props":309,"children":311},{"className":310},[],[312],{"type":24,"value":313},"update",{"type":24,"value":315}," command with the ",{"type":14,"tag":72,"props":317,"children":319},{"className":318},[],[320],{"type":24,"value":321},"--recursive",{"type":24,"value":323}," flag in order to update the dependency in all layers.",{"type":14,"tag":81,"props":325,"children":326},{},[327],{"type":14,"tag":85,"props":328,"children":331},{"className":329,"code":330,"filename":206,"language":207,"meta":8},[204],"pnpm update --recursive --latest --interactive\n",[332],{"type":14,"tag":72,"props":333,"children":334},{"__ignoreMap":8},[335],{"type":24,"value":330},{"type":14,"tag":20,"props":337,"children":338},{},[339],{"type":24,"value":340},"Select dependencies you want to update and press enter.",{"type":14,"tag":20,"props":342,"children":343},{},[344,346,352,354,360,362,368,370,375],{"type":24,"value":345},"Once the update is done, you need to remove all ",{"type":14,"tag":72,"props":347,"children":349},{"className":348},[],[350],{"type":24,"value":351},"node_modules",{"type":24,"value":353}," folder using ",{"type":14,"tag":72,"props":355,"children":357},{"className":356},[],[358],{"type":24,"value":359},"pnpm clean:all",{"type":24,"value":361},", delete the ",{"type":14,"tag":72,"props":363,"children":365},{"className":364},[],[366],{"type":24,"value":367},"pnpm-lock.yaml",{"type":24,"value":369}," file and run ",{"type":14,"tag":72,"props":371,"children":373},{"className":372},[],[374],{"type":24,"value":284},{"type":24,"value":376}," again.",{"type":14,"tag":242,"props":378,"children":379},{"color":244,"icon":245},[380],{"type":14,"tag":20,"props":381,"children":382},{},[383,385,392],{"type":24,"value":384},"Note that it may be possible that we have patched some dependencies, updating them may or may not include our fixes. If you encounter any issue, please report it on our ",{"type":14,"tag":54,"props":386,"children":389},{"href":387,"rel":388},"https://cssninja/faq/support",[58],[390],{"type":24,"value":391},"Support Portal",{"type":24,"value":393},".",{"type":14,"tag":20,"props":395,"children":396},{},[397,399,405,407,412],{"type":24,"value":398},"Alternatively, you can also use ",{"type":14,"tag":72,"props":400,"children":402},{"className":401},[],[403],{"type":24,"value":404},"find",{"type":24,"value":406}," unix command to find all ",{"type":14,"tag":72,"props":408,"children":410},{"className":409},[],[411],{"type":24,"value":351},{"type":24,"value":413}," directory in the workspace and delete them:",{"type":14,"tag":81,"props":415,"children":416},{},[417],{"type":14,"tag":85,"props":418,"children":421},{"className":419,"code":420,"filename":206,"language":207,"meta":8},[204],"find . -maxdepth 4 -name node_modules -type d -prune -exec rm -rf {} \\;\n",[422],{"type":14,"tag":72,"props":423,"children":424},{"__ignoreMap":8},[425],{"type":24,"value":420},{"type":14,"tag":37,"props":427,"children":428},{},[],{"type":14,"tag":20,"props":430,"children":431},{},[432],{"type":24,"value":44},{"type":14,"tag":46,"props":434,"children":435},{},[436],{"type":14,"tag":50,"props":437,"children":438},{},[439],{"type":14,"tag":54,"props":440,"children":443},{"href":441,"rel":442},"https://pnpm.io/cli/update",[58],[444],{"type":24,"value":445},"Read update guide on pnpm.io",{"title":8,"searchDepth":447,"depth":447,"links":448},2,[],"markdown","content:documentation:50.guides:6.pnpm-workspace.md","content","documentation/50.guides/6.pnpm-workspace.md","md",[455,461,467],{"_path":456,"_dir":8,"_draft":7,"_partial":7,"_locale":8,"title":457,"description":8,"toc":458,"_type":449,"_id":459,"_source":451,"_file":460,"_extension":453},"/documentation","مرکز مستندات",true,"content:documentation:1.index.md","documentation/1.index.md",{"_path":462,"_dir":6,"_draft":7,"_partial":458,"_locale":8,"title":463,"_id":464,"_type":90,"_source":451,"_file":465,"_extension":466},"/documentation/guides/_dir","Guides","content:documentation:50.guides:_dir.yml","documentation/50.guides/_dir.yml","yml",{"_path":468,"_dir":469,"_draft":7,"_partial":7,"_locale":8,"title":8,"description":470,"navigation":7,"redirect":471,"_type":449,"_id":472,"_source":451,"_file":473,"_extension":453},"/documentation/guides","documentation","Redirecting to panels...","/documentation/guides/panels","content:documentation:50.guides:1.index.md","documentation/50.guides/1.index.md",1779173522920]