cainiaoblog 23.2.171
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CNAME +1 -0
- package/MP_verify_o6dHCK5mIkxNpzvZ.txt +1 -0
- package/README.md +8 -0
- package/about/index.html +54 -0
- package/ads.txt +1 -0
- package/app/manual.html +104 -0
- package/appConfigs/config +1 -0
- package/archives/2018/index.html +48 -0
- package/archives/2019/index.html +48 -0
- package/archives/2019/page/2/index.html +48 -0
- package/archives/2020/index.html +48 -0
- package/archives/2021/index.html +48 -0
- package/archives/2022/index.html +48 -0
- package/archives/2023/index.html +48 -0
- package/archives/index.html +48 -0
- package/archives/page/2/index.html +48 -0
- package/archives/page/3/index.html +48 -0
- package/article/10047.html +148 -0
- package/article/10164.html +64 -0
- package/article/10624.html +436 -0
- package/article/10745.html +586 -0
- package/article/11674.html +71 -0
- package/article/11939.html +72 -0
- package/article/12238.html +86 -0
- package/article/1230.html +533 -0
- package/article/13265.html +69 -0
- package/article/13823.html +78 -0
- package/article/14125.html +72 -0
- package/article/14192.html +561 -0
- package/article/14375.html +85 -0
- package/article/14744.html +83 -0
- package/article/14936.html +451 -0
- package/article/1518.html +250 -0
- package/article/15428.html +71 -0
- package/article/15518.html +288 -0
- package/article/15569.html +418 -0
- package/article/1566.html +122 -0
- package/article/16017.html +156 -0
- package/article/16947.html +440 -0
- package/article/17096.html +82 -0
- package/article/17246.html +89 -0
- package/article/17575.html +350 -0
- package/article/179.html +757 -0
- package/article/18039.html +233 -0
- package/article/18071.html +375 -0
- package/article/18142.html +71 -0
- package/article/19909.html +160 -0
- package/article/20014.html +89 -0
- package/article/20021.html +389 -0
- package/article/20037.html +280 -0
- package/article/20056.html +95 -0
- package/article/20093.html +404 -0
- package/article/2021.html +607 -0
- package/article/20459.html +115 -0
- package/article/20613.html +263 -0
- package/article/20635.html +71 -0
- package/article/21317.html +71 -0
- package/article/21320.html +90 -0
- package/article/21782.html +548 -0
- package/article/22230.html +435 -0
- package/article/22237.html +347 -0
- package/article/22398.html +109 -0
- package/article/22422.html +270 -0
- package/article/22565.html +300 -0
- package/article/23046.html +250 -0
- package/article/23083.html +215 -0
- package/article/23195.html +297 -0
- package/article/23301.html +835 -0
- package/article/23589.html +285 -0
- package/article/23655.html +338 -0
- package/article/23864.html +76 -0
- package/article/23914.html +96 -0
- package/article/24169.html +135 -0
- package/article/24581.html +349 -0
- package/article/2475.html +500 -0
- package/article/24826.html +77 -0
- package/article/24924.html +247 -0
- package/article/25164.html +1495 -0
- package/article/25318.html +394 -0
- package/article/25710.html +1129 -0
- package/article/25734.html +83 -0
- package/article/26083.html +174 -0
- package/article/26147.html +283 -0
- package/article/26291.html +110 -0
- package/article/26354.html +71 -0
- package/article/26624.html +145 -0
- package/article/26639.html +298 -0
- package/article/26850.html +138 -0
- package/article/26940.html +258 -0
- package/article/27796.html +190 -0
- package/article/27800.html +161 -0
- package/article/28963.html +159 -0
- package/article/28976.html +247 -0
- package/article/29042.html +72 -0
- package/article/29596.html +81 -0
- package/article/29619.html +183 -0
- package/article/29623.html +329 -0
- package/article/29829.html +205 -0
- package/article/29abbd1c.html +112 -0
- package/article/30215.html +178 -0
- package/article/30552.html +78 -0
- package/article/30818.html +201 -0
- package/article/31330.html +364 -0
- package/article/3154.html +577 -0
- package/article/31695.html +348 -0
- package/article/31826.html +71 -0
- package/article/31843.html +132 -0
- package/article/32280.html +212 -0
- package/article/32431.html +74 -0
- package/article/32443.html +72 -0
- package/article/32732.html +122 -0
- package/article/3286.html +251 -0
- package/article/32960.html +198 -0
- package/article/33713.html +72 -0
- package/article/33899.html +615 -0
- package/article/34351.html +74 -0
- package/article/34372.html +89 -0
- package/article/34410.html +74 -0
- package/article/34431.html +118 -0
- package/article/3447.html +75 -0
- package/article/34474.html +142 -0
- package/article/34871.html +147 -0
- package/article/35397.html +175 -0
- package/article/3544.html +199 -0
- package/article/35503.html +115 -0
- package/article/35624.html +84 -0
- package/article/35697.html +384 -0
- package/article/35863.html +73 -0
- package/article/36037.html +253 -0
- package/article/36118.html +71 -0
- package/article/3621.html +119 -0
- package/article/36251.html +296 -0
- package/article/36642.html +352 -0
- package/article/37102.html +763 -0
- package/article/37336.html +351 -0
- package/article/37351.html +89 -0
- package/article/3760.html +294 -0
- package/article/37749.html +75 -0
- package/article/37789.html +83 -0
- package/article/38005.html +765 -0
- package/article/38009.html +284 -0
- package/article/38269.html +194 -0
- package/article/38344.html +88 -0
- package/article/38359.html +334 -0
- package/article/38423.html +379 -0
- package/article/38530.html +213 -0
- package/article/38743.html +268 -0
- package/article/38753.html +204 -0
- package/article/38881.html +71 -0
- package/article/39087.html +414 -0
- package/article/39309.html +84 -0
- package/article/39486.html +74 -0
- package/article/39637.html +306 -0
- package/article/39839.html +72 -0
- package/article/39937.html +152 -0
- package/article/39970.html +71 -0
- package/article/402.html +559 -0
- package/article/40698.html +71 -0
- package/article/40811.html +71 -0
- package/article/40964.html +462 -0
- package/article/41011.html +322 -0
- package/article/41152.html +78 -0
- package/article/41696.html +71 -0
- package/article/41717.html +281 -0
- package/article/41777.html +149 -0
- package/article/419.html +985 -0
- package/article/4233.html +136 -0
- package/article/4292.html +86 -0
- package/article/43302.html +96 -0
- package/article/43397.html +106 -0
- package/article/43724.html +281 -0
- package/article/43999.html +224 -0
- package/article/44426.html +77 -0
- package/article/44964.html +137 -0
- package/article/45004.html +123 -0
- package/article/4510.html +83 -0
- package/article/45156.html +320 -0
- package/article/45157.html +52 -0
- package/article/45267.html +87 -0
- package/article/45641.html +207 -0
- package/article/45960.html +75 -0
- package/article/46100.html +1262 -0
- package/article/46366.html +74 -0
- package/article/46771.html +96 -0
- package/article/46911.html +517 -0
- package/article/46948.html +137 -0
- package/article/46ee4850.html +349 -0
- package/article/47019.html +84 -0
- package/article/47532.html +94 -0
- package/article/4783.html +429 -0
- package/article/47972.html +72 -0
- package/article/48216.html +127 -0
- package/article/48252.html +185 -0
- package/article/48520.html +74 -0
- package/article/48722.html +75 -0
- package/article/48807.html +99 -0
- package/article/49126.html +323 -0
- package/article/50001.html +88 -0
- package/article/50058.html +151 -0
- package/article/50343.html +410 -0
- package/article/50510.html +82 -0
- package/article/51082.html +98 -0
- package/article/51677.html +111 -0
- package/article/5204.html +1085 -0
- package/article/52500.html +538 -0
- package/article/52689.html +259 -0
- package/article/52877.html +569 -0
- package/article/53125.html +191 -0
- package/article/53428.html +251 -0
- package/article/53524.html +74 -0
- package/article/53698.html +322 -0
- package/article/53803e6.html +93 -0
- package/article/53924.html +291 -0
- package/article/53962.html +253 -0
- package/article/54006.html +71 -0
- package/article/54018.html +88 -0
- package/article/54161.html +83 -0
- package/article/54178.html +69 -0
- package/article/54258.html +327 -0
- package/article/54295.html +214 -0
- package/article/54313.html +1976 -0
- package/article/54351.html +90 -0
- package/article/54604.html +80 -0
- package/article/54632.html +71 -0
- package/article/54912.html +756 -0
- package/article/54918.html +129 -0
- package/article/55119.html +136 -0
- package/article/55756.html +118 -0
- package/article/55769.html +136 -0
- package/article/55870.html +161 -0
- package/article/56139.html +92 -0
- package/article/56557.html +69 -0
- package/article/56604.html +69 -0
- package/article/56816.html +266 -0
- package/article/56926.html +153 -0
- package/article/57747.html +409 -0
- package/article/57965.html +475 -0
- package/article/58816.html +78 -0
- package/article/59059.html +435 -0
- package/article/59095.html +350 -0
- package/article/59349.html +244 -0
- package/article/59402.html +216 -0
- package/article/59448.html +55 -0
- package/article/59870.html +94 -0
- package/article/59877.html +208 -0
- package/article/5dbb6f41.html +86 -0
- package/article/6008.html +75 -0
- package/article/60327.html +126 -0
- package/article/6035.html +76 -0
- package/article/60428.html +71 -0
- package/article/60544.html +128 -0
- package/article/61319.html +95 -0
- package/article/61367.html +93 -0
- package/article/624d1918.html +292 -0
- package/article/62543.html +71 -0
- package/article/62887.html +169 -0
- package/article/63074.html +120 -0
- package/article/63266.html +311 -0
- package/article/63351.html +74 -0
- package/article/63542.html +104 -0
- package/article/63824.html +275 -0
- package/article/64051.html +653 -0
- package/article/64189b69.html +72 -0
- package/article/64354.html +75 -0
- package/article/64869.html +79 -0
- package/article/64923.html +596 -0
- package/article/65128.html +95 -0
- package/article/65295.html +79 -0
- package/article/6888.html +75 -0
- package/article/7065.html +84 -0
- package/article/7455.html +85 -0
- package/article/7a3ef8f.html +315 -0
- package/article/8140.html +188 -0
- package/article/8190.html +85 -0
- package/article/8225.html +78 -0
- package/article/84c9ccd6.html +159 -0
- package/article/8f9a9ae3.html +82 -0
- package/article/9174.html +73 -0
- package/article/9738.html +294 -0
- package/article/a4145266.html +71 -0
- package/article/bedea419.html +72 -0
- package/article/bf7e7421.html +78 -0
- package/article/c1867fbf.html +103 -0
- package/article/c5576490.html +70 -0
- package/article/dcb0db28.html +76 -0
- package/article/fc3b727a.html +79 -0
- package/atom.xml +445 -0
- package/baidusitemap.xml +1079 -0
- package/blocks/dns.txt +264 -0
- package/blocks/filter.txt +1070 -0
- package/blocks/script.js +42 -0
- package/categories/CDN/index.html +48 -0
- package/categories/IDE/index.html +48 -0
- package/categories/git/index.html +48 -0
- package/categories/hexo/index.html +48 -0
- package/categories//345/205/254/345/205/261/350/212/202/346/227/245/index.html +48 -0
- package/categories//345/210/206/344/272/253/index.html +48 -0
- package/categories//345/211/215/347/253/257/index.html +48 -0
- package/categories//345/211/215/347/253/257/page/2/index.html +48 -0
- package/categories//345/211/215/347/253/257//346/265/217/350/247/210/345/231/250/index.html +48 -0
- package/categories//345/211/215/347/253/257//346/265/217/350/247/210/345/231/250//347/275/221/347/273/234/345/215/217/350/256/256/index.html +48 -0
- package/categories//345/215/232/345/256/242/index.html +48 -0
- package/categories//345/267/245/345/205/267/index.html +48 -0
- package/categories//345/271/277/345/221/212/350/277/207/346/273/244/index.html +48 -0
- package/categories//345/271/277/345/221/212/350/277/207/346/273/244//350/247/206/351/242/221/347/224/265/350/247/206/345/260/217/350/257/264/346/274/253/347/224/273/350/265/204/350/256/257/351/237/263/344/271/220/index.html +48 -0
- package/categories//346/255/243/345/210/231/index.html +48 -0
- package/categories//346/265/217/350/247/210/345/231/250/index.html +48 -0
- package/categories//347/256/227/346/263/225/index.html +48 -0
- package/categories//350/265/204/350/256/257/index.html +48 -0
- package/categories//350/275/273/346/235/276/344/270/200/345/210/273/index.html +48 -0
- package/cdn/css/font-awesome.min.css +4 -0
- package/cdn/css/grids-responsive-min.css +7 -0
- package/cdn/css/normalize.css +349 -0
- package/cdn/css/pure-min.css +11 -0
- package/cdn/fonts/fontawesome-webfont.eot +0 -0
- package/cdn/fonts/fontawesome-webfont.svg +2671 -0
- package/cdn/fonts/fontawesome-webfont.ttf +0 -0
- package/cdn/fonts/fontawesome-webfont.woff +0 -0
- package/cdn/fonts/fontawesome-webfont.woff2 +0 -0
- package/cdn/js/Valine.min.js +17 -0
- package/cdn/js/canvas-nest.js +1 -0
- package/cdn/js/clipboard.min.js +7 -0
- package/cdn/js/crypto-js.js +25 -0
- package/cdn/js/jquery.min.js +2 -0
- package/css/default.css +1144 -0
- package/css/donate.css +338 -0
- package/css/hbe.style.css +749 -0
- package/css/style.css +2095 -0
- package/donate/index.html +39 -0
- package/google917dcf72f6e5c7f5.html +1 -0
- package/guestbook/index.html +68 -0
- package/hosts/ads.txt +149 -0
- package/hosts/flash.txt +9 -0
- package/hosts/github.txt +6 -0
- package/hosts/google.txt +16936 -0
- package/hosts/winrar.txt +2 -0
- package/img/alipay.svg +46 -0
- package/img/bitcoin.svg +135 -0
- package/img/blog.ico +0 -0
- package/img/blog.png +0 -0
- package/img/gaba.png +0 -0
- package/img/github.svg +1 -0
- package/img/like.svg +1 -0
- package/img/mp-mini.jpg +0 -0
- package/img/mp.png +0 -0
- package/img/paypal.svg +63 -0
- package/img/upy_logo.svg +59 -0
- package/img/wechat.svg +49 -0
- package/index.html +48 -0
- package/jd_root.txt +1 -0
- package/js/codeblock-resizer.js +51 -0
- package/js/dark.js +12 -0
- package/js/donate.js +87 -0
- package/js/fixedPage.js +106 -0
- package/js/gitment.browser.js +3751 -0
- package/js/search.js +86 -0
- package/js/share.js +60 -0
- package/js/smartresize.js +32 -0
- package/js/totop.js +12 -0
- package/kankan/index.html +77 -0
- package/lib/hbe.js +293 -0
- package/package.json +25 -0
- package/page/10/index.html +49 -0
- package/page/11/index.html +59 -0
- package/page/12/index.html +67 -0
- package/page/13/index.html +63 -0
- package/page/14/index.html +66 -0
- package/page/15/index.html +60 -0
- package/page/16/index.html +60 -0
- package/page/17/index.html +62 -0
- package/page/18/index.html +61 -0
- package/page/19/index.html +58 -0
- package/page/2/index.html +48 -0
- package/page/20/index.html +57 -0
- package/page/21/index.html +61 -0
- package/page/22/index.html +55 -0
- package/page/23/index.html +64 -0
- package/page/24/index.html +60 -0
- package/page/25/index.html +58 -0
- package/page/26/index.html +48 -0
- package/page/27/index.html +58 -0
- package/page/3/index.html +48 -0
- package/page/4/index.html +48 -0
- package/page/5/index.html +51 -0
- package/page/6/index.html +51 -0
- package/page/7/index.html +51 -0
- package/page/8/index.html +53 -0
- package/page/9/index.html +48 -0
- package/randomcall/README.html +1 -0
- package/randomcall/lucker.html +290 -0
- package/randomcall/lucky.png +0 -0
- package/robots.txt +22 -0
- package/search.xml +6740 -0
- package/sitemap.xml +2669 -0
- package/tags//345/216/237/345/210/233/index.html +48 -0
- package/tags//345/250/261/344/271/220/index.html +48 -0
- package/tags//346/211/213/345/206/231/index.html +48 -0
- package/tags//347/226/253/346/203/205/index.html +48 -0
- package/tags//350/275/254/350/275/275/index.html +48 -0
- package/tags//350/275/254/350/275/275/page/2/index.html +48 -0
- package/v.html +90 -0
|
@@ -0,0 +1,201 @@
|
|
|
1
|
+
<!DOCTYPE html><html lang="zh-CN" data-dark><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport"><meta content="yes" name="apple-mobile-web-app-capable"><meta content="black-translucent" name="apple-mobile-web-app-status-bar-style"><meta content="telephone=no" name="format-detection"><meta name="description" content="前端壹菜鸟,记录工作难题,关注前端知识,收集精彩博文,做技术的搬运工"><meta name="msvalidate.01" content="0FE4D8B3381D3D87088996B886E1E2BD"><title>详解webpack的out.libraryTarget属性 | 前端壹菜鸟</title><link rel="stylesheet" type="text/css" href="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/css/style.min.css"><link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/normalize.css@latest/normalize.min.css"><link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/purecss@latest/build/pure-min.min.css"><link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/purecss@latest/build/grids-responsive-min.css"><link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css"><link rel="icon" mask="" sizes="any" href="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/img/blog.ico"><link rel="Shortcut Icon" type="image/x-icon" href="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/img/blog.ico"><link rel="apple-touch-icon" href="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/img/blog.png"><link rel="apple-touch-icon-precomposed" href="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/img/blog.png"><link rel="alternate" type="application/atom+xml" href="/atom.xml"><script type="text/javascript" src="//cdn.jsdelivr.net/npm/jquery@latest/dist/jquery.min.js"></script><script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-8385136408348258"></script><script src="https://busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js" async></script><script>(function(){
|
|
2
|
+
var bp = document.createElement('script');
|
|
3
|
+
var curProtocol = window.location.protocol.split(':')[0];
|
|
4
|
+
if (curProtocol === 'https'){
|
|
5
|
+
bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
|
|
6
|
+
}
|
|
7
|
+
else{
|
|
8
|
+
bp.src = 'http://push.zhanzhang.baidu.com/push.js';
|
|
9
|
+
}
|
|
10
|
+
var s = document.getElementsByTagName("script")[0];
|
|
11
|
+
s.parentNode.insertBefore(bp, s);
|
|
12
|
+
})();
|
|
13
|
+
</script><script>(function(){
|
|
14
|
+
var src = 'https://jspassport.ssl.qhimg.com/11.0.1.js?d182b3f28525f2db83acfaaf6e696dba';
|
|
15
|
+
document.write('<script src="' + src + '" id="sozz"><\/script>');
|
|
16
|
+
})();
|
|
17
|
+
</script><script>var _hmt=_hmt||[];(function(){var hm=document.createElement("script");hm.src='https://hm.baidu.com/hm.js?011f0b44e8452bfa57fbfa23c5fe7683';var s=document.getElementsByTagName("script")[0];s.parentNode.insertBefore(hm, s);})();
|
|
18
|
+
</script><script async src="https://www.googletagmanager.com/gtag/js?id=UA-150860401-1"></script><script>window.dataLayer=window.dataLayer||[];function gtag(){dataLayer.push(arguments);};gtag('js',new Date());gtag('config','UA-150860401-1');
|
|
19
|
+
</script><script type="text/javascript" src="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/js/fixedPage.min.js"></script><meta name="generator" content="Hexo 6.3.0"></head><body><div class="body_container"><div id="header"><div class="site-name"><a id="logo" href="/.">前端壹菜鸟</a><p class="description">关注前端知识,收集精彩博文,做技术的搬运工</p></div><div id="nav-menu"><a class="current" href="/." target="_self"><i class="fa fa-home"> 首页</i></a><a href="/archives/" target="_self"><i class="fa fa-archive"> 归档</i></a><a href="/guestbook/" target="_self"><i class="fa fa-comments"> 留言</i></a><a href="/about/" target="_self"><i class="fa fa-user"> 关于</i></a><a href="https://laonongmin.online/" target="_target"><i class="fa fa-group"> 看看</i></a><a href="https://love.xuehuayu.cn/" target="_target"><i class="fa fa-heart"> LOVE</i></a></div></div><div class="pure-g" id="layout"><div class="pure-u-1 pure-u-md-3-4"><div class="content_container"><div class="post"><h1 class="post-title c-post">详解webpack的out.libraryTarget属性</h1><div class="post-meta"><span class="date">2020-10-19</span><span> | </span><span class="tag"><a href="/tags/%E8%BD%AC%E8%BD%BD/">转载 </a></span><span> | </span><span class="category"><a href="/categories/%E5%89%8D%E7%AB%AF/">前端 </a></span><span id="busuanzi_container_page_pv"> | <span id="busuanzi_value_page_pv"><i class="fa fa-spinner"></i></span><span> 阅读</span></span><span class="post-time"><span class="post-meta-item-text"> | </span><span class="post-meta-item-icon"><i class="fa fa-keyboard-o"></i><span class="post-count"> 1.9k</span><span class="post-meta-item-text"> 字</span></span></span><span class="post-time"> | <span class="post-meta-item-icon"><i class="fa fa-hourglass-half"></i><span class="post-count"> 7</span><span class="post-meta-item-text"> 分钟</span></span></span></div><a class="disqus-comment-count" href="/article/30818.html#vcomment"><span class="waline-comment-count" data-path="/article/30818.html"></span><span> 条评论</span></a><div class="post-content"><p><a target="_blank" rel="noopener" href="https://webpack.js.org/">Webpack</a> 作为目前前端最热门的打包工具,相信很多人都在项目中使用过,其繁杂的配置项也确实“配”得上他老大的身份 o(╯□╰)o。<code>output.library</code>和<code>output.libraryTarget</code>属性可能大家都会比较陌生,因为一般如果只在项目中使用 webpack 不需要关注这两个属性,但是如果是开发类库,那么这两个属性就是必须了解的。</p>
|
|
20
|
+
<span id="more"></span>
|
|
21
|
+
<h2 id="简介"><a href="#简介" class="headerlink" title="简介"></a>简介</h2><p>回想一下,当我们引入别人开发的类库时有几种方式?下面假设我们引入一个<code>demo</code>方法:</p>
|
|
22
|
+
<ul>
|
|
23
|
+
<li>传统方式:<code>script</code>标签</li>
|
|
24
|
+
</ul>
|
|
25
|
+
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line"><scriptsrc=<span class="string">"demo.js"</span>><<span class="regexp">/script><script>demo();</</span>script></span><br></pre></td></tr></table></figure>
|
|
26
|
+
|
|
27
|
+
<ul>
|
|
28
|
+
<li>AMD</li>
|
|
29
|
+
</ul>
|
|
30
|
+
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"><span class="title function_">define</span>([<span class="string">'demo'</span>], <span class="keyword">function</span>(<span class="params">demo</span>) {</span><br><span class="line"><span class="title function_">demo</span>();</span><br><span class="line">});</span><br></pre></td></tr></table></figure>
|
|
31
|
+
|
|
32
|
+
<ul>
|
|
33
|
+
<li>commonjs 方式</li>
|
|
34
|
+
</ul>
|
|
35
|
+
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"><span class="keyword">const</span> demo = <span class="built_in">require</span>(<span class="string">'demo'</span>);</span><br><span class="line"></span><br><span class="line"><span class="title function_">demo</span>();</span><br></pre></td></tr></table></figure>
|
|
36
|
+
|
|
37
|
+
<ul>
|
|
38
|
+
<li>ES6 module</li>
|
|
39
|
+
</ul>
|
|
40
|
+
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"><span class="keyword">import</span> demo <span class="keyword">from</span> <span class="string">'demo'</span>;</span><br><span class="line"></span><br><span class="line"><span class="title function_">demo</span>();</span><br></pre></td></tr></table></figure>
|
|
41
|
+
|
|
42
|
+
<p>大家思考一下,为什么这个类库能支持不同方式的引入?如何实现的?这就是 webpack 配置<code>output.library</code>和<code>output.libraryTarget</code>提供的功能。</p>
|
|
43
|
+
<h2 id="output-library"><a href="#output-library" class="headerlink" title="output.library"></a>output.library</h2><p>支持输入<code>string</code>或者<code>object</code>(从 webpack 3.1.0 版本开始支持; 限于 libraryTarget: “umd” 时使用)类型的值。</p>
|
|
44
|
+
<p><code>output.library</code>的值被如何使用会根据<code>output.libraryTarget</code>的取值不同而不同。而默认<code>output.libraryTarget</code>的取值是<code>var</code>,如果如下配置:</p>
|
|
45
|
+
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"><span class="attr">output</span>: {</span><br><span class="line"> <span class="attr">library</span>: <span class="string">"myDemo"</span></span><br><span class="line">}</span><br></pre></td></tr></table></figure>
|
|
46
|
+
|
|
47
|
+
<p>如果在 HTML 页面中使用<code>script</code>标签引入打包结果文件,那么变量<code>myDemo</code>对应的值将会是*入口文件(entry file)*的返回值。</p>
|
|
48
|
+
<h2 id="output-libraryTarget"><a href="#output-libraryTarget" class="headerlink" title="output.libraryTarget"></a>output.libraryTarget</h2><p>支持输入<code>string</code>类型的值。默认值:<code>var</code></p>
|
|
49
|
+
<p>此配置的作用是控制 webpack 打包的内容是如何暴露的。请注意这个选项需要和<code>output.library</code>所绑定的值一起产生作用。在以下的 demo 中,假设<code>output.library</code>值是<code>myDemo</code>。*<code>_entry_return_</code>表示入口点返回的值。在bundle中,它是webpack从入口点生成的函数的输出。*</p>
|
|
50
|
+
<h3 id="暴露一个变量"><a href="#暴露一个变量" class="headerlink" title="暴露一个变量"></a>暴露一个变量</h3><p>以下选项会把打包返回的值(无论暴露的是什么)绑定到一个由<code>output.library</code>指定的变量上,无论包是被如何引用。</p>
|
|
51
|
+
<ul>
|
|
52
|
+
<li><strong><code>libraryTarget: "var"</code>- (default)</strong></li>
|
|
53
|
+
</ul>
|
|
54
|
+
<p>使用这个配置,当库被加载时,那么库的返回值会被分配到使用用<code>var</code>申明的变量上。</p>
|
|
55
|
+
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"><span class="keyword">var</span> myDemo = _entry_return_;</span><br><span class="line"><span class="comment">// In a separate script...</span></span><br><span class="line"><span class="title function_">myDemo</span>();</span><br></pre></td></tr></table></figure>
|
|
56
|
+
|
|
57
|
+
<blockquote>
|
|
58
|
+
<p>如果没有设置<code>output.library</code>值,那么将不会发生赋值行为。</p>
|
|
59
|
+
</blockquote>
|
|
60
|
+
<ul>
|
|
61
|
+
<li><strong><code>libraryTarget: "assign"</code></strong></li>
|
|
62
|
+
</ul>
|
|
63
|
+
<p>使用这个设置,会把库返回值分配给一个没使用<code>var</code>申明的变量中,如果这个变量没有在引入作用域中提前申明过,那么将会挂载在全局作用域中。(注意,<strong>这个行为有可能会覆盖全局作用域中的已有变量</strong>)</p>
|
|
64
|
+
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">myDemo = _entry_return_;</span><br></pre></td></tr></table></figure>
|
|
65
|
+
|
|
66
|
+
<h3 id="通过对象属性暴露"><a href="#通过对象属性暴露" class="headerlink" title="通过对象属性暴露"></a>通过对象属性暴露</h3><p>以下选项将库的返回值(无论返回值是什么)分配给特定对象的指定属性,属性由<code>output.library</code>指定,对象由<code>output.libraryTarget</code>指定。</p>
|
|
67
|
+
<p>当<code>output.library</code>没有指定为非空字符串,那么默认行为是将库返回值的所有属性(properties)都分配到对象中,代码如下:</p>
|
|
68
|
+
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">(<span class="keyword">function</span>(<span class="params">e, a</span>) {<span class="keyword">for</span>(<span class="keyword">var</span> i <span class="keyword">in</span> a) e[i] = a[i]; }(${output.<span class="property">libraryTarget</span>}, _entry_return_)</span><br></pre></td></tr></table></figure>
|
|
69
|
+
|
|
70
|
+
<blockquote>
|
|
71
|
+
<p>注意,发生这个行为的时候 webpack 并不会检查对象中是否已经存在这些属性值,也就是会发生覆盖行为。</p>
|
|
72
|
+
</blockquote>
|
|
73
|
+
<ul>
|
|
74
|
+
<li><strong><code>libraryTarget: "this"</code></strong> - 将库的返回值分配给<code>this</code>对象的由<code>output.library</code>指定的属性。其中<code>this</code>的意义由用户决定。</li>
|
|
75
|
+
</ul>
|
|
76
|
+
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line"><span class="variable language_">this</span>[<span class="string">"myDemo"</span>] = _entry_return_;</span><br><span class="line"></span><br><span class="line"><span class="variable language_">this</span>.<span class="title function_">myDemo</span>();</span><br><span class="line"><span class="title function_">myDemo</span>(); <span class="comment">// if this is window</span></span><br></pre></td></tr></table></figure>
|
|
77
|
+
|
|
78
|
+
<ul>
|
|
79
|
+
<li><strong><code>libraryTarget: "window"</code></strong> - 将库的返回值分配给<code>window</code>对象的由<code>output.library</code>指定的属性。</li>
|
|
80
|
+
</ul>
|
|
81
|
+
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"><span class="variable language_">window</span>[<span class="string">"myDemo"</span>] = _entry_return_;</span><br><span class="line"></span><br><span class="line"><span class="variable language_">window</span>.<span class="property">myDemo</span>.<span class="title function_">doSomething</span>();</span><br></pre></td></tr></table></figure>
|
|
82
|
+
|
|
83
|
+
<ul>
|
|
84
|
+
<li><strong><code>libraryTarget: "global"</code></strong> - 将库的返回值分配给<code>global</code>对象的由<code>output.library</code>指定的属性。</li>
|
|
85
|
+
</ul>
|
|
86
|
+
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"><span class="variable language_">global</span>[<span class="string">"myDemo"</span>] = _entry_return_;</span><br><span class="line"></span><br><span class="line"><span class="variable language_">global</span>.<span class="title function_">myDemo</span>();</span><br></pre></td></tr></table></figure>
|
|
87
|
+
|
|
88
|
+
<ul>
|
|
89
|
+
<li><strong><code>libraryTarget: "commonjs"</code></strong> - 将库的返回值分配给<code>exports</code>对象的由<code>output.library</code>指定的属性。正如名字所指,这个选项可以使用在 CommonJS 环境。</li>
|
|
90
|
+
</ul>
|
|
91
|
+
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"><span class="built_in">exports</span>[<span class="string">"myDemo"</span>] = _entry_return_;</span><br><span class="line"></span><br><span class="line"><span class="built_in">require</span>(<span class="string">"myDemo"</span>).<span class="title function_">doSomething</span>();</span><br></pre></td></tr></table></figure>
|
|
92
|
+
|
|
93
|
+
<h3 id="模块定义系统"><a href="#模块定义系统" class="headerlink" title="模块定义系统"></a>模块定义系统</h3><p>以下选项将产生一个包含更完整兼容代码的包,以确保与各种模块系统的兼容性。 此时<code>output.library</code>选项在不同的<code>output.libraryTarget</code>选项下具有不同的含义。</p>
|
|
94
|
+
<ul>
|
|
95
|
+
<li><strong><code>libraryTarget: "commonjs2"</code></strong> - 将库的返回值分配给<code>module.exports</code>。正如名字所指,这个选项可以使用在 CommonJS 环境。</li>
|
|
96
|
+
</ul>
|
|
97
|
+
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line"><span class="variable language_">module</span>.<span class="property">exports</span> = _entry_return_;</span><br><span class="line"></span><br><span class="line"><span class="keyword">const</span> myDemo = <span class="built_in">require</span>(<span class="string">"myDemo"</span>);</span><br><span class="line"><span class="title function_">myDemo</span>();</span><br></pre></td></tr></table></figure>
|
|
98
|
+
|
|
99
|
+
<p>注意,在这个情况下<code>output.library</code>不是必须的,因为此时<code>output.library</code>选项将会被忽略。</p>
|
|
100
|
+
<blockquote>
|
|
101
|
+
<p><em>有没有注意到 CommonJS 和 CommonJS2 长的非常像?他们确实很相似,但是其中有微妙的区别,想了解更多可以参考<a target="_blank" rel="noopener" href="https://github.com/webpack/webpack/issues/1114">这个issue</a></em></p>
|
|
102
|
+
</blockquote>
|
|
103
|
+
<ul>
|
|
104
|
+
<li><strong><code>libraryTarget: "amd"</code></strong> - 这个选项会把库作为 AMD 模块导出。<br> AMD模块要求输入脚本(例如由<code><script></code>标签加载的第一个脚本)被定义为具有特定属性,例如通常由 RequireJS 或任何兼容的加载器(诸如almond)提供的<code>require</code>和<code>define</code>属性。否则,直接加载生成的 AMD 捆绑包将导致类似<code>define is not defined</code>的错误。<br> 由此定义生成的代码会如下:</li>
|
|
105
|
+
</ul>
|
|
106
|
+
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line"><span class="title function_">define</span>(<span class="string">"myDemo"</span>, [], <span class="keyword">function</span>(<span class="params"></span>) {<span class="keyword">return</span> _entry_return_;});</span><br></pre></td></tr></table></figure>
|
|
107
|
+
|
|
108
|
+
<p>以上的代码可以作为<code>script</code>标签引入代码的一部分被包含,然后在通过以下代码调用:</p>
|
|
109
|
+
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"><span class="built_in">require</span>([<span class="string">'myDemo'</span>], <span class="keyword">function</span>(<span class="params">myDemo</span>) {<span class="comment">// Do something with the library...</span></span><br><span class="line"><span class="title function_">myDemo</span>();</span><br><span class="line">});</span><br></pre></td></tr></table></figure>
|
|
110
|
+
|
|
111
|
+
<p>如果<code>output.library</code>没有定义有效值,那么生成的代码将如下:</p>
|
|
112
|
+
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line"><span class="title function_">define</span>([], <span class="keyword">function</span>(<span class="params"></span>) {<span class="keyword">return</span> _entry_return_;});</span><br></pre></td></tr></table></figure>
|
|
113
|
+
|
|
114
|
+
<p>如果直接使用<code><script></code>标签加载,该库将无法按预期生效,或者根本无法生效(在 almond 加载器的情况下)。它只能通过与 RequireJS 兼容的异步模块加载器通过该文件的实际路径进行引入,因此在这种情况下,如果这些由服务器直接提供,那么<code>output.path</code>和<code>output.filename</code>配置可能变得非常重要。</p>
|
|
115
|
+
<ul>
|
|
116
|
+
<li><strong><code>libraryTarget: "umd"</code></strong> - 这个选项会尝试把库暴露给前使用的模块定义系统,这使其和<code>CommonJS</code>、<code>AMD</code>兼容或者暴露为全局变量。<br><code>output.library</code> 选项在这里是必须的。最终代码输出如下:</li>
|
|
117
|
+
</ul>
|
|
118
|
+
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br></pre></td><td class="code"><pre><span class="line">(<span class="title function_">functionwebpackUniversalModuleDefinition</span>(root, factory) {<span class="keyword">if</span>(<span class="keyword">typeof</span> <span class="built_in">exports</span> === <span class="string">'object'</span> && <span class="keyword">typeof</span> <span class="variable language_">module</span> === <span class="string">'object'</span>)</span><br><span class="line"> <span class="variable language_">module</span>.<span class="property">exports</span> = <span class="title function_">factory</span>();</span><br><span class="line"><span class="title function_">elseif</span>(<span class="keyword">typeof</span> define === <span class="string">'function'</span> && define.<span class="property">amd</span>)</span><br><span class="line"> <span class="title function_">define</span>([], factory);</span><br><span class="line"><span class="title function_">elseif</span>(<span class="keyword">typeof</span> <span class="built_in">exports</span> === <span class="string">'object'</span>)</span><br><span class="line"> <span class="built_in">exports</span>[<span class="string">"MyLibrary"</span>] = <span class="title function_">factory</span>();</span><br><span class="line"><span class="keyword">else</span></span><br><span class="line"> root[<span class="string">"MyLibrary"</span>] = <span class="title function_">factory</span>();</span><br><span class="line">})(<span class="keyword">typeof</span> self !== <span class="string">'undefined'</span> ? self : <span class="variable language_">this</span>, <span class="keyword">function</span>(<span class="params"></span>) {<span class="keyword">return</span> _entry_return_;</span><br><span class="line">});</span><br></pre></td></tr></table></figure>
|
|
119
|
+
|
|
120
|
+
<p>如果 <code>output.library</code> 没有输入有效值,那么对于<em>全局变量</em>的处理会和上面提到的 <code>暴露一个变量</code> 一致。代码输出如下:</p>
|
|
121
|
+
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br></pre></td><td class="code"><pre><span class="line">(<span class="title function_">functionwebpackUniversalModuleDefinition</span>(root, factory) {<span class="keyword">if</span>(<span class="keyword">typeof</span> <span class="built_in">exports</span> === <span class="string">'object'</span> && <span class="keyword">typeof</span> <span class="variable language_">module</span> === <span class="string">'object'</span>)</span><br><span class="line"> <span class="variable language_">module</span>.<span class="property">exports</span> = <span class="title function_">factory</span>();</span><br><span class="line"><span class="title function_">elseif</span>(<span class="keyword">typeof</span> define === <span class="string">'function'</span> && define.<span class="property">amd</span>)</span><br><span class="line"> <span class="title function_">define</span>([], factory);</span><br><span class="line"><span class="keyword">else</span> {</span><br><span class="line"> <span class="keyword">var</span> a = <span class="title function_">factory</span>();</span><br><span class="line"> <span class="keyword">for</span>(<span class="keyword">var</span> i <span class="keyword">in</span> a) (<span class="keyword">typeof</span> <span class="built_in">exports</span> === <span class="string">'object'</span> ? <span class="built_in">exports</span> : root)[i] = a[i];</span><br><span class="line">}</span><br><span class="line">})(<span class="variable language_">this</span>, <span class="keyword">function</span>(<span class="params"></span>) {<span class="keyword">return</span> _entry_return_;</span><br><span class="line">});</span><br></pre></td></tr></table></figure>
|
|
122
|
+
|
|
123
|
+
<p>从 webpack 3.10.0 版本开始,我们可以通过把 <code>output.library</code> 定义为对象来控制不同目标环境的输出值。详情可参考<a target="_blank" rel="noopener" href="https://github.com/webpack/webpack/tree/master/examples/multi-part-library">这个Demo</a></p>
|
|
124
|
+
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><span class="line"><span class="attr">output</span>: {</span><br><span class="line"><span class="attr">library</span>: {</span><br><span class="line"> <span class="attr">root</span>: <span class="string">"myDemo"</span>,</span><br><span class="line"> <span class="attr">amd</span>: <span class="string">"my-demo"</span>,</span><br><span class="line"> <span class="attr">commonjs</span>: <span class="string">"my-common-demo"</span></span><br><span class="line">},</span><br><span class="line"><span class="attr">libraryTarget</span>: <span class="string">"umd"</span></span><br><span class="line">}</span><br></pre></td></tr></table></figure>
|
|
125
|
+
|
|
126
|
+
<h3 id="其他类型"><a href="#其他类型" class="headerlink" title="其他类型"></a>其他类型</h3><ul>
|
|
127
|
+
<li><strong><code>libraryTarget: "jsonp"</code></strong> - 这个方法会使用 jsonp 的方式把结果包裹起来。</li>
|
|
128
|
+
</ul>
|
|
129
|
+
<figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line"><span class="title function_">myDemo</span>(_entry_return_);</span><br></pre></td></tr></table></figure>
|
|
130
|
+
|
|
131
|
+
<p> 库的依赖由 <a target="_blank" rel="noopener" href="https://webpack.js.org/configuration/externals/">externals</a> 定义。</p>
|
|
132
|
+
<h2 id="总结"><a href="#总结" class="headerlink" title="总结"></a>总结</h2><p>以上所有栗子可以下载 <a target="_blank" rel="noopener" href="https://github.com/Yuliang-Lee/webpack-libraryTarget-demo">webpack-libraryTarget-demo</a> 项目,运行 <code>npm i</code> 安装依赖,接着 <code>npm run build-all</code> 命令执行打包,最后在 <code>dist</code> 目录下查看不同打包方式生成的代码。</p>
|
|
133
|
+
<ul>
|
|
134
|
+
<li>主要看第一行</li>
|
|
135
|
+
<li><code>(function(modules) { // webpackBootstrap</code> 这一行开始,指代上述的 <code>_entry_return_</code> 部分</li>
|
|
136
|
+
</ul>
|
|
137
|
+
<p><code>output.libraryTarget</code>一共支持的值:</p>
|
|
138
|
+
<ol>
|
|
139
|
+
<li>var - 默认值</li>
|
|
140
|
+
<li>assign</li>
|
|
141
|
+
<li>this</li>
|
|
142
|
+
<li>window</li>
|
|
143
|
+
<li>global</li>
|
|
144
|
+
<li>commonjs</li>
|
|
145
|
+
<li>commonjs2</li>
|
|
146
|
+
<li>amd</li>
|
|
147
|
+
<li>umd</li>
|
|
148
|
+
<li>jsonp</li>
|
|
149
|
+
</ol>
|
|
150
|
+
<hr>
|
|
151
|
+
<p><code>原文地址:https://blog.csdn.net/frank_yll/article/details/78992778 本文首发于 https://www.xlaoyu.info</code></p>
|
|
152
|
+
</div><iframe src="/donate/?AliPayQR=https://store.xuehuayu.cn/store/public/alipay_qr.jpg&WeChatQR=https://store.xuehuayu.cn/store/public/wechat_qr.png&UnionPayQR=null&GitHub=null&BTCQR=null&BTCKEY=null&PayPal=https://www.paypal.com/paypalme/OrdinaryPerson" style="overflow-x:hidden; overflow-y:hidden; border:0xp none #fff; min-height:240px; width:100%;" frameborder="0" scrolling="no"></iframe><div><ul class="post-copyright"><li class="post-copyright-author"><strong>本文作者:</strong>雪花雨</li><li class="post-copyright-link"><strong>本文链接:</strong><a href="/article/30818.html">https://xuehuayu.cn/article/30818.html</a></li><li class="post-copyright-license"><strong>版权声明:</strong>① 标为原创的文章为博主原创,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接。② 转载文章来自网络,已标明出处,<a href="mailto:cainiaoblog@126.com">侵删</a>。</li></ul></div><br><div class="tags"><a href="/tags/%E8%BD%AC%E8%BD%BD/">转载</a></div><div class="post-nav"><a class="pre" href="/article/35624.html">require().default:require模块的时候后面为什么要加一个default</a><a class="next" href="/article/36251.html">【http的演化过程】当我谈 HTTP 时,我谈些什么?</a></div><div id="vcomment"></div><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@waline/client@v2/dist/waline.min.css"><script src="//cdn.jsdelivr.net/npm/@waline/client@v2/dist/waline.js"></script><script>const origin = window.location.origin
|
|
153
|
+
const serverURL = origin.includes('cainiaoblog') ? 'https://cmts.cainiaoblog.cn' : 'https://cmts.xuehuayu.cn'
|
|
154
|
+
const locale = {
|
|
155
|
+
placeholder: '请正确填写昵称和邮箱,方便接收回复通知~',
|
|
156
|
+
sofa: '沙发空缺中,还不快抢~',
|
|
157
|
+
};
|
|
158
|
+
Waline.init({
|
|
159
|
+
el: '#vcomment',
|
|
160
|
+
serverURL: serverURL,
|
|
161
|
+
pageSize: '20',
|
|
162
|
+
visitor: true, // 阅读量统计
|
|
163
|
+
requiredMeta: ['nick', 'mail'],
|
|
164
|
+
emoji: [
|
|
165
|
+
'https://cdn.jsdelivr.net/gh/walinejs/emojis@1.0.0/weibo',
|
|
166
|
+
'https://cdn.jsdelivr.net/gh/walinejs/emojis@1.0.0/qq',
|
|
167
|
+
'https://cdn.jsdelivr.net/gh/walinejs/emojis@1.0.0/tw-emoji',
|
|
168
|
+
],
|
|
169
|
+
locale,
|
|
170
|
+
pageview: true
|
|
171
|
+
})
|
|
172
|
+
</script></div></div></div><div class="pure-u-1 pure-u-md-1-4 fixed-search hidden_mid_and_down"><div id="sidebar"><script type="text/javascript" src="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/js/search.min.js"></script><div class="widget"><div class="widget-search"><input class="search" type="radio" name="search" value="baidu" id="baidu" checked="checked"/><label class="label" for="baidu" title="百度全站搜索">百度</label><input class="search" type="radio" name="search" value="google" id="google"/><label class="label" for="google" title="谷歌全站搜索">谷歌</label><input class="search" type="radio" name="search" value="self" id="self"/><label class="label" for="self" title="使用站内搜索">站内</label></div><div class="widget" id="search"><form class="search-form" action="//www.baidu.com/baidu" method="get" accept-charset="utf-8" target="_blank"><input type="search" name="word" maxlength="30" placeholder="百度全站搜索"/><input type="hidden" name="si" value="xuehuayu.cn"/><input type="hidden" name="cl" value="3"/><input type="hidden" name="ct" value="2097152"/><input type="hidden" name="s" value="on"/><input class="search-submit" type="submit" value=""/></form></div></div><script>$('input[type=radio][name=search]').change(function() {
|
|
173
|
+
var val = $(this).val()
|
|
174
|
+
var self = '<div class="search-form"><input id="local-search-input" placeholder="站内搜索,首次慢" type="search" name="q" results="0"><input class="search-submit" type="submit" value=""/><div id="local-search-result"></div></div>'
|
|
175
|
+
var google = '<form class="search-form" action="//www.google.com/search" method="get" accept-charset="utf-8" target="_blank"><input type="search" name="q" maxlength="30" placeholder="谷歌全站搜索"><input type="hidden" name="sitesearch" value="xuehuayu.cn"><input class="search-submit" type="submit" value=""/></form>'
|
|
176
|
+
var baidu = '<form class="search-form" action="//www.baidu.com/baidu" method="get" accept-charset="utf-8" target="_blank"><input type="search" name="word" maxlength="30" placeholder="百度全站搜索"><input type="hidden" name="si" value="xuehuayu.cn"><input type="hidden" name="cl" value="3"><input type="hidden" name="ct" value="2097152"><input type="hidden" name="s" value="on"><input class="search-submit" type="submit" value=""/></form>'
|
|
177
|
+
|
|
178
|
+
if (val === 'self') {
|
|
179
|
+
$('#search').html(self)
|
|
180
|
+
var search_path = 'search.xml';
|
|
181
|
+
if (search_path.length == 0) {
|
|
182
|
+
search_path = 'search.xml';
|
|
183
|
+
}
|
|
184
|
+
var path = 'https://cdn.staticaly.com/gh/npljy/npljy.github.io/main/' + search_path;
|
|
185
|
+
searchFunc(path, 'local-search-input', 'local-search-result');
|
|
186
|
+
} else if (val === 'baidu') {
|
|
187
|
+
$('#search').html(baidu)
|
|
188
|
+
} else if (val === 'google') {
|
|
189
|
+
$('#search').html(google)
|
|
190
|
+
}
|
|
191
|
+
})</script><div class="widget widget-wxmp"><img alt="微信公众号" width="100%" src="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/img/mp-mini.jpg"/></div><div class="widget widget-categories"><div class="widget-title"><i class="fa fa-folder-o"> 分类</i></div><ul class="category-list"><li class="category-list-item"><a class="category-list-link" href="/categories/CDN/">CDN</a><span class="category-list-count">2</span></li><li class="category-list-item"><a class="category-list-link" href="/categories/IDE/">IDE</a><span class="category-list-count">1</span></li><li class="category-list-item"><a class="category-list-link" href="/categories/git/">git</a><span class="category-list-count">2</span></li><li class="category-list-item"><a class="category-list-link" href="/categories/hexo/">hexo</a><span class="category-list-count">1</span></li><li class="category-list-item"><a class="category-list-link" href="/categories/%E5%85%AC%E5%85%B1%E8%8A%82%E6%97%A5/">公共节日</a><span class="category-list-count">1</span></li><li class="category-list-item"><a class="category-list-link" href="/categories/%E5%88%86%E4%BA%AB/">分享</a><span class="category-list-count">29</span></li><li class="category-list-item"><a class="category-list-link" href="/categories/%E5%89%8D%E7%AB%AF/">前端</a><span class="category-list-count">191</span><ul class="category-list-child"><li class="category-list-item"><a class="category-list-link" href="/categories/%E5%89%8D%E7%AB%AF/%E6%B5%8F%E8%A7%88%E5%99%A8/">浏览器</a><span class="category-list-count">1</span><ul class="category-list-child"><li class="category-list-item"><a class="category-list-link" href="/categories/%E5%89%8D%E7%AB%AF/%E6%B5%8F%E8%A7%88%E5%99%A8/%E7%BD%91%E7%BB%9C%E5%8D%8F%E8%AE%AE/">网络协议</a><span class="category-list-count">1</span></li></ul></li></ul></li><li class="category-list-item"><a class="category-list-link" href="/categories/%E5%8D%9A%E5%AE%A2/">博客</a><span class="category-list-count">3</span></li><li class="category-list-item"><a class="category-list-link" href="/categories/%E5%B7%A5%E5%85%B7/">工具</a><span class="category-list-count">2</span></li><li class="category-list-item"><a class="category-list-link" href="/categories/%E5%B9%BF%E5%91%8A%E8%BF%87%E6%BB%A4/">广告过滤</a><span class="category-list-count">8</span><ul class="category-list-child"><li class="category-list-item"><a class="category-list-link" href="/categories/%E5%B9%BF%E5%91%8A%E8%BF%87%E6%BB%A4/%E8%A7%86%E9%A2%91%E7%94%B5%E8%A7%86%E5%B0%8F%E8%AF%B4%E6%BC%AB%E7%94%BB%E8%B5%84%E8%AE%AF%E9%9F%B3%E4%B9%90/">视频电视小说漫画资讯音乐</a><span class="category-list-count">2</span></li></ul></li><li class="category-list-item"><a class="category-list-link" href="/categories/%E6%AD%A3%E5%88%99/">正则</a><span class="category-list-count">5</span></li><li class="category-list-item"><a class="category-list-link" href="/categories/%E6%B5%8F%E8%A7%88%E5%99%A8/">浏览器</a><span class="category-list-count">5</span></li><li class="category-list-item"><a class="category-list-link" href="/categories/%E7%AE%97%E6%B3%95/">算法</a><span class="category-list-count">2</span></li><li class="category-list-item"><a class="category-list-link" href="/categories/%E8%B5%84%E8%AE%AF/">资讯</a><span class="category-list-count">16</span></li><li class="category-list-item"><a class="category-list-link" href="/categories/%E8%BD%BB%E6%9D%BE%E4%B8%80%E5%88%BB/">轻松一刻</a><span class="category-list-count">1</span></li></ul></div><div class="widget widget-tags"><div class="widget-title"><i class="fa fa-star-o"> 标签</i></div><div class="tagcloud"><a href="/tags/%E5%8E%9F%E5%88%9B/" style="font-size: 15px;">原创</a> <a href="/tags/%E8%BD%AC%E8%BD%BD/" style="font-size: 15px;">转载</a> <a href="/tags/%E6%89%8B%E5%86%99/" style="font-size: 15px;">手写</a> <a href="/tags/%E7%96%AB%E6%83%85/" style="font-size: 15px;">疫情</a> <a href="/tags/%E5%A8%B1%E4%B9%90/" style="font-size: 15px;">娱乐</a></div></div><div class="widget widget-recent-posts"><div class="widget-title"><i class="fa fa-file-o"> 最近文章</i></div><ul class="post-list"><li class="post-list-item"><a class="post-list-link" href="/article/c5576490.html">面试准备</a></li><li class="post-list-item"><a class="post-list-link" href="/article/84c9ccd6.html">精读《SolidJS》</a></li><li class="post-list-item"><a class="post-list-link" href="/article/53803e6.html">git提交注释规范</a></li><li class="post-list-item"><a class="post-list-link" href="/article/a4145266.html">前端数组拍平flat一行代码</a></li><li class="post-list-item"><a class="post-list-link" href="/article/bedea419.html">一道前端this面试题</a></li><li class="post-list-item"><a class="post-list-link" href="/article/bf7e7421.html">git多账号配置</a></li></ul></div><div class="widget widget-links"><div class="widget-title"><i class="fa fa-external-link"> 友情链接</i></div><ul></ul><a href="https://github.com/npljy?utm_source=xuehuayu.cn" title="GitHub" target="_blank">GitHub</a><ul></ul><a href="https://laonongmin.online?utm_source=xuehuayu.cn" title="看看" target="_blank">看看</a><ul></ul><a href="https://cainiaoblog.cn?utm_source=xuehuayu.cn" title="菜鸟博客" target="_blank">菜鸟博客</a><ul></ul><a href="mailto:cainiaoblog@126.com" title="友链联系" target="_blank">友链联系</a></div></div></div><div class="pure-u-1 pure-u-md-3-4"><div id="footer"><div class="flex-block justify-center align-center flex-wrap"><a class="gxba-link" id="gxba" rel="nofollow" target="_blank" href="http://beian.miit.gov.cn/">京ICP备20007647号-2</a><a class="gaba-link" id="gaba-link" rel="nofollow" target="_blank" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11010802031264"><img class="nofancybox" src="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/img/gaba.png" alt=""/><span id="gaba">京公网安备 11010802031264号</span><span style="padding-right: 10px;"></span></a><span>Copyright © 2023 </span><a href="/." rel="nofollow">前端壹菜鸟. </a><script>(function(){
|
|
192
|
+
var cnb =window.location.origin.indexOf('cainiaoblog') !==-1
|
|
193
|
+
if (cnb) {
|
|
194
|
+
var gxba =document.getElementById('gxba')
|
|
195
|
+
var gaba =document.getElementById('gaba')
|
|
196
|
+
var gabaLink =document.getElementById('gaba-link')
|
|
197
|
+
gxba.innerText ='京ICP备20007647号-1'
|
|
198
|
+
gaba.innerText ='京公网安备 11010802031254号'
|
|
199
|
+
gabaLink.setAttribute('href','http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11010802031254')
|
|
200
|
+
}
|
|
201
|
+
})()</script></div><div class="flex-block justify-center align-center flex-wrap"><a rel="nofollow" target="_blank" href="https://v6.51.la/s/Guz3lwHCsVme9Cu"><div class="busuanzi_container" id="busuanzi_container"><span class="busuanzi_container_site_pv" id="busuanzi_container_site_pv">访问量:<span id="busuanzi_value_site_pv"><i class="fa fa-spinner"></i></span></span><span class="busuanzi_container_site_uv" id="busuanzi_container_site_uv">访客数:<span id="busuanzi_value_site_uv"><i class="fa fa-spinner"></i></span></span><span style="padding-right: 10px;"></span></div></a><a rel="nofollow" target="_blank" href="https://www.upyun.com/?utm_source=lianmeng&utm_medium=referral"><span style="font-weight:bold;letter-spacing: 1px;">本网站由 </span><img class="nofancybox" height="32" style="vertical-align: middle" src="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/img/upy_logo.min.svg" alt=""/><span style="font-weight:bold;letter-spacing: 1px;">提供CDN加速/云存储服务</span></a><span style="padding-right: 10px;"></span><a rel="nofollow" style="font-size:18px;font-weight:bold;vertical-align: middle" target="_blank" title="注册就送代金券可直接使用" href="https://console.upyun.com/register/?invite=HyDsjZHIL">注册</a></div></div></div></div><a class="show" id="rocket" href="#top"></a><div class="darkmode-toggle">🌓</div><script type="text/javascript" src="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/js/totop.min.js" async></script><script type="text/javascript" src="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/js/dark.min.js" async></script><script type="text/javascript" src="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/js/codeblock-resizer.min.js"></script><script type="text/javascript" src="//cdn.staticaly.com/gh/npljy/npljy.github.io/main/js/smartresize.min.js"></script></div></body></html>
|