@teages/nuxt-legacy

一个支持旧版浏览器的 Nuxt 模块。

• ✨  发布说明

设置

通过一个命令将模块安装到您的 Nuxt 应用中

# vite
pnpm add @teages/nuxt-legacy @vitejs/plugin-legacy

然后在你的 nuxt.config.ts 中配置它。

// nuxt.config.ts
export default defineNuxtConfig({
  modules: [
    '@teages/nuxt-legacy'
  ],

  legacy: {
    vite: {}, // `@vitejs/plugin-legacy` options
  },
})

// nuxt.config.ts
export default defineNuxtConfig({
  modules: [
    '@teages/nuxt-legacy'
  ],

  legacy: {
    vite: {
      targets: ['fully supports proxy'],
      modernPolyfills: true,
    },
  },
})

兼容性

Nuxt & @vitejs/plugin-legacy

该模块兼容 Nuxt ^3.18.0 || >=4.0.3 和 @vitejs/plugin-legacy ^7.0.0。

由于该模块不依赖任何隐式行为，它应该与任何后续 Nuxt 版本兼容。但我会在 Nuxt 发布小版本或大版本后重新检查兼容性。

检查当前模块版本的结果

浏览器支持

该模块已在以下浏览器中进行测试

• Chrome 49: Vue 3 所需的最低版本
• Chrome 61: 支持 ESM 但不支持广泛可用的功能
• Chrome 91: 不支持 Object.hasOwn 但可以通过 polyfill 填充
• 最新 Chrome

您可以通过使用您的目标浏览器访问演练场自行测试。

内容安全策略

它注入了一些内联脚本来修复旧版浏览器兼容性问题。哈希值与最新版本的 @vitejs/plugin-legacy 保持同步，当前值为

• sha256-MS6/3FCg4WjP9gwgaBGwLpRCY6fZBgwmhVCdrPrNf3E=
• sha256-tQjf8gvb2ROOMapIxFvFAYBeUJ0v1HCbOcSmDNXGtDo=
• sha256-ZxAi3a7m9Mzbc+Z1LGuCCK5Xee6reDkEPRas66H9KSo=
• sha256-+5XkZFazzJo8n0iOP4ti/cLCMUudTf//Mzkb7xNPXIc=

模块中也提供了 cspHashes

import { cspHashes } from '@teages/nuxt-legacy'

鸣谢

• IlyaSemenov/nuxt-vite-legacy：@IlyaSemenov 基于他的想法创建的模块
• BrowserStack。本项目已通过 BrowserStack 进行测试。

贡献

# Install dependencies
npm install

# Generate type stubs
npm run dev:prepare

# Develop with the playground
npm run dev

# Build the playground
npm run dev:build

# Run ESLint
npm run lint

# Run Vitest
npm run test
npm run test:watch

# Release new version
npm run release