Nuxt Nation 大会即将到来。加入我们,时间为 11 月 12 日至 13 日。

medusa
nuxt-medusa

轻松地从您的 Nuxt 应用程序连接到 Medusa

Nuxt Medusa

nuxt-medusa

npm versionnpm downloadsLicense

用于 Nuxt 的 Medusa 模块。

功能

  • 支持 Nuxt 3
  • 围绕 @medusajs/medusa-js 的封装
  • 方便的组合式函数,例如 useMedusaClient
  • 在 API 服务器路由中使用 serverMedusaClient
  • TypeScript 支持

快速设置

  1. nuxt-medusa 依赖项添加到您的项目中
npm install --save-dev nuxt-medusa # pnpm or yarn
  1. nuxt-medusa 添加到 nuxt.config.ts 文件的 modules 部分
export default defineNuxtConfig({
  modules: ['nuxt-medusa'],
})
  1. 创建 .env 文件,其中包含以下 MEDUSA_URL 变量
MEDUSA_URL=<YOUR_MEDUSA_URL> # By default https://127.0.0.1:9000

就是这样!您现在可以在 Nuxt 中从 Medusa 获取数据 ✨

<script setup lang="ts">
  const client = useMedusaClient();
  const { products } = await client.products.list();
</script>

如果您遇到来自 Medusa 的 CORS 问题,请确保 medusa-config.js 文件中的 process.env.STORE_CORS 指向您的本地 Nuxt 项目。默认情况下,Medusa 将 CORS 设置为 https://127.0.0.1:8000,而 Nuxt 默认在 https://127.0.0.1:3000 上运行

开发

# Install dependencies
yarn

# Generate type stubs
yarn dev:prepare

# Develop with the playground
yarn dev

# Build the playground
yarn dev:build

# Run ESLint
yarn lint

# Run Vitest
yarn test
yarn test:watch

# Release new version
yarn release