mirror of
https://github.com/a2nt/meta-lightbox.git
synced 2024-10-22 17:05:53 +02:00
IMPR: Refactoried to Vanilla JS
This commit is contained in:
parent
6af892ecfc
commit
13f77bed79
@ -3,7 +3,8 @@
|
||||
[
|
||||
"@babel/preset-env",
|
||||
{
|
||||
"targets": {
|
||||
"targets":
|
||||
{
|
||||
"node": "6.10",
|
||||
"esmodules": true
|
||||
}
|
||||
@ -21,7 +22,9 @@
|
||||
]
|
||||
],
|
||||
"plugins": [
|
||||
"@babel/plugin-syntax-top-level-await",
|
||||
"@babel/plugin-proposal-object-rest-spread",
|
||||
"@babel/plugin-syntax-jsx"
|
||||
"@babel/plugin-syntax-jsx",
|
||||
"@babel/plugin-proposal-class-properties"
|
||||
]
|
||||
}
|
||||
|
||||
1
dist/css/app.css
vendored
1
dist/css/app.css
vendored
@ -1 +0,0 @@
|
||||
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.meta-MetaWindow{position:fixed}.meta-MetaWindow .meta-error,.meta-MetaWindow .meta-spinner,.meta-MetaWindow .meta-spinner_embed{display:none;align-items:center;justify-content:center;z-index:2;text-align:center}.meta-MetaWindow .meta-spinner,.meta-MetaWindow .meta-spinner_embed{font-size:2rem;color:#fff;font-weight:700;text-transform:uppercase;position:absolute;left:0;right:0;top:0;bottom:0}.meta-MetaWindow .meta-spinner_embed{display:flex}.meta-MetaWindow-overlay{background:rgba(0,0,0,.8);display:none;position:fixed;left:0;right:0;top:0;bottom:0;align-items:center;justify-content:center;z-index:98}.meta-MetaWindow-overlay__loading .meta-spinner,.meta-MetaWindow-overlay__open{display:flex}.meta-MetaWindow-overlay__error .meta-content{justify-content:center}.meta-MetaWindow-overlay__error .meta-error{display:flex}.meta-MetaWindow .meta-nav{font-size:2rem;color:#fff;text-shadow:#000 0 0 .25em;border:0;background:none;z-index:2}.meta-MetaWindow .meta-nav:focus,.meta-MetaWindow .meta-nav:hover{color:#fff}.meta-MetaWindow .meta-nav:hover{color:#eceff1;background:none;text-shadow:none;text-decoration:none}.meta-MetaWindow .meta-nav-arrow{position:absolute;bottom:0;top:auto;display:flex;justify-content:center;align-items:center;font-size:2.5rem;padding:.25rem .5rem;z-index:2}.meta-MetaWindow .meta-nav-arrow:focus .fa,.meta-MetaWindow .meta-nav-arrow:focus .fab,.meta-MetaWindow .meta-nav-arrow:focus .far,.meta-MetaWindow .meta-nav-arrow:focus .fas,.meta-MetaWindow .meta-nav-arrow:hover .fa,.meta-MetaWindow .meta-nav-arrow:hover .fab,.meta-MetaWindow .meta-nav-arrow:hover .far,.meta-MetaWindow .meta-nav-arrow:hover .fas{transform:scale(1.5)}@media (min-width:992px){.meta-MetaWindow .meta-nav-arrow{top:0;bottom:0}}.meta-MetaWindow .meta-nav-arrow__next{right:0}.meta-MetaWindow .meta-nav-arrow__prev{left:0}@media (min-width:992px){.meta-MetaWindow .meta-nav-arrow__next{right:-3rem}.meta-MetaWindow .meta-nav-arrow__prev{left:-3rem}}.meta-MetaWindow .meta-close{position:absolute;top:-3rem;right:0;width:1.25em}.meta-MetaWindow .meta-close:hover .fa,.meta-MetaWindow .meta-close:hover .fab,.meta-MetaWindow .meta-close:hover .far,.meta-MetaWindow .meta-close:hover .fas{transform:rotate(-180deg)}@media (min-width:992px){.meta-MetaWindow .meta-close{top:-3rem;right:-3rem}}.meta-MetaWindow .meta-content{position:relative;width:100%;height:80%;display:flex;flex-direction:column;z-index:1}@media (min-width:992px){.meta-MetaWindow .meta-content{width:90%;height:90%;width:calc(90% - 3rem);height:calc(90% - 3rem)}}.meta-MetaWindow .meta-wrap{max-height:100%;max-width:100%;width:100%;overflow:auto;word-break:break-word;margin:0 auto}.meta-MetaWindow .meta-wrap img{object-fit:cover;max-width:100%;max-height:100%}.meta-MetaWindow__text .meta-content{background:#fff;color:#000;padding:1rem 0 1rem 1rem}.meta-MetaWindow__text .meta-wrap{padding-right:1rem}.meta-MetaWindow__image .meta-wrap,.meta-MetaWindow__image .typography,.meta-MetaWindow__video .meta-wrap,.meta-MetaWindow__video .typography{overflow:hidden;display:flex;justify-content:center;align-items:center;flex-direction:column;max-height:100%;max-width:100%;min-height:100%}.meta-MetaWindow__image .meta-wrap img,.meta-MetaWindow__image .typography img,.meta-MetaWindow__video .meta-wrap img,.meta-MetaWindow__video .typography img{margin:0}.meta-MetaWindow__embed:before,.meta-MetaWindow__video:before{content:"";display:block;position:relative;width:100%;padding-top:56.25%}.meta-MetaWindow__embed a[rel="nofollow noreferrer noopener"],.meta-MetaWindow__video a[rel="nofollow noreferrer noopener"]{color:#fff;font-size:1.2rem;font-weight:700}.meta-MetaWindow__embed a[rel="nofollow noreferrer noopener"]:before,.meta-MetaWindow__video a[rel="nofollow noreferrer noopener"]:before{content:"Unable to load. Please follow the provided link: ";display:block}.meta-MetaWindow__embed iframe,.meta-MetaWindow__video iframe{position:absolute;top:0;left:0;width:100%;height:100%}
|
||||
4
dist/index.html
vendored
4
dist/index.html
vendored
@ -1,3 +1,3 @@
|
||||
<!doctype html><html lang="en"><head><meta charset="utf-8"/><meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no"/><meta name="description" content="Meta Lightbox"/><meta name="author" content="Tony Air"/><title>Meta-lightbox Demo</title><style>.wrapper {
|
||||
padding: 2rem;
|
||||
}</style><link href="css/app.css" rel="stylesheet"></head><body><div class="wrapper"><h1>Meta-lightbox Demo</h1>NODE_ENV: production<style>[data-toggle=lightbox]:focus,[data-toggle=lightbox]:hover{text-decoration:underline}</style><div id="MetaLightboxContainer"><div class="typography"><h2>Loading data</h2><p><a href="../src/img/photo1.png" data-toggle="lightbox" data-gallery="demo" data-title="That's first link">Load an Image</a><br/><a href="../src/test.json" data-toggle="lightbox">Load JSON</a></p><style>[data-toggle=lightbox]:focus,[data-toggle=lightbox]:hover{text-decoration:underline}</style><br/><a href="../src/test-pajax.html" data-toggle="lightbox">Load Partial AJAX HTML</a><br/><a href="../src/not-found.html" data-toggle="lightbox">Not Found test</a><p></p><h2>Embeds</h2><p><a href="https://www.youtube.com/watch?v=WYvZZYthDRI" data-toggle="lightbox" data-embed="true">Embed Youtube link</a><br/><a href="https://vimeo.com/26216129" data-toggle="lightbox" data-embed="true">Embed Vimeo link</a><br/><a href="https://soundcloud.com/littlenapoleon/led-zeppelin-vs-rolling-stones" data-toggle="lightbox" data-embed="true">Embed SoundCloud link</a><br/><a href="https://www.instagram.com/p/CKl5n87hf7R/" data-toggle="lightbox" data-embed="true">Embed Instagram</a></p><h2>Other</h2><p><a href="../src/img/photo2.jpg" data-toggle="lightbox" data-gallery="demo">Use [data-toggle="lightbox"] attribute to attach lightbox action and [href] to specify URL.</a></p><p><a href="../src/img/photo1.png" data-toggle="lightbox" data-gallery="demo" data-title="Use data-title attribute to specify lightbox title">Use [data-gallery="YOUR_GALLERY_NAME"] to group ligthboxes with next/prev arrows</a></p><p data-toggle="lightbox" data-href="https://youtu.be/GgnClrx8N2k" data-gallery="demo" data-title="Yes you can link vimeo and youtube videos as long as AJAX content">Use [data-toggle="lightbox"] + [data-href] attribute to toggle lightbox on regular elements. <b>Click me!</b></p></div><div id="MetaLightboxApp"></div></div><div id="App"></div></div><script crossorigin src="https://unpkg.com/react@17/umd/react.production.min.js"></script><script crossorigin src="https://unpkg.com/react-dom@17/umd/react-dom.production.min.js"></script><link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"/><link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.12.0/css/all.css"/><script src="js/app.js"></script></body></html>
|
||||
padding: 2rem;
|
||||
}</style><script defer="defer" src="js/app.js"></script></head><body><div class="wrapper"><h1>Meta-lightbox Demo</h1>NODE_ENV: production<style>[data-toggle=lightbox]:focus,[data-toggle=lightbox]:hover{text-decoration:underline}</style><div id="MetaLightboxContainer"><div class="typography"><h2>Loading data</h2><p><a href="../src/img/photo1.png" data-toggle="lightbox" data-gallery="demo" data-title="That's first link">Load an Image</a><br/><a href="../src/test.json" data-toggle="lightbox">Load JSON</a></p><style>[data-toggle=lightbox]:focus,[data-toggle=lightbox]:hover{text-decoration:underline}</style><br/><a href="../src/test-pajax.html" data-toggle="lightbox">Load Partial AJAX HTML</a><br/><a href="../src/not-found.html" data-toggle="lightbox">Not Found test</a><p></p><h2>Embeds</h2><p><a href="https://www.youtube.com/watch?v=WYvZZYthDRI" data-toggle="lightbox" data-embed="true">Embed Youtube link</a><br/><a href="https://vimeo.com/26216129" data-toggle="lightbox" data-embed="true">Embed Vimeo link</a><br/><a href="https://soundcloud.com/littlenapoleon/led-zeppelin-vs-rolling-stones" data-toggle="lightbox" data-embed="true">Embed SoundCloud link</a><br/><a href="https://www.instagram.com/p/CKl5n87hf7R/" data-toggle="lightbox" data-embed="true">Embed Instagram</a></p><h2>Other</h2><p><a href="../src/img/photo2.jpg" data-toggle="lightbox" data-gallery="demo">Use [data-toggle="lightbox"] attribute to attach lightbox action and [href] to specify URL.</a></p><p><a href="../src/img/photo1.png" data-toggle="lightbox" data-gallery="demo" data-title="Use data-title attribute to specify lightbox title">Use [data-gallery="YOUR_GALLERY_NAME"] to group ligthboxes with next/prev arrows</a></p><p data-toggle="lightbox" data-href="https://youtu.be/GgnClrx8N2k" data-gallery="demo" data-title="Yes you can link vimeo and youtube videos as long as AJAX content">Use [data-toggle="lightbox"] + [data-href] attribute to toggle lightbox on regular elements. <b>Click me!</b></p></div><div id="MetaLightboxApp"></div></div><div id="App"></div></div><script crossorigin src="https://unpkg.com/react@17/umd/react.production.min.js"></script><script crossorigin src="https://unpkg.com/react-dom@17/umd/react-dom.production.min.js"></script><link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"/><link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.12.0/css/all.css"/></body></html>
|
||||
2
dist/js/app.js
vendored
2
dist/js/app.js
vendored
File diff suppressed because one or more lines are too long
150
dist/records.json
vendored
150
dist/records.json
vendored
@ -3,23 +3,25 @@
|
||||
{
|
||||
"chunks": {
|
||||
"byName": {
|
||||
"HtmlWebpackPlugin_0": 443
|
||||
"HtmlWebpackPlugin_0-0": 563
|
||||
},
|
||||
"bySource": {
|
||||
"0 HtmlWebpackPlugin_0": 443
|
||||
"0 HtmlWebpackPlugin_0-0": 563
|
||||
},
|
||||
"usedIds": [
|
||||
443
|
||||
563
|
||||
]
|
||||
},
|
||||
"modules": {
|
||||
"byIdentifier": {
|
||||
"./node_modules/.pnpm/html-loader@1.3.2_webpack@5.45.1/node_modules/html-loader/dist/cjs.js!./src/html/meta-lightbox.html": 288,
|
||||
"./node_modules/.pnpm/html-webpack-plugin@4.5.2_webpack@5.45.1/node_modules/html-webpack-plugin/lib/loader.js!./src/index.html": 987
|
||||
"./node_modules/.pnpm/html-loader@2.1.2_webpack@5.48.0/node_modules/html-loader/dist/cjs.js!./src/html/meta-lightbox.html": 688,
|
||||
"./node_modules/.pnpm/html-webpack-plugin@5.3.2_webpack@5.48.0/node_modules/html-webpack-plugin/lib/loader.js!./src/index.html": 255,
|
||||
"javascript/esm|data:text/javascript,__webpack_public_path__ = __webpack_base_uri__ = htmlWebpackPluginPublicPath;": 163
|
||||
},
|
||||
"usedIds": [
|
||||
288,
|
||||
987
|
||||
163,
|
||||
255,
|
||||
688
|
||||
]
|
||||
}
|
||||
}
|
||||
@ -37,88 +39,64 @@
|
||||
},
|
||||
"modules": {
|
||||
"byIdentifier": {
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/index.js": 131,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/adapters/xhr.js": 309,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/axios.js": 190,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/cancel/Cancel.js": 24,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/cancel/CancelToken.js": 90,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/cancel/isCancel.js": 780,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/core/Axios.js": 985,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/core/InterceptorManager.js": 370,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/core/buildFullPath.js": 876,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/core/createError.js": 817,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/core/dispatchRequest.js": 235,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/core/enhanceError.js": 28,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/core/mergeConfig.js": 398,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/core/settle.js": 567,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/core/transformData.js": 788,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/defaults.js": 849,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/helpers/bind.js": 34,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/helpers/buildURL.js": 450,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/helpers/combineURLs.js": 229,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/helpers/cookies.js": 971,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/helpers/isAbsoluteURL.js": 482,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/helpers/isAxiosError.js": 69,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/helpers/isURLSameOrigin.js": 364,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/helpers/normalizeHeaderName.js": 655,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/helpers/parseHeaders.js": 105,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/helpers/spread.js": 506,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/utils.js": 193,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/balanced-match@1.0.2/node_modules/balanced-match/index.js": 359,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/brace-expansion@2.0.1/node_modules/brace-expansion/index.js": 464,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/keyboardjs@2.6.4/node_modules/keyboardjs/dist/keyboard.js": 711,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/minimatch@3.0.4/node_modules/minimatch/minimatch.js": 962,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/prop-types@15.7.2/node_modules/prop-types/factoryWithThrowingShims.js": 761,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/prop-types@15.7.2/node_modules/prop-types/index.js": 977,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/prop-types@15.7.2/node_modules/prop-types/lib/ReactPropTypesSecret.js": 617,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/react-easy-swipe@0.0.21/node_modules/react-easy-swipe/lib/index.js": 329,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/react-easy-swipe@0.0.21/node_modules/react-easy-swipe/lib/react-swipe.js": 9,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/react-tiny-oembed@1.1.0_react-dom@17.0.2+react@17.0.2/node_modules/react-tiny-oembed/lib/index.js": 123,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_83afa9dfc9d2abf24d72ba2d4f88c1d9/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./src/js/_index.js|14056f186fa0be4fe4b8cf54ad4f081b": 658,
|
||||
"external \"React\"": 804,
|
||||
"ignored|./node_modules/.pnpm/minimatch@3.0.4/node_modules/minimatch|path": 61
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/index.js": 163,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/adapters/xhr.js": 641,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/axios.js": 900,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/cancel/Cancel.js": 215,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/cancel/CancelToken.js": 269,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/cancel/isCancel.js": 989,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/core/Axios.js": 947,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/core/InterceptorManager.js": 462,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/core/buildFullPath.js": 972,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/core/createError.js": 224,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/core/dispatchRequest.js": 216,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/core/enhanceError.js": 872,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/core/mergeConfig.js": 545,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/core/settle.js": 658,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/core/transformData.js": 824,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/defaults.js": 840,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/helpers/bind.js": 813,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/helpers/buildURL.js": 588,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/helpers/combineURLs.js": 20,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/helpers/cookies.js": 194,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/helpers/isAbsoluteURL.js": 877,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/helpers/isAxiosError.js": 749,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/helpers/isURLSameOrigin.js": 980,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/helpers/normalizeHeaderName.js": 904,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/helpers/parseHeaders.js": 33,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/helpers/spread.js": 115,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/utils.js": 233,
|
||||
"./node_modules/.pnpm/babel-loader@8.2.2_8b0464c8bf295490a69e78f11399b5a8/node_modules/babel-loader/lib/index.js??ruleSet[1].rules[0].use!./src/js/app.js|4a63aef513028d871fff28ba08c40b98": 858
|
||||
},
|
||||
"usedIds": [
|
||||
9,
|
||||
24,
|
||||
28,
|
||||
34,
|
||||
61,
|
||||
69,
|
||||
90,
|
||||
105,
|
||||
123,
|
||||
131,
|
||||
190,
|
||||
193,
|
||||
229,
|
||||
235,
|
||||
309,
|
||||
329,
|
||||
359,
|
||||
364,
|
||||
370,
|
||||
398,
|
||||
450,
|
||||
464,
|
||||
482,
|
||||
506,
|
||||
567,
|
||||
617,
|
||||
655,
|
||||
20,
|
||||
33,
|
||||
115,
|
||||
163,
|
||||
194,
|
||||
215,
|
||||
216,
|
||||
224,
|
||||
233,
|
||||
269,
|
||||
462,
|
||||
545,
|
||||
588,
|
||||
641,
|
||||
658,
|
||||
711,
|
||||
761,
|
||||
780,
|
||||
788,
|
||||
804,
|
||||
817,
|
||||
849,
|
||||
876,
|
||||
962,
|
||||
971,
|
||||
977,
|
||||
985
|
||||
749,
|
||||
813,
|
||||
824,
|
||||
840,
|
||||
858,
|
||||
872,
|
||||
877,
|
||||
900,
|
||||
904,
|
||||
947,
|
||||
972,
|
||||
980,
|
||||
989
|
||||
]
|
||||
}
|
||||
}
|
||||
4
dist/report.html
vendored
4
dist/report.html
vendored
@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="UTF-8"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1"/>
|
||||
<title>@a2nt/meta-lightbox-react [3 Aug 2021 at 21:56]</title>
|
||||
<title>@a2nt/ss-bootstrap-ui-webpack-boilerplate-react [4 Aug 2021 at 00:14]</title>
|
||||
<link rel="shortcut icon" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAMAAACdt4HsAAABrVBMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////+O1foceMD///+J0/qK1Pr7/v8Xdr/9///W8P4UdL7L7P0Scr2r4Pyj3vwad8D5/f/2/f+55f3E6f34+/2H0/ojfMKpzOd0rNgQcb3F3O/j9f7c8v6g3Pz0/P/w+v/q+P7n9v6T1/uQ1vuE0vqLut/y+v+Z2fvt+f+15Pzv9fuc2/vR7v2V2Pvd6/bg9P7I6/285/2y4/yp3/zp8vk8i8kqgMT7/P31+fyv4vxGkcz6/P6/6P3j7vfS5PNnpNUxhcbO7f7F6v3O4vHK3/DA2u631Ouy0eqXweKJud5wqthfoNMMbLvY8f73+v2dxeR8sNtTmdDx9/zX6PSjyeaCtd1YnNGX2PuQveCGt95Nls42h8dLlM3F4vBtAAAAM3RSTlMAAyOx0/sKBvik8opWGBMOAe3l1snDm2E9LSb06eHcu5JpHbarfHZCN9CBb08zzkdNS0kYaptYAAAFV0lEQVRYw92X51/aYBDHHS2O2qqttVbrqNq9m+TJIAYIShBkWwqIiCgoWvfeq7Z2/s29hyQNyUcR7LveGwVyXy6XH8/9rqxglLfUPLxVduUor3h0rfp2TYvpivk37929TkG037hffoX0+peVtZQc1589rigVUdXS/ABSAyEmGIO/1XfvldSK8vs3OqB6u3m0nxmIrvgB0dj7rr7Y9IbuF68hnfFaiHA/sxqm0wciIG43P60qKv9WXWc1RXGh/mFESFABTSBi0sNAKzqet17eCtOb3kZIDwxEEU0oAIJGYxNBDhBND29e0rtXXbcpuPmED9IhEAAQ/AXEaF8EPmnrrKsv0LvWR3fg5sWDNAFZOgAgaKvZDogHNU9MFwnnYROkc56RD5CjAbQX9Ow4g7upCsvYu55aSI/Nj0H1akgKQEUM94dwK65hYRmFU9MIcH/fqJYOZYcnuJSU/waKDgTOEVaVKhwrTRP5XzgSpAITYzom7UvkhFX5VutmxeNnWDjjswTKTyfgluNDGbUpWissXhF3s7mlSml+czWkg3D0l1nNjGNjz3myOQOa1KM/jOS6ebdbAVTCi4gljHSFrviza7tOgRWcS0MOUX9zdNgag5w7rRqA44Lzw0hr1WqES36dFliSJFlh2rXIae3FFcDDgKdxrUIDePr8jGcSClV1u7A9xeN0ModY/pHMxmR1EzRh8TJiwqsHmKW0l4FCEZI+jHio+JdPPE9qwQtTRxku2D8sIeRL2LnxWSllANCQGOIiqVHAz2ye2JR0DcH+HoxDkaADLjgxjKQ+AwCX/g0+DNgdG0ukYCONAe+dbc2IAc6fwt1ARoDSezNHxV2Cmzwv3O6lDMV55edBGwGK9n1+x2F8EDfAGCxug8MhpsMEcTEAWf3rx2vZhe/LAmtIn/6apE6PN0ULKgywD9mmdxbmFl3OvD5AS5fW5zLbv/YHmcsBTjf/afDz3MaZTVCfAP9z6/Bw6ycv8EUBWJIn9zYcoAWWlW9+OzO3vkTy8H+RANLmdrpOuYWdZYEXpo+TlCJrW5EARb7fF+bWdqf3hhyZI1nWJQHgznErZhbjoEsWqi8dQNoE294aldzFurwSABL2XXMf9+H1VQGke9exw5P/AnA5Pv5ngMul7LOvO922iwACu8WkCwLCafvM4CeWPxfA8lNHcWZSoi8EwMAIciKX2Z4SWCMAa3snCZ/G4EA8D6CMLNFsGQhkkz/gQNEBbPCbWsxGUpYVu3z8IyNAknwJkfPMEhLyrdi5RTyUVACkw4GSFRNWJNEW+fgPGwHD8/JxnRuLabN4CGNRkAE23na2+VmEAUmrYymSGjMAYqH84YUIyzgzs3XC7gNgH36Vcc4zKY9o9fgPBXUAiHHwVboBHGLiX6Zcjp1f2wu4tvzZKo0ecPnDtQYDQvJXaBeNzce45Fp28ZQLrEZVuFqgBwOalArKXnW1UzlnSusQKJqKYNuz4tOnI6sZG4zanpemv+7ySU2jbA9h6uhcgpfy6G2PahirDZ6zvq6zDduMVFTKvzw8wgyEdelwY9in3XkEPs3osJuwRQ4qTkfzifndg9Gfc4pdsu82+tTnHZTBa2EAMrqr2t43pguc8tNm7JQVQ2S0ukj2d22dhXYP0/veWtwKrCkNoNimAN5+Xr/oLrxswKbVJjteWrX7eR63o4j9q0GxnaBdWgGA5VStpanIjQmEhV0/nVt5VOFUvix6awJhPcAaTEShgrG+iGyvb5a0Ndb1YGHFPEwoqAinoaykaID1o1pdPNu7XsnCKQ3R+hwWIIhGvORcJUBYXe3Xa3vq/mF/N9V13ugufMkfXn+KHsRD0B8AAAAASUVORK5CYII=" type="image/x-icon" />
|
||||
|
||||
<script>
|
||||
@ -30,7 +30,7 @@
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<script>
|
||||
window.chartData = [{"label":"js/app.js","isAsset":true,"statSize":161397,"parsedSize":74826,"gzipSize":21988,"groups":[{"label":"node_modules/.pnpm","path":"./node_modules/.pnpm","statSize":136140,"groups":[{"label":"axios@0.21.1/node_modules/axios","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios","statSize":42138,"groups":[{"id":131,"label":"index.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/index.js","statSize":40,"parsedSize":33,"gzipSize":53},{"label":"lib","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib","statSize":42098,"groups":[{"label":"adapters","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/adapters","statSize":5769,"groups":[{"id":309,"label":"xhr.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/adapters/xhr.js","statSize":5769,"parsedSize":2023,"gzipSize":1018}],"parsedSize":2023,"gzipSize":1018},{"id":190,"label":"axios.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/axios.js","statSize":1504,"parsedSize":460,"gzipSize":283},{"label":"cancel","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/cancel","statSize":1725,"groups":[{"id":24,"label":"Cancel.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/cancel/Cancel.js","statSize":383,"parsedSize":205,"gzipSize":153},{"id":90,"label":"CancelToken.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/cancel/CancelToken.js","statSize":1241,"parsedSize":522,"gzipSize":287},{"id":780,"label":"isCancel.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/cancel/isCancel.js","statSize":101,"parsedSize":84,"gzipSize":97}],"parsedSize":811,"gzipSize":381},{"label":"core","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/core","statSize":12130,"groups":[{"id":985,"label":"Axios.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/core/Axios.js","statSize":2649,"parsedSize":1205,"gzipSize":557},{"id":370,"label":"InterceptorManager.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/core/InterceptorManager.js","statSize":1253,"parsedSize":469,"gzipSize":241},{"id":876,"label":"buildFullPath.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/core/buildFullPath.js","statSize":697,"parsedSize":115,"gzipSize":123},{"id":817,"label":"createError.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/core/createError.js","statSize":625,"parsedSize":123,"gzipSize":114},{"id":235,"label":"dispatchRequest.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/core/dispatchRequest.js","statSize":1806,"parsedSize":843,"gzipSize":383},{"id":28,"label":"enhanceError.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/core/enhanceError.js","statSize":1050,"parsedSize":398,"gzipSize":234},{"id":398,"label":"mergeConfig.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/core/mergeConfig.js","statSize":2830,"parsedSize":1414,"gzipSize":646},{"id":567,"label":"settle.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/core/settle.js","statSize":671,"parsedSize":213,"gzipSize":169},{"id":788,"label":"transformData.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/core/transformData.js","statSize":549,"parsedSize":139,"gzipSize":124}],"parsedSize":4919,"gzipSize":1749},{"id":849,"label":"defaults.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/defaults.js","statSize":2541,"parsedSize":1383,"gzipSize":691},{"label":"helpers","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/helpers","statSize":9191,"groups":[{"id":34,"label":"bind.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/helpers/bind.js","statSize":257,"parsedSize":174,"gzipSize":147},{"id":450,"label":"buildURL.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/helpers/buildURL.js","statSize":1615,"parsedSize":694,"gzipSize":435},{"id":229,"label":"combineURLs.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/helpers/combineURLs.js","statSize":371,"parsedSize":119,"gzipSize":121},{"id":971,"label":"cookies.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/helpers/cookies.js","statSize":1284,"parsedSize":659,"gzipSize":378},{"id":482,"label":"isAbsoluteURL.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/helpers/isAbsoluteURL.js","statSize":562,"parsedSize":108,"gzipSize":117},{"id":69,"label":"isAxiosError.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/helpers/isAxiosError.js","statSize":720,"parsedSize":370,"gzipSize":190},{"id":364,"label":"isURLSameOrigin.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/helpers/isURLSameOrigin.js","statSize":2074,"parsedSize":742,"gzipSize":397},{"id":655,"label":"normalizeHeaderName.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/helpers/normalizeHeaderName.js","statSize":356,"parsedSize":194,"gzipSize":166},{"id":105,"label":"parseHeaders.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/helpers/parseHeaders.js","statSize":1389,"parsedSize":573,"gzipSize":367},{"id":506,"label":"spread.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/helpers/spread.js","statSize":563,"parsedSize":103,"gzipSize":99}],"parsedSize":3736,"gzipSize":1554},{"id":193,"label":"utils.js","path":"./node_modules/.pnpm/axios@0.21.1/node_modules/axios/lib/utils.js","statSize":9238,"parsedSize":2884,"gzipSize":973}],"parsedSize":16216,"gzipSize":5316}],"parsedSize":16249,"gzipSize":5322},{"label":"balanced-match@1.0.2/node_modules/balanced-match","path":"./node_modules/.pnpm/balanced-match@1.0.2/node_modules/balanced-match","statSize":1220,"groups":[{"id":359,"label":"index.js","path":"./node_modules/.pnpm/balanced-match@1.0.2/node_modules/balanced-match/index.js","statSize":1220,"parsedSize":657,"gzipSize":380}],"parsedSize":657,"gzipSize":380},{"label":"brace-expansion@2.0.1/node_modules/brace-expansion","path":"./node_modules/.pnpm/brace-expansion@2.0.1/node_modules/brace-expansion","statSize":4795,"groups":[{"id":464,"label":"index.js","path":"./node_modules/.pnpm/brace-expansion@2.0.1/node_modules/brace-expansion/index.js","statSize":4795,"parsedSize":2209,"gzipSize":1016}],"parsedSize":2209,"gzipSize":1016},{"label":"keyboardjs@2.6.4/node_modules/keyboardjs/dist","path":"./node_modules/.pnpm/keyboardjs@2.6.4/node_modules/keyboardjs/dist","statSize":35812,"groups":[{"id":711,"label":"keyboard.js","path":"./node_modules/.pnpm/keyboardjs@2.6.4/node_modules/keyboardjs/dist/keyboard.js","statSize":35812,"parsedSize":18735,"gzipSize":5270}],"parsedSize":18735,"gzipSize":5270},{"label":"minimatch@3.0.4/node_modules/minimatch","path":"./node_modules/.pnpm/minimatch@3.0.4/node_modules/minimatch","statSize":25440,"groups":[{"id":962,"label":"minimatch.js","path":"./node_modules/.pnpm/minimatch@3.0.4/node_modules/minimatch/minimatch.js","statSize":25440,"parsedSize":7939,"gzipSize":3053}],"parsedSize":7939,"gzipSize":3053},{"label":"prop-types@15.7.2/node_modules/prop-types","path":"./node_modules/.pnpm/prop-types@15.7.2/node_modules/prop-types","statSize":2621,"groups":[{"id":761,"label":"factoryWithThrowingShims.js","path":"./node_modules/.pnpm/prop-types@15.7.2/node_modules/prop-types/factoryWithThrowingShims.js","statSize":1603,"parsedSize":843,"gzipSize":435},{"id":977,"label":"index.js","path":"./node_modules/.pnpm/prop-types@15.7.2/node_modules/prop-types/index.js","statSize":707,"parsedSize":35,"gzipSize":55},{"label":"lib","path":"./node_modules/.pnpm/prop-types@15.7.2/node_modules/prop-types/lib","statSize":311,"groups":[{"id":617,"label":"ReactPropTypesSecret.js","path":"./node_modules/.pnpm/prop-types@15.7.2/node_modules/prop-types/lib/ReactPropTypesSecret.js","statSize":311,"parsedSize":82,"gzipSize":102}],"parsedSize":82,"gzipSize":102}],"parsedSize":960,"gzipSize":504},{"label":"react-easy-swipe@0.0.21/node_modules/react-easy-swipe/lib","path":"./node_modules/.pnpm/react-easy-swipe@0.0.21/node_modules/react-easy-swipe/lib","statSize":12288,"groups":[{"id":329,"label":"index.js","path":"./node_modules/.pnpm/react-easy-swipe@0.0.21/node_modules/react-easy-swipe/lib/index.js","statSize":712,"parsedSize":304,"gzipSize":222},{"id":9,"label":"react-swipe.js","path":"./node_modules/.pnpm/react-easy-swipe@0.0.21/node_modules/react-easy-swipe/lib/react-swipe.js","statSize":11576,"parsedSize":6275,"gzipSize":2048}],"parsedSize":6579,"gzipSize":2083},{"label":"react-tiny-oembed@1.1.0_react-dom@17.0.2+react@17.0.2/node_modules/react-tiny-oembed/lib","path":"./node_modules/.pnpm/react-tiny-oembed@1.1.0_react-dom@17.0.2+react@17.0.2/node_modules/react-tiny-oembed/lib","statSize":11826,"groups":[{"id":123,"label":"index.js","path":"./node_modules/.pnpm/react-tiny-oembed@1.1.0_react-dom@17.0.2+react@17.0.2/node_modules/react-tiny-oembed/lib/index.js","statSize":11826,"parsedSize":7513,"gzipSize":2898}],"parsedSize":7513,"gzipSize":2898}],"parsedSize":60841,"gzipSize":18752},{"label":"src","path":"./src","statSize":25257,"groups":[{"label":"js","path":"./src/js","statSize":21130,"groups":[{"id":658,"label":"_index.js + 4 modules (concatenated)","path":"./src/js/_index.js + 4 modules (concatenated)","statSize":21130,"parsedSize":13932,"gzipSize":4023,"concatenated":true,"groups":[{"label":"src/js","path":"./src/js/_index.js + 4 modules (concatenated)/src/js","statSize":21088,"groups":[{"id":null,"label":"_index.js","path":"./src/js/_index.js + 4 modules (concatenated)/src/js/_index.js","statSize":61,"parsedSize":40,"gzipSize":11,"inaccurateSizes":true},{"id":null,"label":"app.js","path":"./src/js/_index.js + 4 modules (concatenated)/src/js/app.js","statSize":1891,"parsedSize":1246,"gzipSize":360,"inaccurateSizes":true},{"id":null,"label":"_events.js","path":"./src/js/_index.js + 4 modules (concatenated)/src/js/_events.js","statSize":1333,"parsedSize":878,"gzipSize":253,"inaccurateSizes":true},{"id":null,"label":"_window.jsx","path":"./src/js/_index.js + 4 modules (concatenated)/src/js/_window.jsx","statSize":17803,"parsedSize":11738,"gzipSize":3389,"inaccurateSizes":true}],"parsedSize":13904,"gzipSize":4015,"inaccurateSizes":true}]}],"parsedSize":13932,"gzipSize":4023},{"label":"scss","path":"./src/scss","statSize":4127,"groups":[{"id":null,"label":"_window.scss","path":"./src/scss/_window.scss","statSize":4127}],"parsedSize":0,"gzipSize":0}],"parsedSize":13932,"gzipSize":4023}]}];
|
||||
window.chartData = [{"label":"js/app.js","isAsset":true,"statSize":56244,"parsedSize":24465,"gzipSize":7837,"groups":[{"label":"node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios","statSize":42110,"groups":[{"id":163,"label":"index.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/index.js","statSize":40,"parsedSize":33,"gzipSize":53},{"label":"lib","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib","statSize":42070,"groups":[{"label":"adapters","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/adapters","statSize":5769,"groups":[{"id":641,"label":"xhr.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/adapters/xhr.js","statSize":5769,"parsedSize":2022,"gzipSize":1006}],"parsedSize":2022,"gzipSize":1006},{"id":900,"label":"axios.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/axios.js","statSize":1504,"parsedSize":464,"gzipSize":280},{"label":"cancel","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/cancel","statSize":1725,"groups":[{"id":215,"label":"Cancel.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/cancel/Cancel.js","statSize":383,"parsedSize":205,"gzipSize":153},{"id":269,"label":"CancelToken.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/cancel/CancelToken.js","statSize":1241,"parsedSize":523,"gzipSize":289},{"id":989,"label":"isCancel.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/cancel/isCancel.js","statSize":101,"parsedSize":84,"gzipSize":97}],"parsedSize":812,"gzipSize":383},{"label":"core","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/core","statSize":12130,"groups":[{"id":947,"label":"Axios.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/core/Axios.js","statSize":2649,"parsedSize":1205,"gzipSize":555},{"id":462,"label":"InterceptorManager.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/core/InterceptorManager.js","statSize":1253,"parsedSize":469,"gzipSize":241},{"id":972,"label":"buildFullPath.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/core/buildFullPath.js","statSize":697,"parsedSize":114,"gzipSize":122},{"id":224,"label":"createError.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/core/createError.js","statSize":625,"parsedSize":124,"gzipSize":114},{"id":216,"label":"dispatchRequest.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/core/dispatchRequest.js","statSize":1806,"parsedSize":843,"gzipSize":384},{"id":872,"label":"enhanceError.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/core/enhanceError.js","statSize":1050,"parsedSize":398,"gzipSize":234},{"id":545,"label":"mergeConfig.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/core/mergeConfig.js","statSize":2830,"parsedSize":1414,"gzipSize":643},{"id":658,"label":"settle.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/core/settle.js","statSize":671,"parsedSize":213,"gzipSize":169},{"id":824,"label":"transformData.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/core/transformData.js","statSize":549,"parsedSize":139,"gzipSize":123}],"parsedSize":4919,"gzipSize":1744},{"id":840,"label":"defaults.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/defaults.js","statSize":2541,"parsedSize":1383,"gzipSize":690},{"label":"helpers","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/helpers","statSize":9191,"groups":[{"id":813,"label":"bind.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/helpers/bind.js","statSize":257,"parsedSize":174,"gzipSize":147},{"id":588,"label":"buildURL.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/helpers/buildURL.js","statSize":1615,"parsedSize":694,"gzipSize":429},{"id":20,"label":"combineURLs.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/helpers/combineURLs.js","statSize":371,"parsedSize":119,"gzipSize":121},{"id":194,"label":"cookies.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/helpers/cookies.js","statSize":1284,"parsedSize":659,"gzipSize":380},{"id":877,"label":"isAbsoluteURL.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/helpers/isAbsoluteURL.js","statSize":562,"parsedSize":108,"gzipSize":117},{"id":749,"label":"isAxiosError.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/helpers/isAxiosError.js","statSize":720,"parsedSize":370,"gzipSize":190},{"id":980,"label":"isURLSameOrigin.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/helpers/isURLSameOrigin.js","statSize":2074,"parsedSize":742,"gzipSize":396},{"id":904,"label":"normalizeHeaderName.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/helpers/normalizeHeaderName.js","statSize":356,"parsedSize":194,"gzipSize":165},{"id":33,"label":"parseHeaders.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/helpers/parseHeaders.js","statSize":1389,"parsedSize":573,"gzipSize":364},{"id":115,"label":"spread.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/helpers/spread.js","statSize":563,"parsedSize":103,"gzipSize":99}],"parsedSize":3736,"gzipSize":1550},{"id":233,"label":"utils.js","path":"./node_modules/.pnpm/axios@0.21.1_debug@4.3.2/node_modules/axios/lib/utils.js","statSize":9210,"parsedSize":2885,"gzipSize":974}],"parsedSize":16221,"gzipSize":5293}],"parsedSize":16254,"gzipSize":5301},{"label":"src/js","path":"./src/js","statSize":14134,"groups":[{"id":858,"label":"app.js + 2 modules (concatenated)","path":"./src/js/app.js + 2 modules (concatenated)","statSize":14134,"parsedSize":8211,"gzipSize":2784,"concatenated":true,"groups":[{"label":"src/js","path":"./src/js/app.js + 2 modules (concatenated)/src/js","statSize":14134,"groups":[{"id":null,"label":"app.js","path":"./src/js/app.js + 2 modules (concatenated)/src/js/app.js","statSize":530,"parsedSize":307,"gzipSize":104,"inaccurateSizes":true},{"id":null,"label":"_events.js","path":"./src/js/app.js + 2 modules (concatenated)/src/js/_events.js","statSize":1333,"parsedSize":774,"gzipSize":262,"inaccurateSizes":true},{"id":null,"label":"_window.js","path":"./src/js/app.js + 2 modules (concatenated)/src/js/_window.js","statSize":12271,"parsedSize":7128,"gzipSize":2417,"inaccurateSizes":true}],"parsedSize":8211,"gzipSize":2784,"inaccurateSizes":true}]}],"parsedSize":8211,"gzipSize":2784}]}];
|
||||
window.defaultSizes = "parsed";
|
||||
</script>
|
||||
</body>
|
||||
|
||||
377
package.json
377
package.json
@ -1,184 +1,197 @@
|
||||
{
|
||||
"name": "@a2nt/meta-lightbox",
|
||||
"version": "3.1.6",
|
||||
"description": "Vanilla JS: Universal Lightbox window",
|
||||
"author": "Tony Air <tony@twma.pro>",
|
||||
"license": "BSD-2-Clause",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git+https://github.com/a2nt/meta-lightbox.git"
|
||||
},
|
||||
"private": false,
|
||||
"engines": {
|
||||
"node": ">= 12",
|
||||
"yarn": ">= 1.22.0"
|
||||
},
|
||||
"scripts": {
|
||||
"start": "cross-env NODE_ENV=development webpack-dev-server --https --config webpack.config.serve.js",
|
||||
"dash": "cross-env NODE_ENV=development webpack-dashboard -- webpack-dev-server --config webpack.config.serve.js",
|
||||
"build": "cross-env NODE_ENV=production webpack --progress --stats-all",
|
||||
"lint:check": "eslint ./src --config eslint.config.json && sass-lint ./src --config sass-lint.yml -v -q",
|
||||
"lint:fix": "eslint ./src --config eslint.config.json --fix && sass-lint ./src --config sass-lint.yml -v -q --fix",
|
||||
"lint:js": "eslint ./src --config eslint.config.json",
|
||||
"lint:sass": "sass-lint ./src --config sass-lint.yml -v -q",
|
||||
"prebuild": "yarn lint:fix && rimraf dist",
|
||||
"prepare": "yarn lint:fix && yarn build",
|
||||
"prunecaches": "rimraf ./node_modules/.cache/",
|
||||
"postinstall": "npm run prunecaches",
|
||||
"postuninstall": "npm run prunecaches",
|
||||
"preinstall": "npx only-allow pnpm"
|
||||
},
|
||||
"directories": {
|
||||
"assets": {
|
||||
"css": [
|
||||
"dist/css/app.css"
|
||||
],
|
||||
"js": [
|
||||
"dist/js/app.js"
|
||||
]
|
||||
}
|
||||
},
|
||||
"main": "./dist/js/app.js",
|
||||
"browser": {
|
||||
"app": "./dist/js/app.js"
|
||||
},
|
||||
"module": "./src/js/app.js",
|
||||
"browserslist": [
|
||||
"defaults",
|
||||
"ie>=11"
|
||||
],
|
||||
"dependencies": {
|
||||
"axios": "^0.21.1",
|
||||
"balanced-match": "^1.0.2",
|
||||
"bootstrap": "^4.6.0",
|
||||
"brace-expansion": "^2.0.1",
|
||||
"font-awesome": "^4.7.0",
|
||||
"keyboardjs": "^2.6.4",
|
||||
"material-design-color": "^2.3.2",
|
||||
"minimatch": "^3.0.4",
|
||||
"react": "^17.0.2",
|
||||
"react-dom": "^17.0.2",
|
||||
"react-easy-swipe": "^0.0.21",
|
||||
"react-tiny-oembed": "^1.1.0",
|
||||
"setimmediate": "^1.0.5"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@a2nt/image-sprite-webpack-plugin": "^0.2.5",
|
||||
"@babel/core": "^7.14.6",
|
||||
"@babel/eslint-parser": "^7.14.7",
|
||||
"@babel/plugin-proposal-class-properties": "^7.14.5",
|
||||
"@babel/plugin-proposal-object-rest-spread": "^7.14.7",
|
||||
"@babel/plugin-syntax-jsx": "^7.14.5",
|
||||
"@babel/plugin-transform-react-jsx": "^7.14.5",
|
||||
"@babel/preset-env": "^7.14.7",
|
||||
"@babel/preset-react": "^7.14.5",
|
||||
"@babel/runtime": "^7.14.6",
|
||||
"@googlemaps/markerclustererplus": "*",
|
||||
"animate.css": "^4.1.1",
|
||||
"ansi-html": "^0.0.7",
|
||||
"ansi-regex": "^5.0.0",
|
||||
"autoprefixer": "^10.3.1",
|
||||
"babel-loader": "^8.2.2",
|
||||
"classnames": "^2.3.1",
|
||||
"copy-webpack-plugin": "^7.0.0",
|
||||
"croppie": "^2.6.5",
|
||||
"cross-env": "^7.0.3",
|
||||
"css-loader": "^5.2.7",
|
||||
"eslint": "^7.31.0",
|
||||
"eslint-plugin-import": "^2.23.4",
|
||||
"eslint-plugin-jquery": "^1.5.1",
|
||||
"eslint-plugin-react": "^7.24.0",
|
||||
"events": "^3.3.0",
|
||||
"exif-js": "^2.3.0",
|
||||
"exports-loader": "^2.0.0",
|
||||
"fast-levenshtein": "^3.0.0",
|
||||
"fastest-levenshtein": "^1.0.12",
|
||||
"favicons-webpack-plugin": "github:jantimon/favicons-webpack-plugin#benkostr-webpack-5",
|
||||
"file-loader": "^6.2.0",
|
||||
"hoist-non-react-statics": "^3.3.2",
|
||||
"html-dom-parser": "^1.0.1",
|
||||
"html-entities": "^1.4.0",
|
||||
"html-loader": "^1.3.2",
|
||||
"html-react-parser": "^1.2.7",
|
||||
"html-webpack-plugin": "^4.5.2",
|
||||
"image-minimizer-webpack-plugin": "^2.2.0",
|
||||
"imagemin-jpegtran": "^7.0.0",
|
||||
"img-optimize-loader": "^1.0.7",
|
||||
"loglevel": "^1.7.1",
|
||||
"mini-css-extract-plugin": "^1.6.2",
|
||||
"node-sass": "^5.0.0",
|
||||
"object-assign": "^4.1.1",
|
||||
"optimize-css-assets-webpack-plugin": "^5.0.8",
|
||||
"postcss-loader": "^4.3.0",
|
||||
"prop-types": "^15.7.2",
|
||||
"punycode": "^2.1.1",
|
||||
"querystring": "^0.2.1",
|
||||
"react-hot-loader": "^4.13.0",
|
||||
"react-is": "^17.0.2",
|
||||
"react-lifecycles-compat": "^3.0.4",
|
||||
"resolve-url-loader": "^3.1.4",
|
||||
"rimraf": "^3.0.2",
|
||||
"routie": "0.0.1",
|
||||
"sass-lint": "^1.13.1",
|
||||
"sass-lint-fix": "^1.12.1",
|
||||
"sass-loader": "^10.2.0",
|
||||
"scheduler": "^0.20.2",
|
||||
"shallowequal": "^1.1.0",
|
||||
"strip-ansi": "^6.0.0",
|
||||
"style-loader": "^2.0.0",
|
||||
"svg-url-loader": "^7.1.1",
|
||||
"terser-webpack-plugin": "^5.1.4",
|
||||
"url": "^0.11.0",
|
||||
"url-loader": "^4.1.1",
|
||||
"webpack": "^5.45.1",
|
||||
"webpack-bundle-analyzer": "^4.4.2",
|
||||
"webpack-cli": "^4.7.2",
|
||||
"webpack-dev-server": "^4.0.0-beta.3",
|
||||
"webpack-manifest-plugin": "^3.1.1",
|
||||
"webpack-merge": "^5.8.0",
|
||||
"yarn": "^1.22.10"
|
||||
},
|
||||
"stylelint": {
|
||||
"rules": {
|
||||
"block-no-empty": null,
|
||||
"color-no-invalid-hex": true,
|
||||
"comment-empty-line-before": [
|
||||
"always",
|
||||
{
|
||||
"ignore": [
|
||||
"stylelint-commands",
|
||||
"after-comment"
|
||||
]
|
||||
}
|
||||
],
|
||||
"declaration-colon-space-after": "always",
|
||||
"indentation": [
|
||||
4,
|
||||
{
|
||||
"except": [
|
||||
"value"
|
||||
]
|
||||
}
|
||||
],
|
||||
"max-empty-lines": 2,
|
||||
"rule-empty-line-before": [
|
||||
"always",
|
||||
{
|
||||
"except": [
|
||||
"first-nested"
|
||||
],
|
||||
"ignore": [
|
||||
"after-comment"
|
||||
]
|
||||
}
|
||||
],
|
||||
"unit-whitelist": [
|
||||
"em",
|
||||
"rem",
|
||||
"%",
|
||||
"s",
|
||||
"px"
|
||||
]
|
||||
}
|
||||
}
|
||||
"name": "@a2nt/ss-bootstrap-ui-webpack-boilerplate",
|
||||
"version": "4.0.8",
|
||||
"description": "This UI Kit allows you to build Bootstrap 5 webapp with some extra UI features. It's easy to extend and easy to convert HTML templates to CMS templates.",
|
||||
"author": "Tony Air <tony@twma.pro>",
|
||||
"license": "BSD-2-Clause",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git+https://github.com/a2nt/webpack-bootstrap-ui-kit.git"
|
||||
},
|
||||
"private": false,
|
||||
"engines": {
|
||||
"node": ">= 12",
|
||||
"yarn": ">= 1.22.0"
|
||||
},
|
||||
"scripts": {
|
||||
"start": "cross-env NODE_ENV=development webpack-dev-server --config webpack.config.serve.js",
|
||||
"dash": "cross-env NODE_ENV=development webpack-dashboard -- webpack-dev-server --config webpack.config.serve.js",
|
||||
"build": "cross-env NODE_ENV=production webpack --progress --stats-all",
|
||||
"lint:check": "eslint ./src --config eslint.config.json && sass-lint ./src --config sass-lint.yml -v -q",
|
||||
"lint:fix": "eslint ./src --config eslint.config.json --fix && sass-lint ./src --config sass-lint.yml -v -q --fix",
|
||||
"lint:js": "eslint ./src --config eslint.config.json",
|
||||
"lint:sass": "sass-lint ./src --config sass-lint.yml -v -q",
|
||||
"prebuild": "yarn lint:fix && rimraf dist",
|
||||
"prepare": "yarn lint:fix && yarn build",
|
||||
"prunecaches": "rimraf ./node_modules/.cache/",
|
||||
"postinstall": "npm run prunecaches",
|
||||
"postuninstall": "npm run prunecaches",
|
||||
"preinstall": "npx only-allow pnpm",
|
||||
"update": "npx msw init ./src/_graphql"
|
||||
},
|
||||
"directories": {
|
||||
"assets": {
|
||||
"css": [
|
||||
"dist/css/app.css"
|
||||
],
|
||||
"js": [
|
||||
"dist/js/app.js"
|
||||
]
|
||||
}
|
||||
},
|
||||
"main": "./dist/js/app.js",
|
||||
"browser": {
|
||||
"app": "./dist/js/app.js"
|
||||
},
|
||||
"module": "./src/js/app.js",
|
||||
"browserslist": [
|
||||
"defaults",
|
||||
"ie>=11"
|
||||
],
|
||||
"dependencies": {
|
||||
"axios": "^0.21.1",
|
||||
"es6-template": "^1.0.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@a2nt/image-sprite-webpack-plugin": "^0.2.5",
|
||||
"@babel/core": "^7.14.8",
|
||||
"@babel/eslint-parser": "^7.14.9",
|
||||
"@babel/plugin-proposal-class-properties": "^7.14.5",
|
||||
"@babel/plugin-proposal-object-rest-spread": "^7.14.7",
|
||||
"@babel/plugin-syntax-jsx": "^7.14.5",
|
||||
"@babel/plugin-syntax-top-level-await": "^7.14.5",
|
||||
"@babel/plugin-transform-react-jsx": "^7.14.9",
|
||||
"@babel/plugin-transform-runtime": "^7.14.5",
|
||||
"@babel/preset-env": "^7.14.9",
|
||||
"@babel/preset-react": "^7.14.5",
|
||||
"@babel/runtime": "^7.14.8",
|
||||
"@googlemaps/markerclustererplus": "*",
|
||||
"@sucrase/webpack-loader": "^2.0.0",
|
||||
"@ungap/global-this": "^0.4.4",
|
||||
"@wry/context": "^0.6.0",
|
||||
"@wry/equality": "^0.5.1",
|
||||
"@wry/trie": "^0.3.0",
|
||||
"animate.css": "^4.1.1",
|
||||
"ansi-html": "^0.0.7",
|
||||
"ansi-regex": "^6.0.0",
|
||||
"autoprefixer": "^10.3.1",
|
||||
"babel-loader": "^8.2.2",
|
||||
"classnames": "^2.3.1",
|
||||
"copy-webpack-plugin": "^9.0.1",
|
||||
"croppie": "^2.6.5",
|
||||
"cross-env": "^7.0.3",
|
||||
"css-loader": "^6.2.0",
|
||||
"css-minimizer-webpack-plugin": "^3.0.2",
|
||||
"debug": "^4.3.2",
|
||||
"eslint": "^7.32.0",
|
||||
"eslint-plugin-import": "^2.23.4",
|
||||
"eslint-plugin-jquery": "^1.5.1",
|
||||
"eslint-plugin-react": "^7.24.0",
|
||||
"events": "^3.3.0",
|
||||
"exif-js": "^2.3.0",
|
||||
"exports-loader": "^3.0.0",
|
||||
"fast-json-stable-stringify": "^2.1.0",
|
||||
"fast-levenshtein": "^3.0.0",
|
||||
"fastest-levenshtein": "^1.0.12",
|
||||
"favicons": "^6.2.2",
|
||||
"favicons-webpack-plugin": "5.0.2",
|
||||
"file-loader": "^6.2.0",
|
||||
"graphql-tag": "^2.12.5",
|
||||
"hoist-non-react-statics": "^3.3.2",
|
||||
"html-dom-parser": "^1.0.1",
|
||||
"html-entities": "^2.3.2",
|
||||
"html-loader": "^2.1.2",
|
||||
"html-react-parser": "^1.2.7",
|
||||
"html-webpack-plugin": "^5.3.2",
|
||||
"img-optimize-loader": "^1.0.7",
|
||||
"loglevel": "^1.7.1",
|
||||
"mini-css-extract-plugin": "^2.1.0",
|
||||
"ms": "^2.1.3",
|
||||
"msw": "^0.33.2",
|
||||
"node-fetch": "^2.6.1",
|
||||
"node-sass": "^6.0.1",
|
||||
"object-assign": "^4.1.1",
|
||||
"optimism": "^0.16.1",
|
||||
"postcss-loader": "^6.1.1",
|
||||
"prop-types": "^15.7.2",
|
||||
"punycode": "^2.1.1",
|
||||
"querystring": "^0.2.1",
|
||||
"raw-loader": "^4.0.2",
|
||||
"react": "^17.0.2",
|
||||
"react-dom": "^17.0.2",
|
||||
"react-hot-loader": "^4.13.0",
|
||||
"react-is": "^17.0.2",
|
||||
"react-lifecycles-compat": "^3.0.4",
|
||||
"regenerator-runtime": "^0.13.9",
|
||||
"resolve-url-loader": "^4.0.0",
|
||||
"rimraf": "^3.0.2",
|
||||
"routie": "0.0.1",
|
||||
"sass-lint": "^1.13.1",
|
||||
"sass-lint-fix": "^1.12.1",
|
||||
"sass-loader": "^12.1.0",
|
||||
"scheduler": "^0.20.2",
|
||||
"shallowequal": "^1.1.0",
|
||||
"strip-ansi": "^7.0.0",
|
||||
"style-loader": "^3.2.1",
|
||||
"sucrase": "^3.20.0",
|
||||
"svg-url-loader": "^7.1.1",
|
||||
"symbol-observable": "^4.0.0",
|
||||
"terser-webpack-plugin": "^5.1.4",
|
||||
"ts-invariant": "^0.9.0",
|
||||
"tslib": "^2.3.0",
|
||||
"url": "^0.11.0",
|
||||
"url-loader": "^4.1.1",
|
||||
"webpack": "^5.48.0",
|
||||
"webpack-bundle-analyzer": "^4.4.2",
|
||||
"webpack-cli": "^4.7.2",
|
||||
"webpack-dev-server": "^4.0.0-rc.0",
|
||||
"webpack-manifest-plugin": "^4.0.2",
|
||||
"webpack-merge": "^5.8.0",
|
||||
"yarn": "^1.22.11",
|
||||
"zen-observable": "^0.8.15",
|
||||
"zen-observable-ts": "^1.1.0"
|
||||
},
|
||||
"stylelint": {
|
||||
"rules": {
|
||||
"block-no-empty": null,
|
||||
"color-no-invalid-hex": true,
|
||||
"comment-empty-line-before": [
|
||||
"always",
|
||||
{
|
||||
"ignore": [
|
||||
"stylelint-commands",
|
||||
"after-comment"
|
||||
]
|
||||
}
|
||||
],
|
||||
"declaration-colon-space-after": "always",
|
||||
"indentation": [
|
||||
4,
|
||||
{
|
||||
"except": [
|
||||
"value"
|
||||
]
|
||||
}
|
||||
],
|
||||
"max-empty-lines": 2,
|
||||
"rule-empty-line-before": [
|
||||
"always",
|
||||
{
|
||||
"except": [
|
||||
"first-nested"
|
||||
],
|
||||
"ignore": [
|
||||
"after-comment"
|
||||
]
|
||||
}
|
||||
],
|
||||
"unit-whitelist": [
|
||||
"em",
|
||||
"rem",
|
||||
"%",
|
||||
"s",
|
||||
"px"
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,108 +1,59 @@
|
||||
<style>
|
||||
[data-toggle='lightbox']:hover,
|
||||
[data-toggle='lightbox']:focus {
|
||||
text-decoration: underline;
|
||||
}
|
||||
[data-toggle='lightbox']:hover,
|
||||
[data-toggle='lightbox']:focus {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<div id="MetaLightboxContainer">
|
||||
<div class="typography">
|
||||
<h2>Loading data</h2>
|
||||
<div class="typography">
|
||||
<h2>Loading data</h2>
|
||||
<p>
|
||||
<a href="public/src/img/photo1.png" data-toggle="lightbox" data-gallery="demo" data-title="That's first link">Load an Image</a>
|
||||
<br />
|
||||
<a href="public/src/test.json" data-toggle="lightbox">
|
||||
Load JSON </a>
|
||||
<style>
|
||||
[data-toggle='lightbox']:hover,
|
||||
[data-toggle='lightbox']:focus {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
<p>
|
||||
<a
|
||||
href="../src/img/photo1.png"
|
||||
data-toggle="lightbox"
|
||||
data-gallery="demo"
|
||||
data-title="That's first link"
|
||||
>Load an Image</a
|
||||
>
|
||||
|
||||
<br />
|
||||
|
||||
<a href="../src/test.json" data-toggle="lightbox">
|
||||
Load JSON </a
|
||||
><style>
|
||||
[data-toggle='lightbox']:hover,
|
||||
[data-toggle='lightbox']:focus {
|
||||
text-decoration: underline;
|
||||
}
|
||||
</style>
|
||||
|
||||
<br />
|
||||
<a href="../src/test-pajax.html" data-toggle="lightbox">
|
||||
Load Partial AJAX HTML </a
|
||||
><br />
|
||||
|
||||
<a href="../src/not-found.html" data-toggle="lightbox">
|
||||
Not Found test
|
||||
</a>
|
||||
</p>
|
||||
|
||||
<h2>Embeds</h2>
|
||||
<p>
|
||||
<a
|
||||
href="https://www.youtube.com/watch?v=WYvZZYthDRI"
|
||||
data-toggle="lightbox"
|
||||
data-embed="true"
|
||||
>Embed Youtube link</a
|
||||
>
|
||||
<br />
|
||||
<a
|
||||
href="https://vimeo.com/26216129"
|
||||
data-toggle="lightbox"
|
||||
data-embed="true"
|
||||
>Embed Vimeo link</a
|
||||
>
|
||||
<br />
|
||||
|
||||
<a
|
||||
href="https://soundcloud.com/littlenapoleon/led-zeppelin-vs-rolling-stones"
|
||||
data-toggle="lightbox"
|
||||
data-embed="true"
|
||||
>Embed SoundCloud link</a
|
||||
><br />
|
||||
<a
|
||||
href="https://www.instagram.com/p/CKl5n87hf7R/"
|
||||
data-toggle="lightbox"
|
||||
data-embed="true"
|
||||
>Embed Instagram</a
|
||||
>
|
||||
</p>
|
||||
|
||||
<h2>Other</h2>
|
||||
<p>
|
||||
<a
|
||||
href="../src/img/photo2.jpg"
|
||||
data-toggle="lightbox"
|
||||
data-gallery="demo"
|
||||
>
|
||||
Use [data-toggle="lightbox"] attribute to attach lightbox action
|
||||
and [href] to specify URL.
|
||||
</a>
|
||||
</p>
|
||||
<p>
|
||||
<a
|
||||
href="../src/img/photo1.png"
|
||||
data-toggle="lightbox"
|
||||
data-gallery="demo"
|
||||
data-title="Use data-title attribute to specify lightbox title"
|
||||
>
|
||||
Use [data-gallery="YOUR_GALLERY_NAME"] to group ligthboxes with
|
||||
next/prev arrows
|
||||
</a>
|
||||
</p>
|
||||
<p
|
||||
data-toggle="lightbox"
|
||||
data-href="https://youtu.be/GgnClrx8N2k"
|
||||
data-gallery="demo"
|
||||
data-title="Yes you can link vimeo and youtube videos as long as AJAX content"
|
||||
>
|
||||
Use [data-toggle="lightbox"] + [data-href] attribute to toggle
|
||||
lightbox on regular elements.
|
||||
<b>Click me!</b>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div id="MetaLightboxApp"></div>
|
||||
</style>
|
||||
<br />
|
||||
<a href="public/src/test-pajax.html" data-toggle="lightbox">
|
||||
Load Partial AJAX HTML </a><br />
|
||||
<a href="public/src/not-found.html" data-toggle="lightbox">
|
||||
Not Found test
|
||||
</a>
|
||||
</p>
|
||||
<h2>Embeds</h2>
|
||||
<p>
|
||||
<a href="https://www.youtube.com/watch?v=WYvZZYthDRI" data-toggle="lightbox" data-embed="true">Embed Youtube link</a>
|
||||
<br />
|
||||
<a href="https://vimeo.com/26216129" data-toggle="lightbox" data-embed="true">Embed Vimeo link</a>
|
||||
<br />
|
||||
<a href="https://soundcloud.com/littlenapoleon/led-zeppelin-vs-rolling-stones" data-toggle="lightbox" data-embed="true">Embed SoundCloud link</a><br />
|
||||
<a href="https://www.instagram.com/p/CKl5n87hf7R/" data-toggle="lightbox" data-embed="true">Embed Instagram</a>
|
||||
</p>
|
||||
<h2>Other</h2>
|
||||
<p>
|
||||
<a href="public/src/img/photo2.jpg" data-toggle="lightbox" data-gallery="demo">
|
||||
Use [data-toggle="lightbox"] attribute to attach lightbox action
|
||||
and [href] to specify URL.
|
||||
</a>
|
||||
</p>
|
||||
<p>
|
||||
<a href="public/src/img/photo1.png" data-toggle="lightbox" data-gallery="demo" data-title="Use data-title attribute to specify lightbox title">
|
||||
Use [data-gallery="YOUR_GALLERY_NAME"] to group ligthboxes with
|
||||
next/prev arrows
|
||||
</a>
|
||||
</p>
|
||||
<p data-toggle="lightbox" data-href="https://youtu.be/GgnClrx8N2k" data-gallery="demo" data-title="Yes you can link vimeo and youtube videos as long as AJAX content">
|
||||
Use [data-toggle="lightbox"] + [data-href] attribute to toggle
|
||||
lightbox on regular elements.
|
||||
<b>Click me!</b>
|
||||
</p>
|
||||
</div>
|
||||
<div id="MetaLightboxApp"></div>
|
||||
</div>
|
||||
|
||||
@ -1,43 +1,36 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta
|
||||
name="viewport"
|
||||
content="width=device-width, initial-scale=1, shrink-to-fit=no"
|
||||
/>
|
||||
<meta name="description" content="Meta Lightbox" />
|
||||
<meta name="author" content="Tony Air" />
|
||||
<title>Meta-lightbox Demo</title>
|
||||
<style>
|
||||
.wrapper {
|
||||
padding: 2rem;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrapper">
|
||||
<h1>Meta-lightbox Demo</h1>
|
||||
NODE_ENV: <%= NODE_ENV %> <%=
|
||||
require('html-loader!./html/meta-lightbox.html') %>
|
||||
<div id="App"></div>
|
||||
</div>
|
||||
|
||||
<!-- React is required -->
|
||||
<%= REACT_SCRIPTS %>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
|
||||
<meta name="description" content="Meta Lightbox" />
|
||||
<meta name="author" content="Tony Air" />
|
||||
<title>Meta-lightbox Demo</title>
|
||||
<style>
|
||||
.wrapper {
|
||||
padding: 2rem;
|
||||
}
|
||||
|
||||
<!-- That's optional dependencies -->
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<!-- jQuery -->
|
||||
<!-- script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script -->
|
||||
<body>
|
||||
<div class="wrapper">
|
||||
<h1>Meta-lightbox Demo</h1>
|
||||
NODE_ENV:
|
||||
<%= NODE_ENV %>
|
||||
<%=
|
||||
require('html-loader!./html/meta-lightbox.html').default %>
|
||||
<div id="App"></div>
|
||||
</div>
|
||||
<!-- React is required -->
|
||||
<%= REACT_SCRIPTS %>
|
||||
<!-- That's optional dependencies -->
|
||||
<!-- jQuery -->
|
||||
<!-- script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script -->
|
||||
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" />
|
||||
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.12.0/css/all.css" />
|
||||
</body>
|
||||
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://use.fontawesome.com/releases/v5.12.0/css/all.css"
|
||||
/>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -3,78 +3,11 @@
|
||||
*/
|
||||
|
||||
import Events from './_events';
|
||||
import {
|
||||
Component
|
||||
} from 'react';
|
||||
import Swipe from 'react-easy-swipe';
|
||||
import KeyboardJS from 'keyboardjs';
|
||||
|
||||
import Embed, {
|
||||
defaultProviders
|
||||
} from 'react-tiny-oembed';
|
||||
|
||||
const W = window;
|
||||
|
||||
const InstagramProvider = {
|
||||
provider_name: 'Instagram',
|
||||
provider_url: 'https://instagram.com',
|
||||
endpoints: [{
|
||||
schemes: [
|
||||
'http://instagram.com/*/p/*,',
|
||||
'http://www.instagram.com/*/p/*,',
|
||||
'https://instagram.com/*/p/*,',
|
||||
'https://www.instagram.com/*/p/*,',
|
||||
'http://instagram.com/p/*',
|
||||
'http://instagr.am/p/*',
|
||||
'http://www.instagram.com/p/*',
|
||||
'http://www.instagr.am/p/*',
|
||||
'https://instagram.com/p/*',
|
||||
'https://instagr.am/p/*',
|
||||
'https://www.instagram.com/p/*',
|
||||
'https://www.instagr.am/p/*',
|
||||
'http://instagram.com/tv/*',
|
||||
'http://instagr.am/tv/*',
|
||||
'http://www.instagram.com/tv/*',
|
||||
'http://www.instagr.am/tv/*',
|
||||
'https://instagram.com/tv/*',
|
||||
'https://instagr.am/tv/*',
|
||||
'https://www.instagram.com/tv/*',
|
||||
'https://www.instagr.am/tv/*',
|
||||
],
|
||||
url: 'https://graph.facebook.com/v9.0/instagram_oembed',
|
||||
formats: ['json'],
|
||||
},
|
||||
{
|
||||
schemes: [
|
||||
'http://instagram.com/*/p/*,',
|
||||
'http://www.instagram.com/*/p/*,',
|
||||
'https://instagram.com/*/p/*,',
|
||||
'https://www.instagram.com/*/p/*,',
|
||||
'http://instagram.com/p/*',
|
||||
'http://instagr.am/p/*',
|
||||
'http://www.instagram.com/p/*',
|
||||
'http://www.instagr.am/p/*',
|
||||
'https://instagram.com/p/*',
|
||||
'https://instagr.am/p/*',
|
||||
'https://www.instagram.com/p/*',
|
||||
'https://www.instagr.am/p/*',
|
||||
'http://instagram.com/tv/*',
|
||||
'http://instagr.am/tv/*',
|
||||
'http://www.instagram.com/tv/*',
|
||||
'http://www.instagr.am/tv/*',
|
||||
'https://instagram.com/tv/*',
|
||||
'https://instagr.am/tv/*',
|
||||
'https://www.instagram.com/tv/*',
|
||||
'https://www.instagr.am/tv/*',
|
||||
],
|
||||
url: 'https://api.instagram.com/oembed',
|
||||
formats: ['json'],
|
||||
}, ],
|
||||
};
|
||||
|
||||
const axios = require('axios');
|
||||
|
||||
class MetaWindow extends Component {
|
||||
class MetaWindow {
|
||||
state = {
|
||||
content: '',
|
||||
type: [],
|
||||
@ -84,11 +17,57 @@ class MetaWindow extends Component {
|
||||
embed: false,
|
||||
collections: [],
|
||||
current: null,
|
||||
target: null,
|
||||
};
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
init(target) {
|
||||
const ui = this;
|
||||
console.log(`MetaWindow: [links] init`);
|
||||
|
||||
ui.state.target = target;
|
||||
// reset collections
|
||||
ui.state.collections = {};
|
||||
|
||||
// collect new collections
|
||||
document.querySelectorAll('[data-toggle="lightbox"],[data-gallery="${gallery}"]').forEach((el) => {
|
||||
const gallery = el.getAttribute('data-gallery');
|
||||
if (gallery) {
|
||||
ui.state.collections[gallery] = [];
|
||||
document
|
||||
.querySelectorAll(
|
||||
`[data-toggle="lightbox"][data-gallery="${gallery}"]`,
|
||||
)
|
||||
.forEach((el) => {
|
||||
ui.state.collections[gallery].push(el);
|
||||
});
|
||||
}
|
||||
|
||||
// click handler
|
||||
el.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
console.log(`MetaWindow: [link] click`);
|
||||
|
||||
const el = e.currentTarget;
|
||||
const link =
|
||||
el.getAttribute('href') || el.getAttribute('data-href');
|
||||
const embed = el.getAttribute('data-embed');
|
||||
ui.state.current = el;
|
||||
|
||||
if (embed) {
|
||||
ui.embed(link);
|
||||
} else {
|
||||
ui.load(link);
|
||||
}
|
||||
|
||||
const title = el.getAttribute('data-title');
|
||||
if (title) {
|
||||
ui.setCaption(title);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
constructor(props) {
|
||||
const ui = this;
|
||||
ui.name = ui.constructor.name;
|
||||
console.log(`${ui.name}: init`);
|
||||
@ -97,12 +76,24 @@ class MetaWindow extends Component {
|
||||
W.dispatchEvent(new Event(`{ui.name}.init`));
|
||||
}
|
||||
|
||||
_currIndex = () => {
|
||||
show = () => {
|
||||
const ui = this;
|
||||
const el = ui.state.current;
|
||||
const gallery = el.getAttribute('data-gallery');
|
||||
console.log(`${ui.name}: show`);
|
||||
|
||||
return ui.state.collections[gallery].indexOf(el);
|
||||
ui.setState({
|
||||
shown: true,
|
||||
});
|
||||
W.dispatchEvent(new Event(`{ui.name}.show`));
|
||||
};
|
||||
|
||||
hide = () => {
|
||||
const ui = this;
|
||||
|
||||
console.log(`${ui.name}: hide`);
|
||||
ui.setState({
|
||||
shown: false,
|
||||
});
|
||||
W.dispatchEvent(new Event(`{ui.name}.hide`));
|
||||
};
|
||||
|
||||
next = () => {
|
||||
@ -154,40 +145,13 @@ class MetaWindow extends Component {
|
||||
});
|
||||
};
|
||||
|
||||
embed = (link) => {
|
||||
const ui = this;
|
||||
console.log(`${ui.name}: embed`);
|
||||
|
||||
ui.reset();
|
||||
ui.setState({
|
||||
embed: link,
|
||||
loading: false,
|
||||
type: ['embed', 'video'],
|
||||
});
|
||||
ui.show();
|
||||
};
|
||||
|
||||
setCaption = (title) => {
|
||||
const ui = this;
|
||||
console.log(`${ui.name}: setCaption`);
|
||||
|
||||
ui.state.caption = title;
|
||||
};
|
||||
|
||||
getCaption = () => {
|
||||
const ui = this;
|
||||
return {
|
||||
__html: ui.state.caption
|
||||
};
|
||||
}
|
||||
|
||||
load = (link) => {
|
||||
const ui = this;
|
||||
const axios = ui.axios;
|
||||
|
||||
ui.reset();
|
||||
ui.setState({
|
||||
loading: true
|
||||
loading: true,
|
||||
});
|
||||
ui.show();
|
||||
|
||||
@ -200,6 +164,7 @@ class MetaWindow extends Component {
|
||||
console.log(
|
||||
`${ui.name}: response content-type: ${resp.headers['content-type']}`,
|
||||
);
|
||||
let json = false;
|
||||
|
||||
switch (resp.headers['content-type']) {
|
||||
case 'image/jpeg':
|
||||
@ -212,10 +177,9 @@ class MetaWindow extends Component {
|
||||
// irregular types:
|
||||
case 'image/jpg':
|
||||
case 'image/svg':
|
||||
//json = JSON.parse(ui._abToString(resp.data));
|
||||
ui.setContent(
|
||||
`<img src="data:${
|
||||
resp.headers['content-type']
|
||||
};base64,${ui._imageEncode(resp.data)}" />`,
|
||||
`<img src="data:${resp.headers['content-type']};base64,${ui._imageEncode(resp.data)}" />`,
|
||||
'image',
|
||||
);
|
||||
break;
|
||||
@ -223,7 +187,6 @@ class MetaWindow extends Component {
|
||||
case 'application/ld+json':
|
||||
// irregular types:
|
||||
case 'application/json; charset=UTF-8':
|
||||
const json = JSON.parse(ui._abToString(resp.data));
|
||||
ui.setContent(`${json['Content']}`, 'text html json');
|
||||
|
||||
break;
|
||||
@ -272,28 +235,61 @@ class MetaWindow extends Component {
|
||||
}
|
||||
|
||||
ui.setState({
|
||||
error: msg
|
||||
error: msg,
|
||||
});
|
||||
|
||||
W.dispatchEvent(new Event(`{ui.name}.error`));
|
||||
})
|
||||
.then(() => {
|
||||
ui.setState({
|
||||
loading: false
|
||||
loading: false,
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
_currIndex = () => {
|
||||
const ui = this;
|
||||
const el = ui.state.current;
|
||||
const gallery = el.getAttribute('data-gallery');
|
||||
|
||||
return ui.state.collections[gallery].indexOf(el);
|
||||
};
|
||||
|
||||
embed = (link) => {
|
||||
const ui = this;
|
||||
console.log(`${ui.name}: embed`);
|
||||
|
||||
ui.reset();
|
||||
ui.setState({
|
||||
embed: link,
|
||||
loading: false,
|
||||
type: ['embed', 'video'],
|
||||
});
|
||||
ui.show();
|
||||
};
|
||||
|
||||
setCaption = (title) => {
|
||||
const ui = this;
|
||||
console.log(`${ui.name}: setCaption`);
|
||||
|
||||
ui.state.caption = title;
|
||||
};
|
||||
|
||||
getCaption = () => {
|
||||
const ui = this;
|
||||
return ui.state.caption;
|
||||
}
|
||||
|
||||
_abToString = (arrayBuffer) => {
|
||||
return String.fromCharCode.apply(null, new Uint8Array(arrayBuffer));
|
||||
};
|
||||
|
||||
_imageEncode = (arrayBuffer) => {
|
||||
let u8 = new Uint8Array(arrayBuffer);
|
||||
let b64encoded = btoa(
|
||||
const u8 = new Uint8Array(arrayBuffer);
|
||||
const b64encoded = btoa(
|
||||
[].reduce.call(
|
||||
new Uint8Array(arrayBuffer),
|
||||
function(p, c) {
|
||||
(p, c) => {
|
||||
return p + String.fromCharCode(c);
|
||||
},
|
||||
'',
|
||||
@ -314,166 +310,117 @@ class MetaWindow extends Component {
|
||||
|
||||
ui.setState({
|
||||
content: html,
|
||||
type: typeArr
|
||||
type: typeArr,
|
||||
});
|
||||
};
|
||||
|
||||
show = () => {
|
||||
const ui = this;
|
||||
console.log(`${ui.name}: show`);
|
||||
|
||||
ui.setState({
|
||||
shown: true
|
||||
});
|
||||
W.dispatchEvent(new Event(`{ui.name}.show`));
|
||||
};
|
||||
|
||||
hide = () => {
|
||||
const ui = this;
|
||||
|
||||
console.log(`${ui.name}: hide`);
|
||||
|
||||
KeyboardJS.withContext(name, () => {
|
||||
KeyboardJS.unbind('left', ui.prev);
|
||||
KeyboardJS.unbind('right', ui.next);
|
||||
});
|
||||
|
||||
KeyboardJS.setContext('index');
|
||||
|
||||
ui.setState({
|
||||
shown: false
|
||||
});
|
||||
W.dispatchEvent(new Event(`{ui.name}.hide`));
|
||||
};
|
||||
|
||||
getHtml = () => {
|
||||
const ui = this;
|
||||
return {
|
||||
__html: ui.state.content
|
||||
};
|
||||
return ui.state.content;
|
||||
};
|
||||
|
||||
|
||||
onSwipeMove(position, event) {
|
||||
const ui = this.ui;
|
||||
const x = position.x;
|
||||
|
||||
if (ui.locked || Math.abs(x) < 50) {
|
||||
return;
|
||||
}
|
||||
|
||||
ui.locked = true;
|
||||
setTimeout(() => {
|
||||
ui.locked = false;
|
||||
}, 1000);
|
||||
|
||||
if (x > 0) {
|
||||
console.log(`${ui.name}: swipe right`);
|
||||
ui.prev();
|
||||
} else {
|
||||
console.log(`${ui.name}: swipe left`);
|
||||
ui.next();
|
||||
}
|
||||
setState(newState) {
|
||||
const ui = this;
|
||||
ui.state = Object.assign({}, ui.state, newState);
|
||||
ui.render();
|
||||
}
|
||||
|
||||
|
||||
render() {
|
||||
const ui = this;
|
||||
const name = ui.name;
|
||||
|
||||
let navs = null;
|
||||
const navs = null;
|
||||
const el = ui.state.current;
|
||||
KeyboardJS.setContext(name);
|
||||
KeyboardJS.withContext(name, () => {
|
||||
KeyboardJS.unbind('left', ui.prev);
|
||||
KeyboardJS.unbind('right', ui.next);
|
||||
|
||||
ui.state.target.innerHTML = '';
|
||||
const meta = document.createElement('div');
|
||||
meta.classList.add(`meta-${name}`, `meta-${name}__${ui.state.type.join(` meta-${name}__`)}`);
|
||||
ui.state.target.append(meta);
|
||||
|
||||
const metaOverlay = document.createElement('div');
|
||||
metaOverlay.classList.add(`meta-${name}-overlay`);
|
||||
if (ui.state.shown) {
|
||||
metaOverlay.classList.add(`meta-${name}-overlay__open`);
|
||||
}
|
||||
if (ui.state.loading) {
|
||||
metaOverlay.classList.add(`meta-${name}-overlay__loading`);
|
||||
}
|
||||
if (ui.state.error) {
|
||||
metaOverlay.classList.add(`meta-${name}-overlay__error`);
|
||||
}
|
||||
meta.append(metaOverlay);
|
||||
|
||||
const metaContent = document.createElement('div');
|
||||
metaContent.classList.add('meta-content');
|
||||
metaOverlay.append(metaContent);
|
||||
|
||||
const btnClose = document.createElement('button');
|
||||
btnClose.classList.add('meta-nav', 'meta-close', 'a');
|
||||
btnClose.innerHTML =
|
||||
'<i class="icon fa fas fa-times"></i>' +
|
||||
' <span class="visually-hidden">Close</span>';
|
||||
btnClose.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
ui.hide();
|
||||
});
|
||||
metaContent.append(btnClose);
|
||||
|
||||
if (el) {
|
||||
const gallery = el.getAttribute('data-gallery');
|
||||
if (gallery && ui.state.collections[gallery].length > 1) {
|
||||
navs = (
|
||||
<nav className="meta-navs">
|
||||
<button
|
||||
className="meta-nav meta-nav-arrow meta-nav-arrow__prev a"
|
||||
onClick={ui.prev}
|
||||
>
|
||||
<i className="fa fas fa-chevron-left"></i>
|
||||
<span className="sr-only">Previous</span>
|
||||
</button>
|
||||
<button
|
||||
className="meta-nav meta-nav-arrow meta-nav-arrow__next a"
|
||||
onClick={ui.next}
|
||||
>
|
||||
<i className="fa fas fa-chevron-right"></i>
|
||||
<span className="sr-only">Next</span>
|
||||
</button>
|
||||
</nav>
|
||||
);
|
||||
const navs = document.createElement('nav');
|
||||
navs.classList.add('meta-navs');
|
||||
|
||||
KeyboardJS.withContext(name, () => {
|
||||
KeyboardJS.bind('left', ui.prev);
|
||||
KeyboardJS.bind('right', ui.next);
|
||||
const prevBtn = document.createElement('button');
|
||||
prevBtn.classList.add('meta-nav', 'meta-nav-arrow', 'meta-nav-arrow__prev', 'a');
|
||||
prevBtn.innerHTML = '<i class="icon fa fas fa-chevron-left"></i>' +
|
||||
' <span class="visually-hidden">Previous</span>';
|
||||
prevBtn.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
ui.prev();
|
||||
});
|
||||
navs.append(prevBtn);
|
||||
|
||||
const nextBtn = document.createElement('button');
|
||||
nextBtn.classList.add('meta-nav', 'meta-nav-arrow', 'meta-nav-arrow__prev', 'a');
|
||||
nextBtn.innerHTML = '<i class="icon fa fas fa-chevron-right"></i>' +
|
||||
' <span class="visually-hidden">Next</span>';
|
||||
nextBtn.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
ui.next();
|
||||
});
|
||||
navs.append(nextBtn);
|
||||
|
||||
metaContent.append(navs);
|
||||
}
|
||||
}
|
||||
|
||||
const content = ui.state.embed ? (
|
||||
<section className="meta-wrap typography">
|
||||
<Embed
|
||||
url={ui.state.embed}
|
||||
providers={[...defaultProviders, InstagramProvider]}
|
||||
LoadingFallbackElement=<div className="meta-spinner_embed">
|
||||
... Loading ...
|
||||
</div>
|
||||
/>
|
||||
</section>
|
||||
) : (
|
||||
<section
|
||||
className="meta-wrap typography"
|
||||
dangerouslySetInnerHTML={ui.getHtml()}
|
||||
></section>
|
||||
);
|
||||
let content = '';
|
||||
if (ui.state.embed) {
|
||||
content = '<section class="meta-wrap typography">' +
|
||||
'<Embed url={ui.state.embed} providers={[...defaultProviders, InstagramProvider]}' +
|
||||
' LoadingFallbackElement=<div className="meta-spinner_embed"> ... Loading ... </div>' +
|
||||
'</section>';
|
||||
} else {
|
||||
const content = document.createElement('section');
|
||||
content.classList.add('meta-wrap', 'typography');
|
||||
content.innerHTML = ui.getHtml();
|
||||
metaContent.append(content);
|
||||
}
|
||||
|
||||
const className = `meta-${name} meta-${name}__${ui.state.type.join(
|
||||
` meta-${name}__`,
|
||||
)}`;
|
||||
if (ui.state.error) {
|
||||
const error = document.createElement('div');
|
||||
error.classList.add('meta-error');
|
||||
error.innerHTML = ui.state.error;
|
||||
metaContent.append(error);
|
||||
} else if (ui.state.caption) {
|
||||
const caption = document.createElement('div');
|
||||
caption.classList.add('meta-caption');
|
||||
caption.innerHTML = ui.getCaption();
|
||||
metaContent.append(caption);
|
||||
}
|
||||
|
||||
const overlayClassName = `meta-${name}-overlay${
|
||||
ui.state.shown ? ` meta-${name}-overlay__open` : ''
|
||||
}${ui.state.loading ? ` meta-${name}-overlay__loading` : ''}${
|
||||
ui.state.error ? ` meta-${name}-overlay__error` : ''
|
||||
}`;
|
||||
|
||||
const caption = ui.state.caption ?
|
||||
<div className="meta-caption" dangerouslySetInnerHTML={ui.getCaption()}></div> :
|
||||
'';
|
||||
|
||||
return (
|
||||
<Swipe className={className} ui={ui} onSwipeMove={ui.onSwipeMove}>
|
||||
<div className={overlayClassName}>
|
||||
<article className="meta-content">
|
||||
{navs}
|
||||
<button
|
||||
className="meta-nav meta-close a"
|
||||
onClick={ui.hide}
|
||||
>
|
||||
<i className="fa fas fa-times"></i>
|
||||
<span className="sr-only">Close</span>
|
||||
</button>
|
||||
|
||||
<div className="meta-spinner">... Loading ...</div>
|
||||
<div className="meta-error alert alert-danger">
|
||||
{ui.state.error}
|
||||
</div>
|
||||
|
||||
{content}
|
||||
|
||||
{caption}
|
||||
</article>
|
||||
</div>
|
||||
</Swipe>
|
||||
);
|
||||
return ui;
|
||||
}
|
||||
}
|
||||
|
||||
@ -5,69 +5,28 @@
|
||||
*/
|
||||
|
||||
import Events from './_events';
|
||||
import MetaWindow from './_window';
|
||||
|
||||
import React from 'react';
|
||||
import ReactDOM from 'react-dom';
|
||||
import MetaWindow from './_window.jsx';
|
||||
const ui = new MetaWindow();
|
||||
const container = document.getElementById('MetaLightboxApp');
|
||||
if (!container) {
|
||||
console.log(`MetaWindow: missing container`);
|
||||
}
|
||||
|
||||
const AppUI = ((W) => {
|
||||
const MetaLightbox = ReactDOM.render(
|
||||
<MetaWindow />,
|
||||
document.getElementById('MetaLightboxApp'),
|
||||
);
|
||||
const init = () => {
|
||||
ui.init(container);
|
||||
};
|
||||
|
||||
const initMetaWindowLinks = () => {
|
||||
const ui = MetaLightbox;
|
||||
console.log(`MetaWindow: [links] init`);
|
||||
window.addEventListener(`${Events.LOADED}`, init);
|
||||
window.addEventListener(`${Events.AJAX}`, init);
|
||||
window.addEventListener(`MetaWindow.initLinks`, init);
|
||||
|
||||
document.querySelectorAll('[data-toggle="lightbox"],[data-gallery="${gallery}"]').forEach((el) => {
|
||||
// collections
|
||||
const gallery = el.getAttribute('data-gallery');
|
||||
if (gallery) {
|
||||
ui.state.collections[gallery] = [];
|
||||
document
|
||||
.querySelectorAll(
|
||||
`[data-toggle="lightbox"][data-gallery="${gallery}"]`,
|
||||
)
|
||||
.forEach((el) => {
|
||||
ui.state.collections[gallery].push(el);
|
||||
});
|
||||
}
|
||||
function importAll(r) {
|
||||
return r.keys().map(r);
|
||||
}
|
||||
|
||||
// click handler
|
||||
el.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
console.log(`MetaWindow: [link] click`);
|
||||
const images = importAll(
|
||||
require.context('../img/', false, /\.(png|jpe?g|svg)$/),
|
||||
);
|
||||
|
||||
const el = e.currentTarget;
|
||||
const link =
|
||||
el.getAttribute('href') || el.getAttribute('data-href');
|
||||
const embed = el.getAttribute('data-embed');
|
||||
ui.state.current = el;
|
||||
|
||||
if (embed) {
|
||||
ui.embed(link);
|
||||
} else {
|
||||
ui.load(link);
|
||||
}
|
||||
|
||||
const title = el.getAttribute('data-title');
|
||||
if (title) {
|
||||
ui.setCaption(title);
|
||||
}
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
W.addEventListener(`${Events.LOADED}`, initMetaWindowLinks);
|
||||
W.addEventListener(`${Events.AJAX}`, initMetaWindowLinks);
|
||||
W.addEventListener(`MetaWindow.initLinks`, initMetaWindowLinks);
|
||||
|
||||
return MetaLightbox;
|
||||
})(window);
|
||||
|
||||
export default AppUI;
|
||||
|
||||
// display custom HTML content manually using JS
|
||||
//M.setContent('<b>ZZZZZZZZZAAAA11<a href="/">BBBB</a>122</b>');
|
||||
//M.show();
|
||||
export default ui;
|
||||
|
||||
@ -2,13 +2,42 @@
|
||||
* Common Environment
|
||||
*/
|
||||
|
||||
const webpack = require('webpack');
|
||||
const commonVariables = require('./webpack.configuration');
|
||||
const conf = commonVariables.configuration;
|
||||
const YML_PATH = './webpack.yml';
|
||||
const CONF_VAR = 'App\\Templates\\WebpackTemplateProvider';
|
||||
|
||||
const path = require('path');
|
||||
const filesystem = require('fs');
|
||||
const fs = require('fs');
|
||||
const yaml = require('js-yaml');
|
||||
const webpack = require('webpack');
|
||||
|
||||
/*
|
||||
* Load webpack configuration from webpack.yml
|
||||
*/
|
||||
|
||||
const yml = yaml.load(
|
||||
fs.readFileSync(path.join(__dirname, YML_PATH), 'utf8'),
|
||||
);
|
||||
const conf = yml[CONF_VAR]
|
||||
|
||||
let themes = [];
|
||||
// add themes
|
||||
if (conf.THEMESDIR) {
|
||||
const themeDir = conf.THEMESDIR;
|
||||
const dir = path.resolve(__dirname, themeDir);
|
||||
|
||||
if (fs.existsSync(dir)) {
|
||||
fs.readdirSync(dir).forEach((file) => {
|
||||
filePath = path.join(themeDir, file);
|
||||
const stat = fs.statSync(filePath);
|
||||
|
||||
if (stat && stat.isDirectory()) {
|
||||
themes.push(filePath);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/* Setup Entries */
|
||||
const includes = {};
|
||||
const modules = [
|
||||
path.resolve(__dirname, conf.APPDIR, conf.SRC),
|
||||
@ -28,10 +57,10 @@ const _addAppFiles = (theme) => {
|
||||
themeName = 'app';
|
||||
}
|
||||
|
||||
if (filesystem.existsSync(path.join(dirPath, conf.SRC, 'js', '_index.js'))) {
|
||||
includes[`${themeName}`] = path.join(dirPath, conf.SRC, 'js', '_index.js');
|
||||
if (fs.existsSync(path.join(dirPath, conf.SRC, 'js', 'app.js'))) {
|
||||
includes[`${themeName}`] = path.join(dirPath, conf.SRC, 'js', 'app.js');
|
||||
} else if (
|
||||
filesystem.existsSync(path.join(dirPath, conf.SRC, 'scss', 'app.scss'))
|
||||
fs.existsSync(path.join(dirPath, conf.SRC, 'scss', 'app.scss'))
|
||||
) {
|
||||
includes[`${themeName}`] = path.join(
|
||||
dirPath,
|
||||
@ -50,13 +79,13 @@ const _addAppFiles = (theme) => {
|
||||
const dirPath = path.resolve(__dirname, dir);
|
||||
let results = [];
|
||||
|
||||
filesystem.readdirSync(dirPath).forEach((file) => {
|
||||
fs.readdirSync(dirPath).forEach((file) => {
|
||||
if (file.charAt(0) === '_') {
|
||||
return;
|
||||
}
|
||||
|
||||
const filePath = path.join(dirPath, file);
|
||||
const stat = filesystem.statSync(filePath);
|
||||
const stat = fs.statSync(filePath);
|
||||
|
||||
if (stat && stat.isDirectory() && includeSubFolders) {
|
||||
results = results.concat(
|
||||
@ -72,7 +101,7 @@ const _addAppFiles = (theme) => {
|
||||
|
||||
// add page specific scripts
|
||||
const typesJSPath = path.join(theme, conf.TYPESJS);
|
||||
if (filesystem.existsSync(typesJSPath)) {
|
||||
if (fs.existsSync(typesJSPath)) {
|
||||
const pageScripts = _getAllFilesFromFolder(typesJSPath, true);
|
||||
pageScripts.forEach((file) => {
|
||||
includes[`${themeName}_${path.basename(file, '.js')}`] = file;
|
||||
@ -81,7 +110,7 @@ const _addAppFiles = (theme) => {
|
||||
|
||||
// add page specific scss
|
||||
const typesSCSSPath = path.join(theme, conf.TYPESSCSS);
|
||||
if (filesystem.existsSync(typesSCSSPath)) {
|
||||
if (fs.existsSync(typesSCSSPath)) {
|
||||
const scssIncludes = _getAllFilesFromFolder(typesSCSSPath, true);
|
||||
scssIncludes.forEach((file) => {
|
||||
includes[`${themeName}_${path.basename(file, '.scss')}`] = file;
|
||||
@ -91,28 +120,44 @@ const _addAppFiles = (theme) => {
|
||||
|
||||
_addAppFiles(conf.APPDIR);
|
||||
|
||||
// remove some backend includes
|
||||
delete includes['app_editor'];
|
||||
delete includes['app_cms'];
|
||||
delete includes['app_order'];
|
||||
|
||||
// add themes
|
||||
commonVariables.themes.forEach((theme) => {
|
||||
themes.forEach((theme) => {
|
||||
_addAppFiles(theme);
|
||||
});
|
||||
|
||||
module.exports = {
|
||||
entry: includes,
|
||||
externals: {
|
||||
jquery: 'jQuery',
|
||||
react: 'React',
|
||||
'react-dom': 'ReactDOM',
|
||||
},
|
||||
resolve: {
|
||||
modules: modules,
|
||||
alias: {
|
||||
'window.jQuery': require.resolve('jquery'),
|
||||
$: require.resolve('jquery'),
|
||||
jquery: require.resolve('jquery'),
|
||||
jQuery: require.resolve('jquery'),
|
||||
react: require.resolve('react'),
|
||||
'react-dom': require.resolve('react-dom'),
|
||||
configuration: conf,
|
||||
themes: themes,
|
||||
webpack: {
|
||||
entry: includes,
|
||||
externals: {
|
||||
// comment out jQuery if you don't use it to prevent bootstrap thinking that there's jQuery present
|
||||
//jquery: 'jQuery',
|
||||
react: 'React',
|
||||
'react-dom': 'ReactDOM',
|
||||
},
|
||||
fallback: { path: false },
|
||||
},
|
||||
resolve: {
|
||||
modules: modules,
|
||||
alias: {
|
||||
// comment out jQuery if you don't use it to prevent bootstrap thinking that there's jQuery present
|
||||
/*'window.jQuery': require.resolve('jquery'),
|
||||
$: require.resolve('jquery'),
|
||||
jquery: require.resolve('jquery'),
|
||||
jQuery: require.resolve('jquery'),*/
|
||||
react: require.resolve('react'),
|
||||
'react-dom': require.resolve('react-dom'),
|
||||
},
|
||||
fallback: {
|
||||
path: false
|
||||
},
|
||||
},
|
||||
experiments: {
|
||||
topLevelAwait: true,
|
||||
},
|
||||
}
|
||||
};
|
||||
|
||||
@ -1,393 +1,397 @@
|
||||
/*
|
||||
* Production assets generation
|
||||
*/
|
||||
const webpack = require('webpack');
|
||||
const commonVariables = require('./webpack.configuration');
|
||||
const conf = commonVariables.configuration;
|
||||
const { merge } = require('webpack-merge');
|
||||
const common = require('./webpack.config.common.js');
|
||||
const conf = common.configuration;
|
||||
|
||||
const filesystem = require('fs');
|
||||
const webpack = require('webpack');
|
||||
const {
|
||||
merge
|
||||
} = require('webpack-merge');
|
||||
|
||||
|
||||
const fs = require('fs');
|
||||
const path = require('path');
|
||||
|
||||
const FaviconsWebpackPlugin = require('favicons-webpack-plugin');
|
||||
|
||||
const TerserPlugin = require('terser-webpack-plugin');
|
||||
const OptimizeCssAssetsPlugin = require('optimize-css-assets-webpack-plugin');
|
||||
const CssMinimizerPlugin = require('css-minimizer-webpack-plugin');
|
||||
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
|
||||
|
||||
const ImageminPlugin = require('image-minimizer-webpack-plugin');
|
||||
const ImageSpritePlugin = require('@a2nt/image-sprite-webpack-plugin');
|
||||
//const ImageSpritePlugin = require('@a2nt/image-sprite-webpack-plugin');
|
||||
const HtmlWebpackPlugin = require('html-webpack-plugin');
|
||||
|
||||
const UIInfo = require('./package.json');
|
||||
const UIVERSION = JSON.stringify(UIInfo.version);
|
||||
const UIMetaInfo = require('./package.json');
|
||||
|
||||
const NODE_ENV = conf.NODE_ENV || process.env.NODE_ENV;
|
||||
const COMPRESS = NODE_ENV === 'production' ? true : false;
|
||||
|
||||
const IP = process.env.IP || conf.HOSTNAME;
|
||||
const PORT = process.env.PORT || conf.PORT;
|
||||
|
||||
console.log('NODE_ENV: ' + NODE_ENV);
|
||||
console.log('COMPRESS: ' + COMPRESS);
|
||||
console.log('WebP images: ' + conf['webp']);
|
||||
console.log('GRAPHQL_API_KEY: ' + conf['GRAPHQL_API_KEY']);
|
||||
|
||||
let plugins = [
|
||||
new webpack.ProvidePlugin({
|
||||
$: 'jquery',
|
||||
jQuery: 'jquery',
|
||||
react: 'React',
|
||||
'react-dom': 'ReactDOM',
|
||||
Popper: ['popper.js', 'default'],
|
||||
Util: 'exports-loader?Util!bootstrap/js/dist/util',
|
||||
Alert: 'exports-loader?Alert!bootstrap/js/dist/alert',
|
||||
Button: 'exports-loader?Button!bootstrap/js/dist/button',
|
||||
Carousel: 'exports-loader?Carousel!bootstrap/js/dist/carousel',
|
||||
Collapse: 'exports-loader?Collapse!bootstrap/js/dist/collapse',
|
||||
Dropdown: 'exports-loader?Dropdown!bootstrap/js/dist/dropdown',
|
||||
Modal: 'exports-loader?Modal!bootstrap/js/dist/modal',
|
||||
Tooltip: 'exports-loader?Tooltip!bootstrap/js/dist/tooltip',
|
||||
Popover: 'exports-loader?Popover!bootstrap/js/dist/popover',
|
||||
Scrollspy: 'exports-loader?Scrollspy!bootstrap/js/dist/scrollspy',
|
||||
Tab: 'exports-loader?Tab!bootstrap/js/dist/tab',
|
||||
}),
|
||||
new webpack.DefinePlugin({
|
||||
'process.env': {
|
||||
NODE_ENV: JSON.stringify(NODE_ENV),
|
||||
},
|
||||
UINAME: JSON.stringify(UIInfo.name),
|
||||
UIVERSION: UIVERSION,
|
||||
UIAUTHOR: JSON.stringify(UIInfo.author),
|
||||
}),
|
||||
new webpack.LoaderOptionsPlugin({
|
||||
minimize: COMPRESS,
|
||||
debug: !COMPRESS,
|
||||
}),
|
||||
new MiniCssExtractPlugin({
|
||||
filename: 'css/[name].css',
|
||||
//allChunks: true,
|
||||
}),
|
||||
new webpack.ProvidePlugin({
|
||||
react: 'React',
|
||||
'react-dom': 'ReactDOM',
|
||||
/*$: 'jquery',
|
||||
jQuery: 'jquery',
|
||||
Popper: ['popper.js', 'default'],
|
||||
Util: 'exports-loader?Util!bootstrap/js/dist/util',
|
||||
Alert: 'exports-loader?Alert!bootstrap/js/dist/alert',
|
||||
Button: 'exports-loader?Button!bootstrap/js/dist/button',
|
||||
Carousel: 'exports-loader?Carousel!bootstrap/js/dist/carousel',
|
||||
Collapse: 'exports-loader?Collapse!bootstrap/js/dist/collapse',
|
||||
Dropdown: 'exports-loader?Dropdown!bootstrap/js/dist/dropdown',
|
||||
Modal: 'exports-loader?Modal!bootstrap/js/dist/modal',
|
||||
Tooltip: 'exports-loader?Tooltip!bootstrap/js/dist/tooltip',
|
||||
Popover: 'exports-loader?Popover!bootstrap/js/dist/popover',
|
||||
Scrollspy: 'exports-loader?Scrollspy!bootstrap/js/dist/scrollspy',
|
||||
Tab: 'exports-loader?Tab!bootstrap/js/dist/tab',*/
|
||||
}),
|
||||
new webpack.DefinePlugin({
|
||||
'process.env': {
|
||||
NODE_ENV: JSON.stringify(NODE_ENV),
|
||||
},
|
||||
UINAME: JSON.stringify(UIInfo.name),
|
||||
UIVERSION: UIVERSION,
|
||||
UIAUTHOR: JSON.stringify(UIInfo.author),
|
||||
UIMetaNAME: JSON.stringify(UIMetaInfo.name),
|
||||
UIMetaVersion: JSON.stringify(UIMetaInfo.version),
|
||||
GRAPHQL_API_KEY: JSON.stringify(conf['GRAPHQL_API_KEY']),
|
||||
SWVERSION: JSON.stringify(`sw-${new Date().getTime()}`),
|
||||
BASE_HREF: JSON.stringify(''),
|
||||
}),
|
||||
new webpack.LoaderOptionsPlugin({
|
||||
minimize: COMPRESS,
|
||||
debug: !COMPRESS,
|
||||
}),
|
||||
new MiniCssExtractPlugin({
|
||||
filename: 'css/[name].css',
|
||||
//allChunks: true,
|
||||
}),
|
||||
];
|
||||
|
||||
if (COMPRESS) {
|
||||
plugins.push(
|
||||
new OptimizeCssAssetsPlugin({
|
||||
//assetNameRegExp: /\.optimize\.css$/g,
|
||||
cssProcessor: require('cssnano'),
|
||||
cssProcessorPluginOptions: {
|
||||
preset: ['default'],
|
||||
},
|
||||
cssProcessorOptions: {
|
||||
zindex: true,
|
||||
cssDeclarationSorter: true,
|
||||
reduceIdents: false,
|
||||
mergeIdents: true,
|
||||
mergeRules: true,
|
||||
mergeLonghand: true,
|
||||
discardUnused: true,
|
||||
discardOverridden: true,
|
||||
discardDuplicates: true,
|
||||
discardComments: {
|
||||
removeAll: true,
|
||||
},
|
||||
},
|
||||
canPrint: true,
|
||||
}),
|
||||
);
|
||||
plugins.push(require('autoprefixer'));
|
||||
plugins.push(
|
||||
new ImageminPlugin({
|
||||
minimizerOptions: {
|
||||
// Lossless optimization with custom option
|
||||
// Feel free to experiment with options for better result for you
|
||||
plugins: [
|
||||
['gifsicle', { interlaced: true }],
|
||||
['jpegtran', { progressive: true }],
|
||||
['optipng', { optimizationLevel: 5 }],
|
||||
[
|
||||
'svgo',
|
||||
{
|
||||
plugins: [
|
||||
{
|
||||
removeViewBox: false,
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
],
|
||||
},
|
||||
}),
|
||||
);
|
||||
plugins.push(require('autoprefixer'));
|
||||
|
||||
plugins.push(
|
||||
new ImageSpritePlugin({
|
||||
exclude: /exclude|original|default-|icons|sprite|svg|logo|favicon/,
|
||||
commentOrigin: false,
|
||||
compress: COMPRESS,
|
||||
extensions: ['png'],
|
||||
indent: '',
|
||||
log: true,
|
||||
//outputPath: path.join(__dirname, conf.APPDIR, conf.DIST),
|
||||
outputFilename: 'img/sprite-[hash].png',
|
||||
padding: 0,
|
||||
}),
|
||||
);
|
||||
/*plugins.push(
|
||||
new ImageSpritePlugin({
|
||||
exclude: /exclude|original|default-|icons|sprite|svg|logo|favicon/,
|
||||
commentOrigin: false,
|
||||
compress: COMPRESS,
|
||||
extensions: ['png'],
|
||||
indent: '',
|
||||
log: true,
|
||||
//outputPath: path.join(__dirname, conf.APPDIR, conf.DIST),
|
||||
outputFilename: 'img/sprite-[hash].png',
|
||||
padding: 0,
|
||||
}),
|
||||
);*/
|
||||
}
|
||||
|
||||
const indexPath = path.join(__dirname, conf.APPDIR, conf.SRC, 'index.html');
|
||||
if (filesystem.existsSync(indexPath)) {
|
||||
plugins.push(
|
||||
new HtmlWebpackPlugin({
|
||||
publicPath: '',
|
||||
template: path.join(conf.APPDIR, conf.SRC, 'index.html'),
|
||||
templateParameters: {
|
||||
NODE_ENV: NODE_ENV,
|
||||
REACT_SCRIPTS:
|
||||
NODE_ENV === 'production'
|
||||
? '<script crossorigin src="https://unpkg.com/react@17/umd/react.production.min.js"></script><script crossorigin src="https://unpkg.com/react-dom@17/umd/react-dom.production.min.js"></script>'
|
||||
: '<script crossorigin src="https://unpkg.com/react@17/umd/react.development.js"></script><script crossorigin src="https://unpkg.com/react-dom@17/umd/react-dom.development.js"></script>',
|
||||
},
|
||||
}),
|
||||
);
|
||||
if (fs.existsSync(indexPath)) {
|
||||
plugins.push(
|
||||
new HtmlWebpackPlugin({
|
||||
publicPath: '',
|
||||
template: path.join(conf.APPDIR, conf.SRC, 'index.html'),
|
||||
templateParameters: {
|
||||
NODE_ENV: NODE_ENV,
|
||||
GRAPHQL_URL: conf['GRAPHQL_URL'],
|
||||
STATIC_URL: conf['STATIC_URL'],
|
||||
REACT_SCRIPTS: NODE_ENV === 'production' ?
|
||||
'<script crossorigin src="https://unpkg.com/react@17/umd/react.production.min.js"></script><script crossorigin src="https://unpkg.com/react-dom@17/umd/react-dom.production.min.js"></script>' : '<script crossorigin src="https://unpkg.com/react@17/umd/react.development.js"></script><script crossorigin src="https://unpkg.com/react-dom@17/umd/react-dom.development.js"></script>',
|
||||
},
|
||||
xhtml: true,
|
||||
}),
|
||||
);
|
||||
}
|
||||
|
||||
const faviconPath = path.join(__dirname, conf.APPDIR, conf.SRC, 'favicon.png');
|
||||
if (filesystem.existsSync(faviconPath)) {
|
||||
plugins.push(
|
||||
new FaviconsWebpackPlugin({
|
||||
title: 'Webpack App',
|
||||
logo: faviconPath,
|
||||
prefix: '/icons/',
|
||||
emitStats: false,
|
||||
persistentCache: true,
|
||||
inject: false,
|
||||
statsFilename: path.join(
|
||||
conf.APPDIR,
|
||||
conf.DIST,
|
||||
'icons',
|
||||
'iconstats.json',
|
||||
),
|
||||
icons: {
|
||||
android: true,
|
||||
appleIcon: true,
|
||||
appleStartup: true,
|
||||
coast: true,
|
||||
favicons: true,
|
||||
firefox: true,
|
||||
opengraph: true,
|
||||
twitter: true,
|
||||
yandex: true,
|
||||
windows: true,
|
||||
},
|
||||
}),
|
||||
);
|
||||
if (fs.existsSync(faviconPath)) {
|
||||
plugins.push(
|
||||
new FaviconsWebpackPlugin({
|
||||
title: 'Webpack App',
|
||||
logo: faviconPath,
|
||||
prefix: '/icons/',
|
||||
emitStats: false,
|
||||
persistentCache: true,
|
||||
inject: false,
|
||||
statsFilename: path.join(
|
||||
conf.APPDIR,
|
||||
conf.DIST,
|
||||
'icons',
|
||||
'iconstats.json',
|
||||
),
|
||||
icons: {
|
||||
android: true,
|
||||
appleIcon: true,
|
||||
appleStartup: true,
|
||||
coast: true,
|
||||
favicons: true,
|
||||
firefox: true,
|
||||
opengraph: true,
|
||||
twitter: true,
|
||||
yandex: true,
|
||||
windows: true,
|
||||
},
|
||||
}),
|
||||
);
|
||||
}
|
||||
|
||||
// add themes favicons
|
||||
commonVariables.themes.forEach((theme) => {
|
||||
const faviconPath = path.join(__dirname, theme, conf.SRC, 'favicon.png');
|
||||
if (filesystem.existsSync(faviconPath)) {
|
||||
plugins.push(
|
||||
new FaviconsWebpackPlugin({
|
||||
title: 'Webpack App',
|
||||
logo: faviconPath,
|
||||
prefix: '/' + theme + '-icons/',
|
||||
emitStats: false,
|
||||
persistentCache: true,
|
||||
inject: false,
|
||||
statsFilename: path.join(
|
||||
conf.APPDIR,
|
||||
conf.DIST,
|
||||
theme + '-icons',
|
||||
'iconstats.json',
|
||||
),
|
||||
icons: {
|
||||
android: true,
|
||||
appleIcon: true,
|
||||
appleStartup: true,
|
||||
coast: true,
|
||||
favicons: true,
|
||||
firefox: true,
|
||||
opengraph: true,
|
||||
twitter: true,
|
||||
yandex: true,
|
||||
windows: true,
|
||||
},
|
||||
}),
|
||||
);
|
||||
}
|
||||
common.themes.forEach((theme) => {
|
||||
const faviconPath = path.join(__dirname, theme, conf.SRC, 'favicon.png');
|
||||
if (fs.existsSync(faviconPath)) {
|
||||
plugins.push(
|
||||
new FaviconsWebpackPlugin({
|
||||
title: 'Webpack App',
|
||||
logo: faviconPath,
|
||||
prefix: '/' + theme + '-icons/',
|
||||
emitStats: false,
|
||||
persistentCache: true,
|
||||
inject: false,
|
||||
statsFilename: path.join(
|
||||
conf.APPDIR,
|
||||
conf.DIST,
|
||||
theme + '-icons',
|
||||
'iconstats.json',
|
||||
),
|
||||
icons: {
|
||||
android: true,
|
||||
appleIcon: true,
|
||||
appleStartup: true,
|
||||
coast: true,
|
||||
favicons: true,
|
||||
firefox: true,
|
||||
opengraph: true,
|
||||
twitter: true,
|
||||
yandex: true,
|
||||
windows: true,
|
||||
},
|
||||
}),
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer')
|
||||
.BundleAnalyzerPlugin;
|
||||
.BundleAnalyzerPlugin;
|
||||
plugins.push(
|
||||
new BundleAnalyzerPlugin({
|
||||
analyzerMode: 'static',
|
||||
openAnalyzer: false,
|
||||
}),
|
||||
new BundleAnalyzerPlugin({
|
||||
analyzerMode: 'static',
|
||||
openAnalyzer: false,
|
||||
}),
|
||||
);
|
||||
|
||||
const cfg = merge(common, {
|
||||
mode: NODE_ENV,
|
||||
cache: {
|
||||
type: 'filesystem',
|
||||
},
|
||||
recordsPath: path.join(__dirname, conf.APPDIR, conf.DIST, 'records.json'),
|
||||
optimization: {
|
||||
//removeAvailableModules: false,
|
||||
//realContentHash: false,
|
||||
splitChunks: {
|
||||
name: 'vendor',
|
||||
minChunks: 2,
|
||||
},
|
||||
concatenateModules: true, //ModuleConcatenationPlugin
|
||||
minimizer: [
|
||||
new TerserPlugin({
|
||||
terserOptions: {
|
||||
module: false,
|
||||
parse: {
|
||||
// we want terser to parse ecma 8 code. However, we don't want it
|
||||
// to apply any minfication steps that turns valid ecma 5 code
|
||||
// into invalid ecma 5 code. This is why the 'compress' and 'output'
|
||||
// sections only apply transformations that are ecma 5 safe
|
||||
// https://github.com/facebook/create-react-app/pull/4234
|
||||
ecma: 8,
|
||||
},
|
||||
compress: {
|
||||
ecma: 5,
|
||||
warnings: false,
|
||||
// Disabled because of an issue with Uglify breaking seemingly valid code:
|
||||
// https://github.com/facebook/create-react-app/issues/2376
|
||||
// Pending further investigation:
|
||||
// https://github.com/mishoo/UglifyJS2/issues/2011
|
||||
comparisons: false,
|
||||
},
|
||||
keep_fnames: true,
|
||||
keep_classnames: true,
|
||||
const cfg = merge(common.webpack, {
|
||||
mode: NODE_ENV,
|
||||
cache: {
|
||||
type: 'filesystem',
|
||||
},
|
||||
recordsPath: path.join(__dirname, conf.APPDIR, conf.DIST, 'records.json'),
|
||||
optimization: {
|
||||
//removeAvailableModules: false,
|
||||
//realContentHash: false,
|
||||
splitChunks: {
|
||||
name: 'vendor',
|
||||
minChunks: 2,
|
||||
},
|
||||
concatenateModules: true, //ModuleConcatenationPlugin
|
||||
minimizer: [
|
||||
new TerserPlugin({
|
||||
terserOptions: {
|
||||
module: false,
|
||||
parse: {
|
||||
// we want terser to parse ecma 8 code. However, we don't want it
|
||||
// to apply any minfication steps that turns valid ecma 5 code
|
||||
// into invalid ecma 5 code. This is why the 'compress' and 'output'
|
||||
// sections only apply transformations that are ecma 5 safe
|
||||
// https://github.com/facebook/create-react-app/pull/4234
|
||||
ecma: 8,
|
||||
},
|
||||
compress: {
|
||||
ecma: 5,
|
||||
warnings: false,
|
||||
// Disabled because of an issue with Uglify breaking seemingly valid code:
|
||||
// https://github.com/facebook/create-react-app/issues/2376
|
||||
// Pending further investigation:
|
||||
// https://github.com/mishoo/UglifyJS2/issues/2011
|
||||
comparisons: false,
|
||||
},
|
||||
keep_fnames: true,
|
||||
keep_classnames: true,
|
||||
|
||||
mangle: {
|
||||
safari10: true,
|
||||
keep_fnames: true,
|
||||
keep_classnames: true,
|
||||
reserved: ['$', 'jQuery', 'jquery'],
|
||||
},
|
||||
output: {
|
||||
ecma: 5,
|
||||
comments: false,
|
||||
// Turned on because emoji and regex is not minified properly using default
|
||||
// https://github.com/facebook/create-react-app/issues/2488
|
||||
ascii_only: true,
|
||||
},
|
||||
},
|
||||
// Use multi-process parallel running to improve the build speed
|
||||
// Default number of concurrent runs: os.cpus().length - 1
|
||||
parallel: true,
|
||||
}),
|
||||
],
|
||||
},
|
||||
mangle: {
|
||||
safari10: true,
|
||||
keep_fnames: true,
|
||||
keep_classnames: true,
|
||||
reserved: ['$', 'jQuery', 'jquery'],
|
||||
},
|
||||
output: {
|
||||
ecma: 5,
|
||||
comments: false,
|
||||
// Turned on because emoji and regex is not minified properly using default
|
||||
// https://github.com/facebook/create-react-app/issues/2488
|
||||
ascii_only: true,
|
||||
},
|
||||
},
|
||||
// Use multi-process parallel running to improve the build speed
|
||||
// Default number of concurrent runs: os.cpus().length - 1
|
||||
parallel: true,
|
||||
}),
|
||||
new CssMinimizerPlugin({
|
||||
parallel: true,
|
||||
minimizerOptions: [{
|
||||
preset: [
|
||||
'default',
|
||||
{
|
||||
discardComments: {
|
||||
removeAll: true
|
||||
},
|
||||
zindex: true,
|
||||
cssDeclarationSorter: true,
|
||||
reduceIdents: false,
|
||||
mergeIdents: true,
|
||||
mergeRules: true,
|
||||
mergeLonghand: true,
|
||||
discardUnused: true,
|
||||
discardOverridden: true,
|
||||
discardDuplicates: true,
|
||||
},
|
||||
],
|
||||
}, ],
|
||||
minify: [
|
||||
CssMinimizerPlugin.cssnanoMinify,
|
||||
//CssMinimizerPlugin.cleanCssMinify,
|
||||
]
|
||||
}),
|
||||
],
|
||||
},
|
||||
|
||||
output: {
|
||||
publicPath: path.join(conf.APPDIR, conf.DIST),
|
||||
path: path.join(__dirname, conf.APPDIR, conf.DIST),
|
||||
filename: path.join('js', '[name].js'),
|
||||
},
|
||||
output: {
|
||||
publicPath: path.join(conf.APPDIR, conf.DIST),
|
||||
path: path.join(__dirname, conf.APPDIR, conf.DIST),
|
||||
filename: path.join('js', '[name].js'),
|
||||
},
|
||||
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
test: /\.jsx?$/,
|
||||
//exclude: /node_modules/,
|
||||
use: {
|
||||
loader: 'babel-loader',
|
||||
options: {
|
||||
presets: [
|
||||
'@babel/preset-env',
|
||||
'@babel/react',
|
||||
{
|
||||
plugins: [
|
||||
'@babel/plugin-proposal-class-properties',
|
||||
],
|
||||
},
|
||||
], //Preset used for env setup
|
||||
plugins: [['@babel/transform-react-jsx']],
|
||||
cacheDirectory: true,
|
||||
cacheCompression: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
test: /\.s?css$/,
|
||||
use: [
|
||||
{
|
||||
loader: MiniCssExtractPlugin.loader,
|
||||
},
|
||||
{
|
||||
loader: 'css-loader',
|
||||
options: {
|
||||
sourceMap: !COMPRESS,
|
||||
},
|
||||
},
|
||||
{
|
||||
loader: 'resolve-url-loader',
|
||||
},
|
||||
{
|
||||
loader: 'sass-loader',
|
||||
options: {
|
||||
sourceMap: !COMPRESS,
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
test: /fontawesome([^.]+).(ttf|otf|eot|svg|woff(2)?)(\?[a-z0-9]+)?$/,
|
||||
use: [
|
||||
{
|
||||
loader: 'file-loader',
|
||||
options: {
|
||||
name: '[name].[ext]',
|
||||
outputPath: 'fonts/',
|
||||
publicPath: '../fonts/',
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
test: /\.(ttf|otf|eot|svg|woff(2)?)$/,
|
||||
use: [
|
||||
{
|
||||
loader: 'file-loader',
|
||||
options: {
|
||||
name: '[name].[ext]',
|
||||
outputPath: 'fonts/',
|
||||
publicPath: '../fonts/',
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
test: /\.(png|webp|jpg|jpeg|gif|svg)$/,
|
||||
use: [
|
||||
{
|
||||
loader: 'img-optimize-loader',
|
||||
options: {
|
||||
name: '[name].[ext]',
|
||||
outputPath: 'img/',
|
||||
publicPath: '../img/',
|
||||
compress: {
|
||||
// This will take more time and get smaller images.
|
||||
mode: 'low', // 'lossless', 'high', 'low'
|
||||
disableOnDevelopment: true,
|
||||
webp: conf['webp'],
|
||||
},
|
||||
inline: {
|
||||
limit: 1,
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
module: {
|
||||
rules: [{
|
||||
test: /\.jsx?$/,
|
||||
//exclude: /node_modules/,
|
||||
use: {
|
||||
loader: 'babel-loader', //'@sucrase/webpack-loader',
|
||||
options: {
|
||||
//transforms: ['jsx']
|
||||
presets: [
|
||||
'@babel/preset-env',
|
||||
'@babel/react',
|
||||
{
|
||||
plugins: [
|
||||
'@babel/plugin-proposal-class-properties',
|
||||
],
|
||||
},
|
||||
], //Preset used for env setup
|
||||
plugins: [
|
||||
['@babel/transform-react-jsx']
|
||||
],
|
||||
cacheDirectory: true,
|
||||
cacheCompression: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
test: /\.s?css$/,
|
||||
use: [{
|
||||
loader: MiniCssExtractPlugin.loader,
|
||||
},
|
||||
{
|
||||
loader: 'css-loader',
|
||||
options: {
|
||||
sourceMap: !COMPRESS,
|
||||
},
|
||||
},
|
||||
{
|
||||
loader: 'resolve-url-loader',
|
||||
},
|
||||
{
|
||||
loader: 'sass-loader',
|
||||
options: {
|
||||
sourceMap: !COMPRESS,
|
||||
},
|
||||
}, ],
|
||||
},
|
||||
{
|
||||
test: /fontawesome([^.]+).(ttf|otf|eot|svg|woff(2)?)(\?[a-z0-9]+)?$/,
|
||||
use: [{
|
||||
loader: 'file-loader',
|
||||
options: {
|
||||
name: '[name].[ext]',
|
||||
outputPath: 'fonts/',
|
||||
publicPath: '../fonts/',
|
||||
},
|
||||
}, ],
|
||||
},
|
||||
{
|
||||
test: /\.(ttf|otf|eot|woff(2)?)$/,
|
||||
use: [{
|
||||
loader: 'file-loader',
|
||||
options: {
|
||||
name: '[name].[ext]',
|
||||
outputPath: 'fonts/',
|
||||
publicPath: '../fonts/',
|
||||
},
|
||||
}, ],
|
||||
},
|
||||
{
|
||||
test: /\.(png|webp|jpg|jpeg|gif|svg)$/,
|
||||
use: [{
|
||||
loader: 'img-optimize-loader',
|
||||
options: {
|
||||
name: '[name].[ext]',
|
||||
outputPath: 'img/',
|
||||
publicPath: '../img/',
|
||||
compress: {
|
||||
// This will take more time and get smaller images.
|
||||
mode: 'low', // 'lossless', 'high', 'low'
|
||||
disableOnDevelopment: true,
|
||||
webp: conf['webp'],
|
||||
// loseless compression for png
|
||||
optipng: {
|
||||
optimizationLevel: 4,
|
||||
},
|
||||
// lossy compression for png. This will generate smaller file than optipng.
|
||||
pngquant: {
|
||||
quality: [0.2, 0.8],
|
||||
},
|
||||
// Compression for svg.
|
||||
svgo: true,
|
||||
// Compression for gif.
|
||||
gifsicle: {
|
||||
optimizationLevel: 3,
|
||||
},
|
||||
// Compression for jpg.
|
||||
mozjpeg: {
|
||||
progressive: true,
|
||||
quality: 60,
|
||||
},
|
||||
},
|
||||
inline: {
|
||||
limit: 1,
|
||||
},
|
||||
},
|
||||
}, ],
|
||||
}, ],
|
||||
},
|
||||
|
||||
plugins: plugins,
|
||||
plugins: plugins,
|
||||
});
|
||||
|
||||
console.log(cfg);
|
||||
|
||||
@ -1,23 +1,27 @@
|
||||
/*
|
||||
* Development assets generation
|
||||
*/
|
||||
const common = require('./webpack.config.common.js');
|
||||
const conf = common.configuration;
|
||||
|
||||
const path = require('path');
|
||||
const fs = require('fs');
|
||||
|
||||
//const autoprefixer = require('autoprefixer');
|
||||
const webpack = require('webpack');
|
||||
const { merge } = require('webpack-merge');
|
||||
const {
|
||||
merge
|
||||
} = require('webpack-merge');
|
||||
|
||||
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
|
||||
const HtmlWebpackPlugin = require('html-webpack-plugin');
|
||||
|
||||
const common = require('./webpack.config.common.js');
|
||||
const commonVariables = require('./webpack.configuration');
|
||||
const conf = commonVariables.configuration;
|
||||
|
||||
const IP = process.env.IP || conf.HOSTNAME;
|
||||
const PORT = process.env.PORT || conf.PORT;
|
||||
|
||||
const UIInfo = require('./package.json');
|
||||
const UIVERSION = JSON.stringify(UIInfo.version);
|
||||
const UIMetaInfo = require('./package.json');
|
||||
|
||||
const NODE_ENV = 'development'; //conf.NODE_ENV || process.env.NODE_ENV;
|
||||
const COMPRESS = NODE_ENV === 'production' ? true : false;
|
||||
@ -25,152 +29,152 @@ const COMPRESS = NODE_ENV === 'production' ? true : false;
|
||||
console.log('NODE_ENV: ' + NODE_ENV);
|
||||
console.log('COMPRESS: ' + COMPRESS);
|
||||
console.log('WebP images: ' + conf['webp']);
|
||||
console.log('GRAPHQL_API_KEY: ' + conf['GRAPHQL_API_KEY']);
|
||||
console.log('HTTPS: ' + conf['HTTPS']);
|
||||
|
||||
const config = merge(common, {
|
||||
mode: 'development',
|
||||
|
||||
entry: {
|
||||
/*hot: [
|
||||
'react-hot-loader/patch',
|
||||
'webpack-dev-server/?https://' + conf.HOSTNAME + ':' + conf.PORT,
|
||||
'webpack/hot/only-dev-server',
|
||||
],*/
|
||||
},
|
||||
|
||||
output: {
|
||||
path: path.join(__dirname),
|
||||
filename: '[name].js',
|
||||
// necessary for HMR to know where to load the hot update chunks
|
||||
publicPath: 'https://' + conf.HOSTNAME + ':' + conf.PORT + '/',
|
||||
},
|
||||
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
test: /\.jsx?$/,
|
||||
//exclude: /node_modules/,
|
||||
use: {
|
||||
loader: 'babel-loader',
|
||||
options: {
|
||||
presets: [
|
||||
'@babel/preset-env',
|
||||
'@babel/react',
|
||||
{
|
||||
plugins: ['@babel/plugin-proposal-class-properties'],
|
||||
},
|
||||
], //Preset used for env setup
|
||||
plugins: [['@babel/transform-react-jsx']],
|
||||
cacheDirectory: true,
|
||||
cacheCompression: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
test: /\.s?css$/,
|
||||
use: [
|
||||
{
|
||||
loader: MiniCssExtractPlugin.loader,
|
||||
},
|
||||
{
|
||||
loader: 'css-loader',
|
||||
options: {
|
||||
sourceMap: !COMPRESS,
|
||||
},
|
||||
},
|
||||
{
|
||||
loader: 'resolve-url-loader',
|
||||
},
|
||||
{
|
||||
loader: 'sass-loader',
|
||||
options: {
|
||||
sourceMap: false,
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
test: /fontawesome([^.]+).(ttf|otf|eot|svg|woff(2)?)(\?[a-z0-9]+)?$/,
|
||||
use: [
|
||||
{
|
||||
loader: 'url-loader',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
test: /\.(gif|png|jpg|jpeg|ttf|otf|eot|svg|webp|woff(2)?)$/,
|
||||
use: [
|
||||
{
|
||||
loader: 'file-loader',
|
||||
options: {
|
||||
name(file) {
|
||||
return 'public/[path][name].[ext]';
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
plugins: [
|
||||
const plugins = [
|
||||
new webpack.ProvidePlugin({
|
||||
$: 'jquery',
|
||||
jQuery: 'jquery',
|
||||
'window.jQuery': 'jquery',
|
||||
Popper: ['popper.js', 'default'],
|
||||
Util: 'exports-loader?Util!bootstrap/js/dist/util',
|
||||
Alert: 'exports-loader?Alert!bootstrap/js/dist/alert',
|
||||
Button: 'exports-loader?Button!bootstrap/js/dist/button',
|
||||
Carousel: 'exports-loader?Carousel!bootstrap/js/dist/carousel',
|
||||
Collapse: 'exports-loader?Collapse!bootstrap/js/dist/collapse',
|
||||
Dropdown: 'exports-loader?Dropdown!bootstrap/js/dist/dropdown',
|
||||
Modal: 'exports-loader?Modal!bootstrap/js/dist/modal',
|
||||
Tooltip: 'exports-loader?Tooltip!bootstrap/js/dist/tooltip',
|
||||
Popover: 'exports-loader?Popover!bootstrap/js/dist/popover',
|
||||
Scrollspy: 'exports-loader?Scrollspy!bootstrap/js/dist/scrollspy',
|
||||
Tab: 'exports-loader?Tab!bootstrap/js/dist/tab',
|
||||
react: 'React',
|
||||
'react-dom': 'ReactDOM',
|
||||
/*$: 'jquery',
|
||||
jQuery: 'jquery',*/
|
||||
}),
|
||||
new webpack.DefinePlugin({
|
||||
UINAME: JSON.stringify(UIInfo.name),
|
||||
UIVERSION: JSON.stringify(UIInfo.version),
|
||||
UIAUTHOR: JSON.stringify(UIInfo.author),
|
||||
UINAME: JSON.stringify(UIInfo.name),
|
||||
UIVERSION: UIVERSION,
|
||||
UIAUTHOR: JSON.stringify(UIInfo.author),
|
||||
UIMetaNAME: JSON.stringify(UIMetaInfo.name),
|
||||
UIMetaVersion: JSON.stringify(UIMetaInfo.version),
|
||||
GRAPHQL_API_KEY: JSON.stringify(conf['GRAPHQL_API_KEY']),
|
||||
SWVERSION: JSON.stringify(`sw-${new Date().getTime()}`),
|
||||
BASE_HREF: JSON.stringify(
|
||||
`http${conf['HTTPS'] ? 's' : ''}://${IP}:${PORT}`,
|
||||
),
|
||||
}),
|
||||
//new webpack.HotModuleReplacementPlugin(),
|
||||
new MiniCssExtractPlugin(),
|
||||
new HtmlWebpackPlugin({
|
||||
publicPath: '',
|
||||
template: path.join(conf.APPDIR, conf.SRC, 'index.html'),
|
||||
templateParameters: {
|
||||
NODE_ENV: NODE_ENV,
|
||||
REACT_SCRIPTS:
|
||||
NODE_ENV === 'production'
|
||||
? '<script crossorigin src="https://unpkg.com/react@17/umd/react.production.min.js"></script><script crossorigin src="https://unpkg.com/react-dom@17/umd/react-dom.production.min.js"></script>'
|
||||
: '<script crossorigin src="https://unpkg.com/react@17/umd/react.development.js"></script><script crossorigin src="https://unpkg.com/react-dom@17/umd/react-dom.development.js"></script>',
|
||||
},
|
||||
}),
|
||||
],
|
||||
];
|
||||
|
||||
devServer: {
|
||||
host: IP,
|
||||
port: PORT,
|
||||
historyApiFallback: false,
|
||||
//hot: true,
|
||||
/*clientLogLevel: 'info',
|
||||
disableHostCheck: true,
|
||||
contentBase: [
|
||||
path.resolve(__dirname, 'public'),
|
||||
path.resolve(__dirname, 'public', 'resources'),
|
||||
path.resolve(__dirname, 'public', 'resources', conf.APPDIR, conf.DIST),
|
||||
'node_modules',
|
||||
],*/
|
||||
//watchContentBase: true,
|
||||
overlay: {
|
||||
warnings: true,
|
||||
errors: true,
|
||||
const indexPath = path.join(__dirname, conf.APPDIR, conf.SRC, 'index.html');
|
||||
if (fs.existsSync(indexPath)) {
|
||||
plugins.push(
|
||||
new HtmlWebpackPlugin({
|
||||
publicPath: '',
|
||||
template: path.join(conf.APPDIR, conf.SRC, 'index.html'),
|
||||
templateParameters: {
|
||||
NODE_ENV: NODE_ENV,
|
||||
GRAPHQL_URL: conf['GRAPHQL_URL'],
|
||||
STATIC_URL: conf['STATIC_URL'],
|
||||
REACT_SCRIPTS: NODE_ENV === 'production' ?
|
||||
'<script crossorigin src="https://unpkg.com/react@17/umd/react.production.min.js"></script><script crossorigin src="https://unpkg.com/react-dom@17/umd/react-dom.production.min.js"></script>' : '<script crossorigin src="https://unpkg.com/react@17/umd/react.development.js"></script><script crossorigin src="https://unpkg.com/react-dom@17/umd/react-dom.development.js"></script>',
|
||||
},
|
||||
}),
|
||||
);
|
||||
}
|
||||
|
||||
const config = merge(common.webpack, {
|
||||
mode: 'development',
|
||||
|
||||
entry: {
|
||||
/*hot: [
|
||||
'react-hot-loader/patch',
|
||||
'webpack-dev-server/?https://' + conf.HOSTNAME + ':' + conf.PORT,
|
||||
'webpack/hot/only-dev-server',
|
||||
],*/
|
||||
},
|
||||
headers: {
|
||||
'Access-Control-Allow-Origin': '*',
|
||||
|
||||
output: {
|
||||
path: path.join(__dirname),
|
||||
filename: '[name].js',
|
||||
// necessary for HMR to know where to load the hot update chunks
|
||||
publicPath: `http${conf['HTTPS'] ? 's' : ''}://${conf['HOSTNAME']}:${
|
||||
conf.PORT
|
||||
}/`,
|
||||
},
|
||||
|
||||
module: {
|
||||
rules: [{
|
||||
test: /\.jsx?$/,
|
||||
//exclude: /node_modules/,
|
||||
use: {
|
||||
loader: '@sucrase/webpack-loader', //'babel-loader',
|
||||
options: {
|
||||
transforms: ['jsx']
|
||||
/*presets: [
|
||||
'@babel/preset-env',
|
||||
'@babel/react',
|
||||
{
|
||||
plugins: [
|
||||
'@babel/plugin-proposal-class-properties',
|
||||
'@babel/plugin-syntax-top-level-await',
|
||||
],
|
||||
},
|
||||
], //Preset used for env setup
|
||||
plugins: [
|
||||
['@babel/transform-react-jsx'],
|
||||
['@babel/plugin-syntax-top-level-await'],
|
||||
],
|
||||
cacheDirectory: true,
|
||||
cacheCompression: true,*/
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
test: /\.s?css$/,
|
||||
use: [{
|
||||
loader: MiniCssExtractPlugin.loader,
|
||||
},
|
||||
{
|
||||
loader: 'css-loader',
|
||||
options: {
|
||||
sourceMap: !COMPRESS,
|
||||
},
|
||||
},
|
||||
{
|
||||
loader: 'resolve-url-loader',
|
||||
},
|
||||
{
|
||||
loader: 'sass-loader',
|
||||
options: {
|
||||
sourceMap: false,
|
||||
},
|
||||
}, ],
|
||||
},
|
||||
{
|
||||
test: /fontawesome([^.]+).(ttf|otf|eot|svg|woff(2)?)(\?[a-z0-9]+)?$/,
|
||||
use: [{
|
||||
loader: 'url-loader',
|
||||
}, ],
|
||||
},
|
||||
{
|
||||
test: /\.(gif|png|jpg|jpeg|ttf|otf|eot|svg|webp|woff(2)?)$/,
|
||||
use: [{
|
||||
loader: 'file-loader',
|
||||
options: {
|
||||
name(file) {
|
||||
return 'public/[path][name].[ext]';
|
||||
},
|
||||
},
|
||||
}, ],
|
||||
}, ],
|
||||
},
|
||||
plugins: plugins,
|
||||
|
||||
devServer: {
|
||||
host: IP,
|
||||
port: PORT,
|
||||
historyApiFallback: false,
|
||||
static: path.resolve(__dirname, conf['APPDIR'], conf['SRC']),
|
||||
https: conf['HTTPS'],
|
||||
hot: false,
|
||||
//injectClient: conf['injectClient'],
|
||||
|
||||
headers: {
|
||||
'Access-Control-Allow-Origin': '*',
|
||||
'Referrer-Policy': 'unsafe-url',
|
||||
'service-worker-allowed': '/',
|
||||
},
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
module.exports = config;
|
||||
|
||||
@ -1,35 +0,0 @@
|
||||
/*
|
||||
* Load webpack configuration from app/_config/webpack.yml
|
||||
*/
|
||||
|
||||
const path = require('path');
|
||||
const filesystem = require('fs');
|
||||
const fs = require('fs');
|
||||
const yaml = require('js-yaml');
|
||||
|
||||
const conf = yaml.safeLoad(
|
||||
fs.readFileSync(path.join(__dirname, '/webpack.yml'), 'utf8'),
|
||||
);
|
||||
|
||||
let themes = [];
|
||||
// add themes
|
||||
if (conf['Site\\Templates\\WebpackTemplateProvider'].THEMESDIR) {
|
||||
const themeDir = conf['Site\\Templates\\WebpackTemplateProvider'].THEMESDIR;
|
||||
const dir = path.resolve(__dirname, themeDir);
|
||||
|
||||
if (filesystem.existsSync(dir)) {
|
||||
filesystem.readdirSync(dir).forEach((file) => {
|
||||
filePath = path.join(themeDir, file);
|
||||
const stat = filesystem.statSync(filePath);
|
||||
|
||||
if (stat && stat.isDirectory()) {
|
||||
themes.push(filePath);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
configuration: conf['Site\\Templates\\WebpackTemplateProvider'],
|
||||
themes: themes,
|
||||
};
|
||||
11
webpack.yml
11
webpack.yml
@ -2,14 +2,19 @@
|
||||
# with all configuration variables presented
|
||||
# Cuz WebPack compiling script use it to set configuration
|
||||
|
||||
Site\Templates\WebpackTemplateProvider:
|
||||
App\Templates\WebpackTemplateProvider:
|
||||
APPDIR: ./
|
||||
THEMESDIR: themes
|
||||
HOSTNAME: 127.0.0.1
|
||||
PORT: 3000
|
||||
PORT: 3001
|
||||
SRC: src
|
||||
DIST: dist
|
||||
TYPESJS: src/js/types
|
||||
TYPESSCSS: src/scss/types
|
||||
NODE_ENV: production #production,development
|
||||
webp: false
|
||||
NODE_ENV: production #production,development
|
||||
HTTPS: false
|
||||
injectClient: true # disable it to test caching service worker
|
||||
GRAPHQL_URL: 'http://127.0.0.1/graphql'
|
||||
GRAPHQL_API_KEY: 'ApKrRSjySO4JAmX3E2Z7HvrBD0m8xdDlAiXyh4IbH3w'
|
||||
STATIC_URL: 'http://127.0.0.1'
|
||||
|
||||
Loading…
Reference in New Issue
Block a user