webpack splitted chuncks (vue-simple-accordion & vue-cool-lightbox)

This commit is contained in:
Bachir Soussi Chiadmi 2021-04-06 10:42:49 +02:00
parent ca717e9abc
commit b8cdc2d64b
12 changed files with 480 additions and 145 deletions

View File

@ -7,5 +7,6 @@
"node": "current"
}
}]
]
],
"plugins": ["@babel/plugin-syntax-dynamic-import"]
}

View File

@ -28,7 +28,8 @@ module.exports = {
},
output: {
path: utils.resolve(themePath + '/assets/dist/'),
filename: '[name].js'
filename: '[name].js',
chunkFilename: '[name].js'
},
module: {
rules: [
@ -111,7 +112,24 @@ module.exports = {
// },
]
},
optimization: {
splitChunks: {
cacheGroups: {
vsa: {
test: /[\\/]node_modules[\\/](vue-simple-accordion)[\\/]/,
name: 'vsa',
chunks: 'all',
usedExports: true
},
vclb: {
test: /[\\/]node_modules[\\/](vue-cool-lightbox)[\\/]/,
name: 'vclb',
chunks: 'all',
usedExports: true
},
},
},
},
plugins: [
new MiniCssExtractPlugin({
filename: '[name].css'
@ -128,6 +146,6 @@ module.exports = {
extensions: ['.js'],
paths: [utils.resolve(themePath + '/assets/dist/')],
minBytes: 4096
})
}),
]
}

