Nuxt

Nuxt 是一个开源框架，使 Web 开发变得直观而强大。

¥Nuxt is an open source framework that makes web development intuitive and powerful.

快速入门

¥Quickstart

要在 Turborepo 中快速开始使用 Nuxt，请使用 with-vue-nuxt 示例：

¥To get started with Nuxt in a Turborepo quickly, use the with-vue-nuxt example:

pnpm dlx create-turbo@latest -e with-vue-nuxt

将 Nuxt 应用添加到现有仓库

¥Adding a Nuxt application to an existing repository

使用 Nuxt 的命令行工具 Nuxi 在包中设置新的 Nuxt 应用。从你的代码库根目录运行：

¥Use Nuxi, Nuxt's CLI, to set up a new Nuxt application in a package. From the root of your repository, run:

pnpm dlx nuxi@latest init apps/my-app

与你的仓库集成

¥Integrating with your repository

要将 内部软件包 添加到你的新应用，请使用你的包管理器将其安装到应用中：

¥To add Internal Packages to your new application, install them into the app with your package manager:

{
  "name": "my-app",
  "dependencies": {
+   "@repo/ui": "workspace:*"
  }
}

确保运行包管理器的安装命令。你可能还需要在 package.json 中更新 scripts，以适应你的代码库中的用例。

¥Make sure to run your package manager's install command. You also may need to update scripts in package.json to fit your use case in your repository.

自定义任务

¥Customizing tasks

默认情况下，新应用将使用根 turbo.json 中定义的任务。如果你想为新应用配置不同的任务，请使用 软件包配置。

¥By default, the new application will use the tasks defined in the root turbo.json. If you'd like to configure tasks differently for the new application, use Package Configurations.

微前端

¥Microfrontends

使用 Nuxt 和 Turborepo 的微前端 时，请确保为子应用设置 base 属性。这确保图片和 CSS 等资源将被路由到正确的应用。

¥When using Nuxt with Turborepo's microfrontends, make sure to set the base property for child applications. This ensures the assets like images and CSS will be routed to the correct application.

import { defineConfig } from 'vite';
 
export default defineConfig({
  base: '/admin',
});