上下文
纱线工作区提供方便的单一回购功能,其中包自动链接.即,他们可以相互要求/导入,并且他们的二进制文件可以从工作区根目录链接和访问.
一个例子:
工作区/的package.json
{
"name": "200180719-yarn-bin",
"version": "1.0.0",
"workspaces": [
"packages/*"
],
"private": true
}
Run Code Online (Sandbox Code Playgroud)
工作区/包/ A /的package.json
{
"name": "a",
"version": "1.0.0",
"main": "src/index.js",
"bin": {
"mycli": "src/index.js"
}
}
Run Code Online (Sandbox Code Playgroud)
工作区/包/ A/src目录/ index.js
#!/usr/bin/env node
console.log('welcome to the cli')
Run Code Online (Sandbox Code Playgroud)
如果然后将目录更改为主工作区并运行yarn install,则yarn正确链接二进制文件,您可以运行:
yarn run mycli
Run Code Online (Sandbox Code Playgroud)
从工作区目录就好了.大!
问题
我yarn install遇到的问题是,如果你的代码首先必须编译,那么二进制文件在完成之前将不可用(因为你不应该在版本控制中提供已编译的代码).我使用Typescript来编译我的cli:
重命名index.js到index.ts并更新a/package.json到:
{
"name": "a",
"version": "1.0.0",
"main": "src/index.js",
"bin": {
"mycli": "dist/index.js"
},
"scripts": {
"build": "tsc src/index.ts --outDir dist", …Run Code Online (Sandbox Code Playgroud) 我有一个 Lerna 项目,直到最近才使用lerna bootstrap --hoist. 这很有效,但我发现devDependencies许多子文件夹中的大部分都是相同的。升级到 Lerna v3 我读过lerna link convert.
lerna link convert 是否只是将所有子文件夹移动devDependencies到根目录,然后子文件夹扫描父文件夹node_modules以加载它们(NPM 的一个功能)?我注意到子文件夹中的依赖项更改为“file://”而不是私有 npm 存储,这表明一旦发布和使用它们就不会被加载。
此外,如果lerna bootstrap被删除,则dependencies不会安装子模块。用什么方法解决这个问题?
我目前有一个 monorepo,其中有两个 (+) 使用纱线工作区的包:
root
/packages
/common
/web
...
root/package.json
...
"workspaces": {
"packages": [
"packages/*"
],
"nohoist": [
"**"
],
},
Run Code Online (Sandbox Code Playgroud)
web是一个带有 typescript 模板的普通 create-react-app。我有一些TS的代码common我想在使用web,但似乎CRA不支持编译的代码之外src,给我一个错误,当我尝试进口来自common于web:
../common/state/user/actions.ts 4:66
Module parse failed: Unexpected token (4:66)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| import { UpdateUserParams } from './reducer';
|
> export const login = …Run Code Online (Sandbox Code Playgroud) 我使用Lerna和Yarn 工作区构建了一个 monorepo 。
一切正常,但每次我在包上安装新的依赖项(我们称他为A)时,使用:
yarn add <package_name>
Run Code Online (Sandbox Code Playgroud)
Yarn 添加它,然后触发installmonorepo 中所有包的脚本,即使是A不依赖的包。
无论如何要避免这种情况?无缘无故地安装它们需要一些时间。
我有一个用 create React app 制作的有趣项目。我想将同一应用程序转换为浏览器扩展。这个想法迫使我将该项目设为单一存储库。因为在这两个应用程序中,我将使用相同的组件、钩子、提供程序等。
我不想使用 Lerna 或 Yarn 工作区。而且,这将是我的第一个单一仓库。我想开始使用 Turborepo。但是,我无法想象如何让它以良好的方式工作。
我的目标文件夹结构如下
我会将包文件夹中的 monorepo 依赖项导入到 apps 文件夹中存在的 apps 中。
例如;
import { useExampleHook } from '@projectname/hooks'
import { ExampleComponent } from '@projectname/components'
Run Code Online (Sandbox Code Playgroud)
如果您除了 Turborepo 之外还有其他解决方案,请随时告诉我。NPM 工作区也是一个可以接受的解决方案。但是,turborepo 由于性能更好而具有优先权。
预先感谢您的时间和答复
我正在为 Vue 3(vite + ts)、云函数和共享库(共享函数和 ts 接口等)设置一个 monorepo 工作区。
我可以导入本地共享库文件夹来工作。我通过在我的共享库上执行 npm run build -- -- watch 来在我的前端项目中进行实时类型检查。
然而由于某种原因,除非我卸载然后安装共享库包,否则转换为 Javascript 的所有内容都不会更新。
例如:在共享库中创建 const 并不能使其在我导入共享库的前端/后端项目中可用。但是创建一个界面,就是这样。
我尝试了一些方法并搜索了互联网的大部分内容。我尝试使用 vite.config,因为我认为它可能会对包进行某种缓存。
现在,我的 vite.config.ts 如下所示:
import { defineConfig } from "vite"
import vue from "@vitejs/plugin-vue"
// https://vitejs.dev/config/
export default defineConfig({
server: {
host: true,
},
plugins: [vue()],
resolve: {
preserveSymlinks: true,
},
optimizeDeps: {
include: ["shared-lib"],
},
})
Run Code Online (Sandbox Code Playgroud)
这是我的共享库中的index.ts:
// this is not usable / doesn't update live.
export const sharedConst = () => console.log("testing shared functionality") …Run Code Online (Sandbox Code Playgroud) 我想通过在同一 mono 存储库中重用来自后端 (Nest.js) 服务的类型、DTO 和其他同构应用程序内容来利用 monorepo。在我的例子中,next.js 应用程序和nest.js 应用程序(它本身就是一个nest.js monorepo)位于根目录中的同一级别。我正在重新导出一堆文件nest-app/libs/types/src/index.ts,然后将其导入到我的 next.js 应用程序中。但是当我这样做时,next.js 抱怨无法编译错误
重现错误的最简单方法是执行以下操作
test-importcd test-import)npx create-next-app@latest --typescript并为项目选择一个名称(例如next-app)external.ts文件(与 位于同一级别next-app)npm run dev从next-app文件夹运行Monorepo结构:
external.ts
next-app
(other files omitted)
pages
index.tsx
Run Code Online (Sandbox Code Playgroud)
外部.ts
export type ExternalType = string;
export const me = "ME";
Run Code Online (Sandbox Code Playgroud)
next-app/pages/index.tsx正在导入内容external.ts
import { me } from "../../external";
// boilerplate …Run Code Online (Sandbox Code Playgroud) 我使用 npm 工作区和 Typescript 项目引用创建了一个项目,与此示例存储库非常相似:https://github.com/Quramy/npm-ts-workspaces-example。
\n此设置将所有 node_modules 保留在 中root-directory/node_modules,并在文件夹中创建到包的符号链接root-directory/node_modules,以便可以从另一个包直接引用它们。
对于开发来说,这工作得很好,但我陷入了部署。如果所有节点模块都位于根目录中,我将如何部署单个工作区?dist 文件夹不包含节点模块,npm i会安装所有依赖项并创建所有符号链接。
结构如下:
\n\n\xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 node_modules/\n\xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 package-lock.json\n\xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 package.json\n\xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 packages\n\xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 package-1\n\xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 dist\n\xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 helper.d.ts\n\xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 helper.js\n\xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 helper.js.map\n\xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 main.d.ts\n\xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 main.js\n\xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 main.js.map\n\xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 package.json\n\xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 src\n\xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 helper.ts\n\xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 main.ts\n\xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 tsconfig.json\n\xe2\x94\x82\xc2\xa0\xc2\xa0 \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 package-2\n\xe2\x94\x82\xc2\xa0\xc2\xa0 …Run Code Online (Sandbox Code Playgroud) 我有一个角monorepo通过建立Nrwl和现在用角材料的主题化,它采用SASS。
我希望SCSS源文件在项目级别导入,在那里我将覆盖默认的颜色变量进行主题设置。
我遇到的问题是,我想将SCSS源文件导入到monorepo内的其他应用/库中,并导入到此monorepo之外的项目中。
我可以这样写导入:
@import "../other-lib/style.scss";
Run Code Online (Sandbox Code Playgroud)
...将适用于monorepo内部的任何内容。
或者我可以这样写:
@import "~@my-organization/other-lib/style.scss";
Run Code Online (Sandbox Code Playgroud)
...无法在我的Monorepo AFAIK中使用。
如何使它在两种情况下都能正常工作?
它的设置类似于下图。
我有一个包含许多软件包的lerna monorepo。
我正在努力实现以下目标:
对于1。我的意思是,如果我正在package-a中导航代码,并且开始键入package-b导出的函数,那么我会得到一条建议,该建议将触发添加import:`import {example} from'package- b'。
对于2。我的意思是,如果在我从导入了另一个包的另一个软件包中浏览文件时,按住alt或单击“ package-b”导出的函数的名称,则会进入“ / packages / namespace / package / b” /src/file-that-contains-function.js',
我的(lerna)monorepo是标准结构,例如,此处是发布为的“组件”包@namespace/components。
- packages
- components
- package.json
- node_modules
- src
- index.js
- components
- Button
- index.js
- Button.js
- es
- index.js
- components
- Button
- index.js
- Button.js
Run Code Online (Sandbox Code Playgroud)
请注意,每个组件都由目录表示,以便在必要时可以包含其他组件。在此示例中,将packages/components/index出口Button作为命名出口。文件被编译到软件包的/es/目录中。
默认情况下,VSCode为导入提供自动建议,但是这种结构使它感到困惑,并且,例如,如果需要使用monorepo中的其他软件包Button,则会自动建议以下所有导入路径:
packages/components/src/index.jspackages/components/src/Button/index.jspackages/components/src/Button/Button.jspackages/components/es/index.jspackages/components/es/Button/index.jspackages/components/es/Button/Button.js但是,这些都不适合,因为它们将被呈现为从导入文件到导入文件的相对路径。在这种情况下,以下导入是正确的导入:
import { Button } from '@namespace/components'
Run Code Online (Sandbox Code Playgroud)
将排除项添加到项目的 …