browserslist
4.24.2
التكوين لمشاركة المتصفحات المستهدفة وإصدارات Node.js بين أدوات الواجهة الأمامية المختلفة. يتم استخدامه في:
ستجد جميع الأدوات المتصفحات المستهدفة تلقائيًا ، عند إضافة ما يلي إلى package.json :
"browserslist" : [
" defaults and fully supports es6-module " ,
" maintained node versions "
] أو في .browserslistrc config:
# Browsers that we support
defaults and fully supports es6-module
maintained node versions يقوم المطورون بتعيين قوائم إصداراتهم باستخدام استفسارات مثل last 2 versions لتكون خالية من تحديث الإصدارات يدويًا. ستستخدم BrowsersList caniuse-lite مع هل يمكنني استخدام البيانات لهذه الاستعلامات.
يمكنك التحقق من كيفية عمل التكوين في ملعبنا: browsersl.ist
قائمة المتصفح تحتاج إلى دعمك. نحن نقبل التبرعات في Open Collective.
> .5% or last 2 versions> .5%, last 2 versionsand Combiner> .5% and last 2 versionsnot تجمع> .5% and not last 2 versions> .5% or not last 2 versions> .5%, not last 2 versions تتمثل إحدى الطرق السريعة لاختبار استعلامك في إجراء npx browserslist '> 0.3%, not dead' في المحطة الخاصة بك.
يمكنك تحديد إصدارات المتصفح و node.js عن طريق الاستعلامات (حالة غير حساسة):
defaults : المستعرضات الافتراضية لـ BrowsersList ( > 0.5%, last 2 versions, Firefox ESR, not dead ).> 5% : إصدارات المتصفحات التي تم اختيارها بواسطة إحصائيات الاستخدام العالمية. >= ، < و <= العمل أيضًا.> 5% in US : يستخدم إحصائيات استخدام الولايات المتحدة الأمريكية. يقبل رمز البلد من حرفي.> 5% in alt-AS : يستخدم إحصائيات استخدام منطقة آسيا. يمكن العثور على قائمة جميع رموز المنطقة في caniuse-lite/data/regions .> 5% in my stats : يستخدم بيانات الاستخدام المخصص.> 5% in browserslist-config-mycompany stats : يستخدم بيانات الاستخدام المخصص من browserslist-config-mycompany/browserslist-stats.json .cover 99.5% : المتصفحات الأكثر شعبية التي توفر التغطية.cover 99.5% in US : كما هو مذكور أعلاه ، مع رمز البلد ذو الأحرف.cover 99.5% in my stats : يستخدم بيانات الاستخدام المخصص.last 2 versions : آخر 2 نسخ لكل متصفح.last 2 Chrome versions : آخر 2 إصدارات من متصفح Chrome.last 2 major versions أو last 2 iOS major versions : جميع إصدارات البث/التصحيح من آخر 2 إصدارات رئيسية.dead : المتصفحات دون دعم رسمي أو تحديثات لمدة 24 شهرًا. الآن هو IE 11 ، IE_Mob 11 ، BlackBerry 10 ، BlackBerry 7 ، Samsung 4 ، OperaMobile 12.1 وجميع إصدارات Baidu .node 10 والعقدة node 10.4 : تحديد أحدث node.js 10.xx أو 10.4.x الإصدار.last 2 node versions : حدد 2 أحدث إصدارات Node.js.last 2 node major versions : حدد 2 أحدث إصدارات Version-version Node.js.current node : إصدار Node.js المستخدمة من قبل BrowsersList الآن.maintained node versions : جميع إصدارات Node.js ، والتي لا تزال محفوظة بواسطة Node.js Foundation.iOS 7 : إصدار IOS Prowser 7 مباشرة. لاحظ أن op_mini لديه نسخة خاصة all .Firefox > 20 : إصدارات Firefox الأحدث من 20. >= ، < و <= العمل أيضًا. كما أنه يعمل مع Node.js.ie 6-8 : يختار مجموعة شاملة من الإصدارات.Firefox ESR : أحدث إصدار دعم Firefox الموسع.PhantomJS 2.1 و PhantomJS 1.9 : يختار إصدارات Safari مماثلة لوقت تشغيل Phantomjs.extends browserslist-config-mycompany : خذ استعلامات من browserslist-config-mycompany NPM Package.es6 و es6-module هما المعلمة feat من عنوان URL الخاص بالصفحة التي يمكنني استخدامها. يمكن العثور على قائمة بجميع الميزات المتاحة في caniuse-lite/data/features .fully supports es6 : المتصفحات بدعم كامل لميزات محددة. على سبيل المثال ، fully supports css-grid حافة 12-15 ، حيث يتم تمييز إصدارات المتصفح هذه على أنها ذات دعم جزئي.partially supports es6-module أو supports es6-module : متصفحات بدعم كامل أو جزئي لميزات محددة. على سبيل المثال ، ستشمل partially supports css-grid دعم Edge 12-15 ، حيث يتم تمييز إصدارات المتصفح هذه على أنها ذات دعم جزئي.browserslist config : المتصفحات المحددة في تكوين المستعرضات. مفيد في التقديم التفاضلي لتعديل تكوين المستخدم مثل browserslist config and fully supports es6-module .since 2015 أو last 2 years : تم إصدار جميع الإصدارات منذ عام 2015 (أيضًا since 2015-03 since 2015-03-10 ).unreleased versions أو unreleased Chrome versions : إصدارات ألفا وبيتا.not ie <= 8 : استبعاد IE 8 وأقل من الاستفسارات السابقة. not يمكنك إضافة أي استعلام.
هناك مواصفات قواعد حول بناء جملة الاستعلام ، والتي قد تكون مفيدة إذا كنت تقوم بتنفيذ محلل أو أي شيء آخر.
Run npx browserslist في دليل المشروع لمعرفة المستعرضات التي تم اختيارها بواسطة استفساراتك.
$ npx browserslist
and_chr 61
and_ff 56
and_qq 1.2
and_uc 11.4
android 56
baidu 7.12
bb 10
chrome 62
edge 16
firefox 56
ios_saf 11
opera 48
safari 11
samsung 5أسماء متصفح الجدول التالية وأجهزةها المستهدفة في معرفات تستخدمها قائمة BrowsersList.
| اسم المتصفح | سطح المكتب | Android | iOS | الهاتف المحمول الآخر |
|---|---|---|---|---|
| Android (WebView) | Android | |||
| بايدو | Baidu | |||
| بلاك بيري | BlackBerry bb | |||
| الكروم | Chrome | ChromeAndroid and_chr | ↪︎ ios_saf 2 | |
| حافة | Edge | ↪︎ and_chr | ↪︎ ios_saf 2 | |
| الإلكترون | Electron | |||
| Firefox | Firefox ff | FirefoxAndroid and_ff | ↪︎ ios_saf 2 | |
| Internet Explorer | Explorer ie | ie_mob | ||
| node.js | Node | |||
| متصفح كايوس | kaios | |||
| الأوبرا | Opera | op_mob 1 | ↪︎ ios_saf 2 | |
| أوبرا ميني 3 | OperaMini op_mini | |||
| QQ متصفح | and_qq | |||
| سفاري | Safari | iOS ios_saf | ||
| الإنترنت Samsung | Samsung | |||
| متصفح UC | UCAndroid and_uc |
↪︎ name إلى أن المتصفح يستخدم نفس المحرك الذي تم التقاطه nameop_mini في "Extreme". "High" متوافق مع Moba Mobile العادي. package.json إذا كنت ترغب في تقليل ملفات التكوين في جذر المشروع ، فيمكنك تحديد المتصفحات في package.json مع مفتاح browserslist :
{
"private" : true ,
"dependencies" : {
"autoprefixer" : " ^6.5.4 "
},
"browserslist" : [
" last 1 version " ,
" > 1% " ,
" not dead "
]
}.browserslistrc يجب تسمية تكوين .browserslistrc المنفصل. يتم الجمع بين كل سطر مع or combiner. تبدأ التعليقات برمز # :
# Browsers that we support
last 1 version
> 1%
not dead # no browsers without security updates ستقوم BrowsersList بفحص التكوين في كل دليل في path . لذلك ، إذا كان app/styles/main.css ، يمكنك وضع التكوين على الجذر أو app/ أو app/styles .
يمكنك تحديد المسار المباشر في متغيرات البيئة BROWSERSLIST_CONFIG .
يمكنك استخدام الاستعلام التالي للإشارة إلى تكوين قائمة متصفح تم تصديره من حزمة أخرى:
"browserslist" : [
" extends browserslist-config-mycompany "
] لأسباب أمنية ، يدعم التكوين الخارجي فقط الحزم التي تحتوي على browserslist-config- بادئة. يتم دعم حزم NPM Scoped أيضًا ، من خلال تسمية أو بادئة الوحدة النمطية باستخدام @scope/browserslist-config ، مثل @scope/browserslist-config أو @scope/browserslist-config-mycompany .
إذا لم تقبل استفسارات قائمة المتصفح من المستخدمين ، فيمكنك تعطيل التحقق من الصحة باستخدام متغير بيئة Or Or BROWSERSLIST_DANGEROUS_EXTEND .
BROWSERSLIST_DANGEROUS_EXTEND=1 npx webpack نظرًا لأن هذا يستخدم دقة npm ، يمكنك أيضًا الرجوع إلى ملفات محددة في حزمة:
"browserslist" : [
" extends browserslist-config-mycompany/desktop " ,
" extends browserslist-config-mycompany/mobile "
] عند كتابة حزمة قائمة متصفح مشتركة ، ما عليك سوى تصدير صفيف. browserslist-config-mycompany/index.js :
module . exports = [
'last 1 version' ,
'> 1%' ,
'not dead'
] يمكنك أيضًا تضمين ملف browserslist-stats.json كجزء من التكوين القابل للمشاركة في الجذر والاستعلام عنه باستخدام > 5% in browserslist-config-mycompany stats . يستخدم نفس التنسيق الذي extends وخاصية dangerousExtend على النحو الوارد أعلاه.
يمكنك تصدير التكوينات لبيئات مختلفة وتحديد البيئة بواسطة BROWSERSLIST_ENV أو env خيار في أدتك:
module . exports = {
development : [
'last 1 version'
] ,
production : [
'last 1 version' ,
'> 1%' ,
'not dead'
]
} يمكنك أيضًا تحديد استعلامات المتصفح المختلفة لبيئات مختلفة. ستختار BrowsersList Query وفقًا لمتطلبات BROWSERSLIST_ENV أو NODE_ENV . إذا لم يتم الإعلان عن أي منهم ، فسيبحث BrowsersList أولاً عن استفسارات production ثم استخدام الافتراضات.
في package.json :
"browserslist" : {
"production" : [
"> 1%" ,
"not dead"
] ,
"modern" : [
"last 1 chrome version" ,
"last 1 firefox version"
] ,
"ssr" : [
"node 12"
]
} في .browserslistrc config:
[production]
> 1%
not dead
[modern]
last 1 chrome version
last 1 firefox version
[ssr]
node 12 إذا كان لديك موقع ويب ، فيمكنك الاستعلام مقابل إحصائيات استخدام موقعك. ستطلب browserslist-ga الوصول إلى Google Analytics ثم إنشاء browserslist-stats.json :
npx browserslist-ga
أو يمكنك استخدام browserslist-ga-export لتحويل بيانات Google Analytics دون إعطاء كلمة مرور لحساب Google.
يمكنك إنشاء ملف إحصائيات الاستخدام بأي طريقة أخرى. يجب أن يكون تنسيق الملف مثل:
{
"ie" : {
"6" : 0.01 ,
"7" : 0.4 ,
"8" : 1.5
} ,
"chrome" : {
…
} ,
…
} لاحظ أنه يمكنك الاستعلام مقابل بيانات الاستخدام المخصص الخاص بك أثناء الاستعلام أيضًا ضد البيانات العالمية أو الإقليمية. على سبيل المثال ، الاستعلام > 1% in my stats, > 5% in US, 10% مسموح بها.
const browserslist = require ( 'browserslist' )
// Your CSS/JS build tool code
function process ( source , opts ) {
const browsers = browserslist ( opts . overrideBrowserslist , {
stats : opts . stats ,
path : opts . file ,
env : opts . env
} )
// Your code to add features for selected browsers
} يمكن أن تكون الاستعلامات سلسلة "> 1%, not dead" أو صفيف ['> 1%', 'not dead'] .
إذا كان الاستعلام مفقودًا ، فسيبحث BrowsersList عن ملف التكوين. يمكنك توفير خيار path (يمكن أن يكون ملفًا) للعثور على ملف التكوين نسبيًا إليه.
خيارات:
path : ملف أو مسار دليل للبحث عن ملف التكوين. الافتراضي هو . .env : ما هو قسم البيئة الذي يستخدمه من التكوين. الافتراضي هو production .stats : بيانات إحصائيات الاستخدام المخصصة.config : مسار للتكوين إذا كنت تريد تعيينه يدويًا.ignoreUnknownVersions : لا ترمي على الاستعلام المباشر (مثل ie 12 ). الافتراضي false .dangerousExtend : تعطيل الشيكات الأمنية extend الاستعلام. الافتراضي false .throwOnMissing : رمي خطأ إذا لم يتم العثور على ENV. الافتراضي false .mobileToDesktop : استخدم متصفحات سطح المكتب إذا كان بإمكاني استخدامها لا تحتوي على بيانات حول إصدار الهاتف المحمول هذا. هل يمكنني استخدام بيانات حول أحدث إصدارات متصفحات الهاتف المحمول. بشكل افتراضي ، تُرجع last 2 and_ff versions and_ff 90 ، ومع هذا الخيار ، فإنه يعود and_ff 91, and_ff 90 . قد يؤدي هذا الخيار إلى خطأ إصدار متصفح غير معروف (في المثال ، هل يمكنني استخدامه لا يحتوي على بيانات لـ and_ff 91 حتى الآن). الافتراضي false .بالنسبة للبيئة غير JS وغرض التصحيح ، يمكنك استخدام أداة CLI:
browserslist " > 1%, not dead "يمكنك الحصول على إجمالي تغطية المستخدمين للمتصفحات المحددة بواسطة JS API:
browserslist . coverage ( browserslist ( '> 1%' ) )
//=> 81.4 browserslist . coverage ( browserslist ( '> 1% in US' ) , 'US' )
//=> 83.1 browserslist . coverage ( browserslist ( '> 1% in my stats' ) , 'my stats' )
//=> 83.1 browserslist . coverage ( browserslist ( '> 1% in my stats' , { stats } ) , stats )
//=> 82.2أو بواسطة CLI:
$ browserslist --coverage " > 1% "
These browsers account for 81.4% of all users globally$ browserslist --coverage=US " > 1% in US "
These browsers account for 83.1% of all users in the US$ browserslist --coverage " > 1% in my stats "
These browsers account for 83.1% of all users in custom statistics$ browserslist --coverage " > 1% in my stats " --stats=./stats.json
These browsers account for 83.1% of all users in custom statisticsإذا كانت أداة تستخدم قائمة متصفح في الداخل ، فيمكنك تغيير إعدادات قائمة المتصفح مع متغيرات البيئة:
BROWSERSLIST مع استعلامات المتصفحات.
BROWSERSLIST= " > 5% " npx webpack BROWSERSLIST_CONFIG مع مسار إلى ملف التكوين.
BROWSERSLIST_CONFIG=./config/browserslist npx webpack BROWSERSLIST_ENV مع سلسلة البيئات.
BROWSERSLIST_ENV= " development " npx webpack BROWSERSLIST_STATS مع مسار إلى بيانات الاستخدام المخصص لـ > 1% in my stats .
BROWSERSLIST_STATS=./config/usage_data.json npx webpack BROWSERSLIST_DISABLE_CACHE إذا كنت ترغب في تعطيل ذاكرة التخزين المؤقت لقراءة التكوين.
BROWSERSLIST_DISABLE_CACHE=1 npx webpack BROWSERSLIST_DANGEROUS_EXTEND لتعطيل التحقق من اسم التكوين القابل للمشاركة.
BROWSERSLIST_DANGEROUS_EXTEND=1 npx webpack BROWSERSLIST_ROOT_PATH لمنع قراءة ملفات فوق هذا المسار.
BROWSERSLIST_ROOT_PATH=. npx webpackbrowserslist.coverage()تغطية السوق للمتصفحات.
const browsers = browserslist ( '> 1% in US' )
browserslist . coverage ( browsers , 'US' ) //=> 83.1browserslist.loadConfig() إنه مثل استدعاء browserslist() ، لكنه يعيد استعلامات Config ، وليس المتصفحات.
browserslist . loadConfig ( { file : process . cwd ( ) } ) ?? browserslist . defaultsbrowserslist.defaultsصفيف مع استفسارات افتراضية.
يقوم BrowsersList بتخزين التكوين الذي تقرأه من ملفات package.json و browserslist ، وكذلك المعرفة حول وجود الملفات ، طوال مدة عملية الاستضافة.
لمسح هذه التخزين المؤقت ، استخدم:
browserslist . clearCaches ( ) لتعطيل التخزين المؤقت تمامًا ، قم بتعيين متغير بيئة BROWSERSLIST_DISABLE_CACHE .
للإبلاغ عن ثغرة أمنية ، يرجى استخدام جهة اتصال Tidelift Security. سوف Tidelift تنسيق الإصلاح والكشف.
متاح كجزء من اشتراك Tidelift.
يعمل مشرفي browserslist وآلاف الحزم الأخرى مع TideLift لتقديم الدعم والصيانة التجارية لتبعيات مفتوحة المصدر التي تستخدمها لبناء تطبيقاتك. وفر الوقت ، وتقليل المخاطر ، وتحسين صحة الكود ، مع دفع المشرفين على التبعيات الدقيقة التي تستخدمها. يتعلم أكثر.
راجع مستندات update-browserslist-db
