unplugin-check-syntax
إضافة فحص تركيب نحوي عامة تدعم عدة أدوات بناء (Webpack، Vite، Rollup، esbuild، Rspack وغيرها)، لفحص توافقية تركيب ECMAScript في ملفات JavaScript و HTML. هذه الإضافة مستوحاة من rsbuild-plugin-check-syntax.
الميزات
- 🔧 دعم لعدة أدوات بناء: يدعم Webpack، Vite، Rollup، esbuild، Rspack وغيرها
- 📝 أنواع ملفات متعددة: يدعم ملفات JavaScript والبرمجيات المضمنة داخل ملفات HTML
- 🎯 تحديد دقيق للمواقع: يدعم sourcemap ويمكن تتبع أماكن الشيفرة الأصلية
- ⚙️ تهيئة مرنة: دعم استثناء الملفات، تضمين يدوي، تصفية أنواع الأخطاء وغيرها من الخيارات
- 📁 اكتشاف ذكي للملفات: يدعم نمط glob لإدراج ملفات JS/HTML إضافية يدوياً
- 🌐 تكامل مع Browserslist: يدعم تحويل إعداد browserslist تلقائياً إلى إصدار ECMAScript
التثبيت
npm install @winner-fed/unplugin-check-syntax --save-dev
طريقة الاستخدام
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.config.js
const checkSyntax = require('@winner-fed/unplugin-check-syntax/webpack')module.exports = {
plugins: [
checkSyntax({
targets: ['> 1%', 'last 2 versions'],
}),
],
}
التجميع
// 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'],
}),
],
}
خيارات التكوين
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')[];
}
استخدام المثال
التكوين الأساسي
// 使用 browserslist 配置
checkSyntax({
targets: ['> 1%', 'last 2 versions', 'not dead'],
})// 直接指定 ECMAScript 版本
checkSyntax({
ecmaVersion: 'es2015',
})
استبعاد الملفات
checkSyntax({
targets: ['> 1%', 'last 2 versions'],
// 排除 node_modules 和测试文件
exclude: [/node_modules/, /\.test\.js$/],
// 排除特定输出文件
excludeOutput: [/vendor\.js$/],
})
تضمين ملفات إضافية
checkSyntax({
targets: ['> 1%', 'last 2 versions'],
// 手动包含额外的文件进行检查
include: [
'src/legacy//*.js', // 包含 legacy 目录下的所有 JS 文件
'public/scripts/app.js', // 包含特定的公共脚本文件
'docs//*.html', // 包含文档中的 HTML 文件
'/absolute/path/to/file.js' // 支持绝对路径
],
})
إخراج الأخطاء المخصص
checkSyntax({
targets: ['> 1%', 'last 2 versions'],
// 只显示错误原因,不显示代码片段
excludeErrorLogs: ['code', 'output'],
})
دليل الترحيل
إذا كنت تنتقل من @rsbuild/plugin-check-syntax:
- 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'],
}),
],
})
آلية العمل
- الفحص بعد البناء: يقوم الملحق بفحص ملفات الإخراج بعد اكتمال البناء
- تحليل الصياغة: يستخدم محلل Acorn لفحص صياغة جافاسكريبت
- التحقق من التوافقية: يتحقق من توافق الصياغة مع إصدار ECMAScript المحدد في الإعدادات
- تقرير الأخطاء: يقدم معلومات تفصيلية عن الأخطاء، بما في ذلك موقع الملف ومقتطف من الشيفرة المصدرية
- دعم Sourcemap: إذا كان هناك sourcemap، يتم تتبع الأخطاء إلى ملف المصدر الأصلي
الترخيص
رخصة MIT
المساهمة
نرحب بإرسال Issues و Pull Requests!
--- Tranlated By Open Ai Tx | Last indexed: 2025-07-21 ---