Sky-core NPM | npm.io

sky-core

sky-core是一个处理浏览器兼容问题的polyfill库和工具库。

为什么把polyfill库和工具库写成同个库？

浏览器的许多新增函数本就是工具函数
许多工具函数的封装本就是处理兼容问题
部分新增功能不能完美实现，有时必须使用函数调用

特色

可打包为 IE9以下专用版、IE9+非IE版、ESM版、通用版这4个版本。在现代浏览器中就不会载入多余的兼容代码了。
包含许多Web API的polyfill。比如document.head等。
可以配合Typescript和Babel使用。
包含无污染版，和有污染版。如果一个有的库需要polyfill，有的不需要，则可以使用无污染版。

安装

npm i sky-core

使用

直接引入

import "sky-core/polyfill/document/head";

console.log(document.head);

结合rollup插件自动引入polyfill

//rollup.config.js
import polyfill from "rollup-plugin-polyfill-inject";

export default {
	input: 'src/index.js',
	output: {
		file: 'dist/index.js',
		format: 'iife'
	},
	plugins: [
		polyfill({
			"modules": {
				".includes": [
					"sky-core/polyfill/Array/prototype/includes",
					"sky-core/polyfill/String/prototype/includes"
				],
				"Set":"sky-core/polyfill/Set",
				"Map":"sky-core/polyfill/Map",
			},
		})
	]
}

//before
console.log([].includes('a'));

//after
import "sky-core/polyfill/Array/prototype/includes";
import "sky-core/polyfill/String/prototype/includes";

console.log([].includes('a'));

结合rollup插件只在部分时候无污染引入polyfill

//rollup.config.js
import inject from "@rollup/plugin-inject";

export default {
	input: 'src/index.js',
	output: {
		file: 'dist/index.js',
		format: 'iife'
	},
	plugins: [
		inject({
			"modules": {
				"XMLHttpRequest":"sky-core/pure/XMLHttpRequest"
			},
			include:["**/ajax.js"]
		})
	]
}

//browser.js
export const isIE6=!window.XMLHttpRequest;
//XMLHttpRequest will NOT replace to polyfill

//ajax.js
export function get(url){
	//XMLHttpRequest will replace to polyfill
	var xhr=new XMLHttpRequest();
	return new Promise(function(){
		//...
	});
}