532
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -21,7 +21,6 @@
"axios": "^0.21.0",
"check-password-strength": "^1.0.15",
"pretty-bytes": "^5.5.0",
"slim-select": "^1.27.0",
"vue": "^2.6.12",
"vue-autofocus-directive": "^1.0.4",
"vue-cool-lightbox": "^2.6.9",
@ -34,6 +33,7 @@
},
"devDependencies": {
"@babel/core": "^7.12.9",
"@babel/plugin-syntax-dynamic-import": "^7.8.3",
"@babel/preset-env": "^7.12.7",
"@kazupon/vue-i18n-loader": "^0.5.0",
"@vue/test-utils": "^1.1.1",
@ -64,6 +64,7 @@
"node-sass": "^5.0.0",
"querystring-es3": "^0.2.1",
"sass-loader": "^10.1.0",
"slim-select": "^1.27.0",
"style-loader": "^2.0.0",
"uglify-es": "^3.3.9",
"uglifyjs-webpack-plugin": "^2.2.0",

View File

@ -1,3 +1,4 @@
.vsa-item__heading{width:100%;height:100%}.vsa-item__heading,.vsa-item__trigger{display:flex;justify-content:flex-start;align-items:center}.vsa-item__trigger{margin:0;padding:0;color:inherit;font-family:inherit;font-size:100%;line-height:1.15;border-width:0;background-color:transparent;background-image:none;overflow:visible;text-transform:none;flex:1 1 auto;color:var(--vsa-text-color);transition:all .2s linear;padding:var(--vsa-heading-padding)}.vsa-item__trigger[role=button]{cursor:pointer}.vsa-item__trigger[type=button],.vsa-item__trigger[type=reset],.vsa-item__trigger[type=submit]{-webkit-appearance:button}.vsa-item__trigger:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}.vsa-item__trigger::-moz-focus-inner,.vsa-item__trigger[type=button]::-moz-focus-inner,.vsa-item__trigger[type=reset]::-moz-focus-inner,.vsa-item__trigger[type=submit]::-moz-focus-inner{border-style:none;padding:0}.vsa-item__trigger:-moz-focusring,.vsa-item__trigger[type=button]:-moz-focusring,.vsa-item__trigger[type=reset]:-moz-focusring,.vsa-item__trigger[type=submit]:-moz-focusring{outline:1px dotted ButtonText}.vsa-item__trigger:focus,.vsa-item__trigger:hover{outline:none;background-color:var(--vsa-highlight-color);color:var(--vsa-bg-color)}.vsa-item__trigger__icon--is-default{width:40px;height:40px;transform:scale(var(--vsa-default-icon-size))}.vsa-item__trigger__icon--is-default:after,.vsa-item__trigger__icon--is-default:before{background-color:var(--vsa-text-color);content:"";height:3px;position:absolute;top:10px;transition:all .13333s ease-in-out;width:30px}.vsa-item__trigger__icon--is-default:before{left:0;transform:rotate(45deg) translate3d(8px,22px,0);transform-origin:100%}.vsa-item__trigger__icon--is-default:after{transform:rotate(-45deg) translate3d(-8px,22px,0);right:0;transform-origin:0}.vsa-item__trigger[aria-expanded=true] .vsa-item__trigger__icon--is-default:before{transform:rotate(45deg) translate3d(14px,14px,0)}.vsa-item__trigger[aria-expanded=true] .vsa-item__trigger__icon--is-default:after{transform:rotate(-45deg) translate3d(-14px,14px,0)}.vsa-item__trigger__icon{display:block;margin-left:auto;position:relative;transition:all .2s ease-in-out}.vsa-item__trigger:focus .vsa-item__trigger__icon--is-default:after,.vsa-item__trigger:focus .vsa-item__trigger__icon--is-default:before,.vsa-item__trigger:hover .vsa-item__trigger__icon--is-default:after,.vsa-item__trigger:hover .vsa-item__trigger__icon--is-default:before{background-color:var(--vsa-bg-color)}.vsa-item__trigger__content{font-weight:700;font-size:1.25rem}.vsa-item__content{margin:0;padding:var(--vsa-content-padding)}.vsa-item--is-active .vsa-item__heading,.vsa-item:not(:last-of-type){border-bottom:var(--vsa-border)}.vsa-collapse-enter-active,.vsa-collapse-leave-active{transition-property:opacity,height,padding-top,padding-bottom;transition-duration:.3s;transition-timing-function:ease-in-out}.vsa-collapse-enter,.vsa-collapse-leave-active{opacity:0;height:0;padding-top:0;padding-bottom:0;overflow:hidden}.vsa-list{--vsa-max-width:720px;--vsa-min-width:300px;--vsa-heading-padding:1rem 1rem;--vsa-text-color:#373737;--vsa-highlight-color:#57a;--vsa-bg-color:#fff;--vsa-border-color:rgba(0,0,0,0.2);--vsa-border-width:1px;--vsa-border-style:solid;--vsa-border:var(--vsa-border-width) var(--vsa-border-style) var(--vsa-border-color);--vsa-content-padding:1rem 1rem;--vsa-default-icon-size:1;display:block;max-width:var(--vsa-max-width);min-width:var(--vsa-min-width);width:100%;padding:0;margin:0;list-style:none;border:var(--vsa-border);color:var(--vsa-text-color);background-color:var(--vsa-bg-color)}.vsa-list [hidden]{display:none}
.overlay[data-v-b98ce164]{background-color:rgba(0,0,0,0.8);position:fixed;top:0;right:0;bottom:0;left:0;z-index:99999}.modal[data-v-b98ce164]{background-color:#fff;position:absolute;box-sizing:border;max-width:80vw;max-height:70vh;top:0;right:0;bottom:0;left:0;margin:auto;padding:1em;border-radius:3px;box-shadow:2px 2px}
.form-item[data-v-7bb795f8],.form-actions[data-v-7bb795f8]{display:inline-block;max-width:32%;margin:0}input[data-v-7bb795f8]{box-sizing:border-box;max-width:100%}div.description[data-v-7bb795f8]{display:none}.form-item-persistent-login[data-v-7bb795f8]{display:none}
@ -6,7 +7,6 @@
fieldset[data-v-340aa566]{padding:0;margin:0;border:none}
.vsa-item__heading{width:100%;height:100%}.vsa-item__heading,.vsa-item__trigger{display:flex;justify-content:flex-start;align-items:center}.vsa-item__trigger{margin:0;padding:0;color:inherit;font-family:inherit;font-size:100%;line-height:1.15;border-width:0;background-color:transparent;background-image:none;overflow:visible;text-transform:none;flex:1 1 auto;color:var(--vsa-text-color);transition:all .2s linear;padding:var(--vsa-heading-padding)}.vsa-item__trigger[role=button]{cursor:pointer}.vsa-item__trigger[type=button],.vsa-item__trigger[type=reset],.vsa-item__trigger[type=submit]{-webkit-appearance:button}.vsa-item__trigger:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}.vsa-item__trigger::-moz-focus-inner,.vsa-item__trigger[type=button]::-moz-focus-inner,.vsa-item__trigger[type=reset]::-moz-focus-inner,.vsa-item__trigger[type=submit]::-moz-focus-inner{border-style:none;padding:0}.vsa-item__trigger:-moz-focusring,.vsa-item__trigger[type=button]:-moz-focusring,.vsa-item__trigger[type=reset]:-moz-focusring,.vsa-item__trigger[type=submit]:-moz-focusring{outline:1px dotted ButtonText}.vsa-item__trigger:focus,.vsa-item__trigger:hover{outline:none;background-color:var(--vsa-highlight-color);color:var(--vsa-bg-color)}.vsa-item__trigger__icon--is-default{width:40px;height:40px;transform:scale(var(--vsa-default-icon-size))}.vsa-item__trigger__icon--is-default:after,.vsa-item__trigger__icon--is-default:before{background-color:var(--vsa-text-color);content:"";height:3px;position:absolute;top:10px;transition:all .13333s ease-in-out;width:30px}.vsa-item__trigger__icon--is-default:before{left:0;transform:rotate(45deg) translate3d(8px,22px,0);transform-origin:100%}.vsa-item__trigger__icon--is-default:after{transform:rotate(-45deg) translate3d(-8px,22px,0);right:0;transform-origin:0}.vsa-item__trigger[aria-expanded=true] .vsa-item__trigger__icon--is-default:before{transform:rotate(45deg) translate3d(14px,14px,0)}.vsa-item__trigger[aria-expanded=true] .vsa-item__trigger__icon--is-default:after{transform:rotate(-45deg) translate3d(-14px,14px,0)}.vsa-item__trigger__icon{display:block;margin-left:auto;position:relative;transition:all .2s ease-in-out}.vsa-item__trigger:focus .vsa-item__trigger__icon--is-default:after,.vsa-item__trigger:focus .vsa-item__trigger__icon--is-default:before,.vsa-item__trigger:hover .vsa-item__trigger__icon--is-default:after,.vsa-item__trigger:hover .vsa-item__trigger__icon--is-default:before{background-color:var(--vsa-bg-color)}.vsa-item__trigger__content{font-weight:700;font-size:1.25rem}.vsa-item__content{margin:0;padding:var(--vsa-content-padding)}.vsa-item--is-active .vsa-item__heading,.vsa-item:not(:last-of-type){border-bottom:var(--vsa-border)}.vsa-collapse-enter-active,.vsa-collapse-leave-active{transition-property:opacity,height,padding-top,padding-bottom;transition-duration:.3s;transition-timing-function:ease-in-out}.vsa-collapse-enter,.vsa-collapse-leave-active{opacity:0;height:0;padding-top:0;padding-bottom:0;overflow:hidden}.vsa-list{--vsa-max-width:720px;--vsa-min-width:300px;--vsa-heading-padding:1rem 1rem;--vsa-text-color:#373737;--vsa-highlight-color:#57a;--vsa-bg-color:#fff;--vsa-border-color:rgba(0,0,0,0.2);--vsa-border-width:1px;--vsa-border-style:solid;--vsa-border:var(--vsa-border-width) var(--vsa-border-style) var(--vsa-border-color);--vsa-content-padding:1rem 1rem;--vsa-default-icon-size:1;display:block;max-width:var(--vsa-max-width);min-width:var(--vsa-min-width);width:100%;padding:0;margin:0;list-style:none;border:var(--vsa-border);color:var(--vsa-text-color);background-color:var(--vsa-bg-color)}.vsa-list [hidden]{display:none}
#user-tools[data-v-4e9a834e]{

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -34,11 +34,11 @@ import { i18n, loadLanguageAsync } from 'vuejs/i18n'
import VueMeta from 'vue-meta'
Vue.use(VueMeta)
import VueSimpleAccordion from 'vue-simple-accordion'
Vue.use(VueSimpleAccordion, {
// ... Options go here
})
import 'vue-simple-accordion/dist/vue-simple-accordion.css'
// import VueSimpleAccordion from 'vue-simple-accordion'
// Vue.use(VueSimpleAccordion, {
// // ... Options go here
// })
// import 'vue-simple-accordion/dist/vue-simple-accordion.css'
import Vue2TouchEvents from 'vue2-touch-events'
Vue.use(Vue2TouchEvents)

View File

@ -10,6 +10,8 @@ global-js:
version: VERSION
js:
assets/dist/main.js: { }
assets/dist/vsa.js: { }
assets/dist/vclb.js: { }
dependencies:
- core/drupal
# - core/drupal.ajax

View File

@ -288,6 +288,15 @@
<script>
import { mapState, mapActions } from 'vuex'
import {
VsaList,
VsaItem,
VsaHeading,
VsaContent,
VsaIcon
} from 'vue-simple-accordion'
import 'vue-simple-accordion/dist/vue-simple-accordion.css'
import LinkedMaterialCard from 'vuejs/components/Content/LinkedMaterialCard'
import cardMixins from 'vuejs/components/cardMixins'
@ -307,7 +316,37 @@ export default {
props: ['item', 'addNoteId'],
mixins: [cardMixins],
components: {
LinkedMaterialCard
LinkedMaterialCard,
VsaList,
VsaItem,
VsaHeading,
VsaContent,
VsaIcon
// VsaList: () => import(
// /* webpackPrefetch: true */
// /* webpackChunkName: "vsa" */
// /* webpackExports: ["VsaList"] */
// '/app/node_modules/vue-simple-accordion/'),
// VsaItem: () => import(
// /* webpackPrefetch: true */
// /* webpackChunkName: "vsa" */
// /* webpackExports: ["VsaItem"] */
// '/app/node_modules/vue-simple-accordion/'),
// VsaHeading: () => import(
// /* webpackPrefetch: true */
// /* webpackChunkName: "vsa" */
// /* webpackExports: ["VsaHeading"] */
// '/app/node_modules/vue-simple-accordion/'),
// VsaContent: () => import(
// /* webpackPrefetch: true */
// /* webpackChunkName: "vsa" */
// /* webpackExports: ["VsaContent"] */
// '/app/node_modules/vue-simple-accordion/'),
// VsaIcon: () => import(
// /* webpackPrefetch: true */
// /* webpackChunkName: "vsa" */
// /* webpackExports: ["VsaIcon"] */
// '/app/node_modules/vue-simple-accordion/')
},
data() {
return {