vite-plugin-vue-style-bundler
Version:
`Automatically extract the `css` in `Vue` components and bundle them into the `js` source code, and then automatically insert the style into the head at runtime.
32 lines (27 loc) • 2.82 kB
JavaScript
'use strict';
var O = require('less');
var sass = require('sass');
var x = require('path');
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
var O__default = /*#__PURE__*/_interopDefault(O);
var x__default = /*#__PURE__*/_interopDefault(x);
var $=/\<style(.*?)\>([\s\S]*?)\<\/style\>/gm,g=/\b(\w+)(\s*(\=)\s*(([\"\'])(.*?)\5)?)?/gm;function b(e){let t,r={};for(;(t=g.exec(e))!==null;)t.index===g.lastIndex&&g.lastIndex++,t.forEach((n,i,s)=>{let l=s[1],o=s[6];r[l]=o==null||o=="true"?!0:o=="false"?!1:o;});return r.scoped===void 0&&(r.scoped=!0),r}function f(e,t=!0){let r=[],n;for(;(n=$.exec(e))!==null;){let i=b(n[1].trim()),s=n[2].trim();i.bundle&&(r.push([i,s]),t&&(e=e.replace(n[0],"")));}return [e,r]}var m=/(\<script\s*.*?\bsetup\s*.*?\>)([\s\S]*?)(\<\/script\s*>)/gm;function y(e,{styleId:t,css:r}){let n=m.exec(e),i=`
const $insertStylesheet = (id,css)=>{
let style = document.getElementById('${t}')
if(!style){
style = document.createElement("style")
style.id = '${t}'
document.head.appendChild(style)
style.innerHTML = css
}
}
$insertStylesheet('${t}',\`${r}\`)
`;return n===null?`<script setup>${i}</script>
${e}`:e.replace(m,`$1${i}
$2
$3`)}function d(e){let t=0;if(e.length===0)return t.toString();for(let r=0;r<e.length;r++){let n=e.charCodeAt(r);t=(t<<5)-t+n,t=t&t;}return "h"+Math.abs(t).toString(36).substring(0,6)}async function h(e,t){return (await O__default.default.render(e,t)).css}async function S(e,t){return (await sass.compileStringAsync(e,t)).css}function P(e,t){let r=/(?<=\}|^)([^\{\}]+)(?=\{)/gm;return e.replace(r,(n,i)=>i.split(",").map(s=>{if(s=s.trim(),s.startsWith("@"))return s;let l=s.indexOf(":");return l==-1?`
`+s+`[data-l-${t}]`:`
`+s.slice(0,l)+`[data-l-${t}]`+s.slice(l)}).join(","))}function R(e,t){return e.replace(/(<template>)([\s\S]+)(<\/template>)/gm,(r,n,i,s)=>`${n}${i.replace(/(?<!=[\'\"\\])\<\w+\s*/gm,l=>`${l} data-l-${t} `)}${s}`)}var k=e=>{let t=Object.assign({lessOptions:{},sassOptions:{}},e);return {name:"vue-plugin-vue-style-bundler",enforce:"pre",async transform(r,n){if(!/.vue$/.test(n))return;let i=d(n),[s,l]=f(r);if(l.length>0){for(let[o,p]of l){let u=typeof o.bundle=="string"?o.bundle:i,c=p;if(o.lang=="less")try{c=await h(p,Object.assign({syncImport:!0,rootPath:x__default.default.dirname(n),paths:x__default.default.dirname(n)},t.lessOptions));}catch(a){throw console.error("Error while compile less:",a),a}else if(["sass","scss"].includes(o.lang))try{c=await S(p,t.sassOptions);}catch(a){throw console.error("Error while compile sass:",a),a}o.scoped&&(c=P(c,u),s=R(s,u)),s=y(s,{styleId:u,props:o,css:c});}return s}else return r}}};
module.exports = k;
//# sourceMappingURL=out.js.map
//# sourceMappingURL=index.js.map