unplugin-check-syntax

Birden çok derleme aracını destekleyen (Webpack, Vite, Rollup, esbuild, Rspack vb.) genel amaçlı bir sözdizimi kontrol eklentisidir. JavaScript ve HTML dosyalarındaki ECMAScript sözdizimi uyumluluğunu kontrol etmek için kullanılır. Bu eklenti, rsbuild-plugin-check-syntax temel alınarak geliştirilmiştir.

Özellikler

• 🔧 Çoklu derleyici desteği: Webpack, Vite, Rollup, esbuild, Rspack vb. destekler
• 📝 Çoklu dosya türü: JavaScript dosyalarını ve HTML dosyalarındaki gömülü scriptleri destekler
• 🎯 Kesin konumlandırma: Sourcemap desteğiyle, kaynak dosya konumuna geri izlenebilir
• ⚙️ Esnek yapılandırma: Dosya hariç tutma, manuel dahil etme, hata türü filtreleme gibi seçenekleri destekler
• 📁 Akıllı dosya bulma: Ek JS/HTML dosyalarını manuel olarak dahil etmek için glob desenini destekler
• 🌐 Browserslist entegrasyonu: browserslist yapılandırmasını otomatik olarak ECMAScript sürümüne dönüştürmeyi destekler

Kurulum

npm install @winner-fed/unplugin-check-syntax --save-dev

Kullanım Yöntemi

Vite

// vite.config.ts
import { defineConfig } from 'vite'
import checkSyntax from '@winner-fed/unplugin-check-syntax/vite'
export default defineConfig({
  plugins: [
    checkSyntax({
      targets: ['> 1%', 'last 2 versions'],
      // 或者直接指定 ECMAScript 版本
      // ecmaVersion: 'es2015'
    }),
  ],
})

Webpack

// webpack.config.js
const checkSyntax = require('@winner-fed/unplugin-check-syntax/webpack')
module.exports = {
  plugins: [
    checkSyntax({
      targets: ['> 1%', 'last 2 versions'],
    }),
  ],
}

Rollup

// rollup.config.js
import checkSyntax from '@winner-fed/unplugin-check-syntax/rollup'
export default {
  plugins: [
    checkSyntax({
      targets: ['> 1%', 'last 2 versions'],
    }),
  ],
}

esbuild

// esbuild.config.js
const { build } = require('esbuild')
const checkSyntax = require('@winner-fed/unplugin-check-syntax/esbuild')
build({
  plugins: [
    checkSyntax({
      targets: ['> 1%', 'last 2 versions'],
    }),
  ],
})

Rspack

// rspack.config.js
const checkSyntax = require('@winner-fed/unplugin-check-syntax/rspack')
module.exports = {
  plugins: [
    checkSyntax({
      targets: ['> 1%', 'last 2 versions'],
    }),
  ],
}

Yapılandırma Seçenekleri

interface CheckSyntaxOptions {
  /
   
目标浏览器范围，使用 browserslist 格式
   
*/
  targets?: string[];
  
  /
   
直接指定 ECMAScript 版本（优先级高于 targets）
   
*/
  ecmaVersion?: 'es3' | 'es5' | 'es2015' | 'es2016' | 'es2017' | 'es2018' | 'es2019' | 'es2020' | 'es2021' | 'es2022' | 'latest';
  
  /
   
排除源文件检查，支持正则表达式
   
*/
  exclude?: RegExp | RegExp[];
  
  /
   
排除输出文件检查，支持正则表达式  
   
*/
  excludeOutput?: RegExp | RegExp[];
  
  /
   
手动包含额外的 JS 或 HTML 文件进行语法检查
   
支持文件路径（相对于项目根目录）或 glob 模式
   
*/
  include?: string[];
  
  /
   
排除特定的错误日志类型
   
*/
  excludeErrorLogs?: ('source' | 'output' | 'reason' | 'code')[];
}

Kullanım Örneği

Temel Yapılandırma

// 使用 browserslist 配置
checkSyntax({
  targets: ['> 1%', 'last 2 versions', 'not dead'],
})
// 直接指定 ECMAScript 版本
checkSyntax({
  ecmaVersion: 'es2015',
})

Hariç Tutulan Dosyalar

checkSyntax({
  targets: ['> 1%', 'last 2 versions'],
  // 排除 node_modules 和测试文件
  exclude: [/node_modules/, /\.test\.js$/],
  // 排除特定输出文件
  excludeOutput: [/vendor\.js$/],
})

Ek Dosyaları Dahil Etme

checkSyntax({
  targets: ['> 1%', 'last 2 versions'],
  // 手动包含额外的文件进行检查
  include: [
    'src/legacy//*.js',        // 包含 legacy 目录下的所有 JS 文件
    'public/scripts/app.js',     // 包含特定的公共脚本文件
    'docs//*.html',            // 包含文档中的 HTML 文件
    '/absolute/path/to/file.js'  // 支持绝对路径
  ],
})

Özel Hata Çıktısı

checkSyntax({
  targets: ['> 1%', 'last 2 versions'],
  // 只显示错误原因，不显示代码片段
  excludeErrorLogs: ['code', 'output'],
})

Geçiş Rehberi

Eğer @rsbuild/plugin-check-syntax eklentisinden geçiş yapıyorsanız:

- import { pluginCheckSyntax } from '@rsbuild/plugin-check-syntax'
+ import checkSyntax from '@winner-fed/unplugin-check-syntax/vite' // 或其他构建工具
export default defineConfig({
  plugins: [
  pluginCheckSyntax({
+   checkSyntax({
      targets: ['> 1%', 'last 2 versions'],
    }),
  ],
})

Çalışma Prensibi

• Yapıdan Sonra Kontrol: Eklenti, yapı tamamlandıktan sonra çıktı dosyalarını kontrol eder
• Sözdizimi Analizi: JavaScript sözdizimini kontrol etmek için Acorn ayrıştırıcısı kullanılır
• Uyumluluk Doğrulaması: Yapılandırılan ECMAScript sürümüne göre sözdizimi uyumluluğu doğrulanır
• Hata Raporlama: Dosya konumu ve kaynak kod parçası dahil olmak üzere ayrıntılı hata bilgisi sağlar
• Sourcemap Desteği: Sourcemap varsa, orijinal kaynak dosyaya kadar izler

Lisans

MIT Lisansı

Katkı

Issue ve Pull Request göndermeye hoş geldiniz!

--- Tranlated By Open Ai Tx | Last indexed: 2025-07-21 ---