3 lines
8.9 KiB
JavaScript
3 lines
8.9 KiB
JavaScript
import{c as s,d as e,b as n,D as a,o as r,e as t,f as c,E as l,p as o,g as p,h as m,i as $,j as f,k as i,F as v,l as u,m as g,A as d,y as h,G as b}from"./chunk.82446879.js";import"./chunk.f5a3f321.js";import"./chunk.e8a2e241.js";import{a as E}from"./chunk.4b4ee497.js";import{a as w}from"./chunk.b01e898f.js";function x(s){let e;return{c(){e=c("npm install --save bulma svelma-pro")},l(s){e=$(s,"npm install --save bulma svelma-pro")},m(s,n){u(s,e,n)},d(s){s&&f(e)}}}function D(s){let e;return{c(){e=c("npm install --save-dev svelte-preprocess autoprefixer node-sass sass")},l(s){e=$(s,"npm install --save-dev svelte-preprocess autoprefixer node-sass sass")},m(s,n){u(s,e,n)},d(s){s&&f(e)}}}function j(s){let e,n,j,k,I,P,V,B,y,S,C,M,N,A,F,H,O,R,q,L,T,G,z,J,K,Q,U,W,X,Y,Z,_,ss,es,ns,as,rs,ts,cs,ls,os,ps,ms,$s,fs,is,vs,us,gs,ds,hs,bs,Es,ws,xs,Ds,js,ks,Is,Ps,Vs,Bs,ys,Ss,Cs,Ms,Ns,As,Fs,Hs,Os,Rs,qs,Ls;const Ts=new E({props:{title:"Start",subtitle:"如何使用"}}),Gs=new w({props:{lang:"bash",$$slots:{default:[x]},$$scope:{ctx:s}}}),zs=new w({props:{lang:"bash",$$slots:{default:[D]},$$scope:{ctx:s}}}),Js=new w({props:{lang:"js",code:"import sveltePreprocess from 'svelte-preprocess';\nconst preprocess = sveltePreprocess({\n scss: {\n includePaths: ['src'],\n },\n postcss: {\n plugins: [require('autoprefixer')],\n },\n});\n\n// ...\n\nexport default {\n // ... \n plugins: [\n svelte({\n // ...\n preprocess: preprocess,\n })\n ]\n}"}}),Ks=new w({props:{lang:"js",code:"import sveltePreprocess from 'svelte-preprocess';\nconst preprocess = sveltePreprocess({\n scss: {\n includePaths: ['src'],\n },\n postcss: {\n plugins: [require('autoprefixer')],\n },\n});\n\n// ...\n\nmodule.export = {\n // ... \n module: {\n rules: [\n {\n test: /.(svelte|html)$/,\n use: {\n loader: 'svelte-loader',\n options: {\n preprocess, \n // ...\n }\n }\n },\n ]\n },\n ]\n}"}}),Qs=new w({props:{lang:"html",code:"\n\x3c!-- main.js或者client.js全局引入 --\x3e\n<script>\n import 'bulma/css/bulma.css'\n<\/script>\n "}}),Us=new w({props:{lang:"html",code:"\n<script>\n import { Button } from 'svelma-pro'\n<\/script>\n\n<Button>I am a Button</Button>\n "}}),Ws=new w({props:{lang:"html",code:"\n<script>\n import { Svelma } from 'svelma-pro'\n<\/script>\n\n<Svelma.Button>I am a Button</Svelma.Button>\n "}}),Xs=new w({props:{lang:"bash",code:'\n <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css"></link>\n'}}),Ys=new w({props:{lang:"bash",code:"npm install --save @fortawesome/fontawesome-free"}}),Zs=new w({props:{lang:"bash",code:"\x3c!-- main.js or client.js(sapper) --\x3e\n<script>\n import '@fortawesome/fontawesome-free/css/all.css'\n<\/script>"}});return{c(){a(Ts.$$.fragment),e=r(),n=t("br"),j=r(),k=t("br"),I=r(),P=t("div"),V=t("div"),B=t("p"),y=c("1"),S=r(),C=t("div"),M=t("p"),N=c("NPM"),A=r(),F=t("p"),H=c("此组件库适用于基于rollup或者webpack搭建的svelte及sapper项目"),O=r(),R=t("p"),q=c("下载安装"),L=r(),T=t("div"),G=c("下载bluma与组件库."),z=r(),a(Gs.$$.fragment),J=r(),K=t("div"),Q=c("集成scss模板语法支持(因为组件库采用了类似vue的scss模板写法,所以需要也集成进去)."),U=r(),a(zs.$$.fragment),W=r(),X=t("div"),Y=c("添加\n "),Z=t("code"),_=c("scss编译"),ss=c("\n 到你的\n "),es=t("code"),ns=c("rollup.config.js"),as=c("\n 配置文件中(或者webpack.config.js)."),rs=r(),a(Js.$$.fragment),ts=r(),cs=t("div"),ls=c("如果使用webpack,在\n "),os=t("code"),ps=c("webpack.config.js"),ms=c("\n 配置文件中."),$s=r(),a(Ks.$$.fragment),fs=r(),is=t("p"),vs=c("使用"),us=r(),gs=t("div"),ds=c("引入bluma样式到您的项目"),hs=r(),a(Qs.$$.fragment),bs=r(),Es=t("div"),ws=c("svelma-pro组件可以一次导入一个,就像这样"),xs=r(),a(Us.$$.fragment),Ds=r(),js=t("div"),ks=c("或导入完整的Svelma软件包。"),Is=r(),a(Ws.$$.fragment),Ps=r(),Vs=t("hr"),Bs=r(),ys=t("div"),Ss=t("div"),Cs=t("p"),Ms=c("2"),Ns=r(),As=t("div"),Fs=t("p"),Hs=c("使用 [Font Awesome] 图标"),Os=c("\n\n 添加 CDN 在你的 HTML 页面:\n "),a(Xs.$$.fragment),Rs=c("\n ...或者使用npm包:\n "),a(Ys.$$.fragment),qs=r(),a(Zs.$$.fragment),this.h()},l(s){l(Ts.$$.fragment,s),e=o(s),n=p(s,"BR",{}),j=o(s),k=p(s,"BR",{}),I=o(s),P=p(s,"DIV",{class:!0});var a=m(P);V=p(a,"DIV",{class:!0});var r=m(V);B=p(r,"P",{class:!0});var t=m(B);y=$(t,"1"),t.forEach(f),r.forEach(f),S=o(a),C=p(a,"DIV",{class:!0});var c=m(C);M=p(c,"P",{class:!0});var i=m(M);N=$(i,"NPM"),i.forEach(f),A=o(c),F=p(c,"P",{class:!0});var v=m(F);H=$(v,"此组件库适用于基于rollup或者webpack搭建的svelte及sapper项目"),v.forEach(f),O=o(c),R=p(c,"P",{class:!0});var u=m(R);q=$(u,"下载安装"),u.forEach(f),L=o(c),T=p(c,"DIV",{class:!0});var g=m(T);G=$(g,"下载bluma与组件库."),g.forEach(f),z=o(c),l(Gs.$$.fragment,c),J=o(c),K=p(c,"DIV",{class:!0});var d=m(K);Q=$(d,"集成scss模板语法支持(因为组件库采用了类似vue的scss模板写法,所以需要也集成进去)."),d.forEach(f),U=o(c),l(zs.$$.fragment,c),W=o(c),X=p(c,"DIV",{class:!0});var h=m(X);Y=$(h,"添加\n "),Z=p(h,"CODE",{});var b=m(Z);_=$(b,"scss编译"),b.forEach(f),ss=$(h,"\n 到你的\n "),es=p(h,"CODE",{});var E=m(es);ns=$(E,"rollup.config.js"),E.forEach(f),as=$(h,"\n 配置文件中(或者webpack.config.js)."),h.forEach(f),rs=o(c),l(Js.$$.fragment,c),ts=o(c),cs=p(c,"DIV",{class:!0});var w=m(cs);ls=$(w,"如果使用webpack,在\n "),os=p(w,"CODE",{});var x=m(os);ps=$(x,"webpack.config.js"),x.forEach(f),ms=$(w,"\n 配置文件中."),w.forEach(f),$s=o(c),l(Ks.$$.fragment,c),fs=o(c),is=p(c,"P",{class:!0});var D=m(is);vs=$(D,"使用"),D.forEach(f),us=o(c),gs=p(c,"DIV",{class:!0});var Ls=m(gs);ds=$(Ls,"引入bluma样式到您的项目"),Ls.forEach(f),hs=o(c),l(Qs.$$.fragment,c),bs=o(c),Es=p(c,"DIV",{class:!0});var _s=m(Es);ws=$(_s,"svelma-pro组件可以一次导入一个,就像这样"),_s.forEach(f),xs=o(c),l(Us.$$.fragment,c),Ds=o(c),js=p(c,"DIV",{class:!0});var se=m(js);ks=$(se,"或导入完整的Svelma软件包。"),se.forEach(f),Is=o(c),l(Ws.$$.fragment,c),c.forEach(f),a.forEach(f),Ps=o(s),Vs=p(s,"HR",{class:!0}),Bs=o(s),ys=p(s,"DIV",{class:!0});var ee=m(ys);Ss=p(ee,"DIV",{class:!0});var ne=m(Ss);Cs=p(ne,"P",{class:!0});var ae=m(Cs);Ms=$(ae,"2"),ae.forEach(f),ne.forEach(f),Ns=o(ee),As=p(ee,"DIV",{class:!0});var re=m(As);Fs=p(re,"P",{class:!0});var te=m(Fs);Hs=$(te,"使用 [Font Awesome] 图标"),te.forEach(f),Os=$(re,"\n\n 添加 CDN 在你的 HTML 页面:\n "),l(Xs.$$.fragment,re),Rs=$(re,"\n ...或者使用npm包:\n "),l(Ys.$$.fragment,re),qs=o(re),l(Zs.$$.fragment,re),re.forEach(f),ee.forEach(f),this.h()},h(){i(B,"class","title"),i(V,"class","media-left"),i(M,"class","title"),i(F,"class","subtitle is-spaced"),i(R,"class","title is-4"),i(T,"class","content"),i(K,"class","content"),i(X,"class","content"),i(cs,"class","content"),i(is,"class","title is-4"),i(gs,"class","content"),i(Es,"class","content"),i(js,"class","content"),i(C,"class","media-content"),i(P,"class","media"),i(Vs,"class","is-medium"),i(Cs,"class","title"),i(Ss,"class","media-left"),i(Fs,"class","title is-spaced"),i(As,"class","media-content"),i(ys,"class","media")},m(s,a){v(Ts,s,a),u(s,e,a),u(s,n,a),u(s,j,a),u(s,k,a),u(s,I,a),u(s,P,a),g(P,V),g(V,B),g(B,y),g(P,S),g(P,C),g(C,M),g(M,N),g(C,A),g(C,F),g(F,H),g(C,O),g(C,R),g(R,q),g(C,L),g(C,T),g(T,G),g(C,z),v(Gs,C,null),g(C,J),g(C,K),g(K,Q),g(C,U),v(zs,C,null),g(C,W),g(C,X),g(X,Y),g(X,Z),g(Z,_),g(X,ss),g(X,es),g(es,ns),g(X,as),g(C,rs),v(Js,C,null),g(C,ts),g(C,cs),g(cs,ls),g(cs,os),g(os,ps),g(cs,ms),g(C,$s),v(Ks,C,null),g(C,fs),g(C,is),g(is,vs),g(C,us),g(C,gs),g(gs,ds),g(C,hs),v(Qs,C,null),g(C,bs),g(C,Es),g(Es,ws),g(C,xs),v(Us,C,null),g(C,Ds),g(C,js),g(js,ks),g(C,Is),v(Ws,C,null),u(s,Ps,a),u(s,Vs,a),u(s,Bs,a),u(s,ys,a),g(ys,Ss),g(Ss,Cs),g(Cs,Ms),g(ys,Ns),g(ys,As),g(As,Fs),g(Fs,Hs),g(As,Os),v(Xs,As,null),g(As,Rs),v(Ys,As,null),g(As,qs),v(Zs,As,null),Ls=!0},p(s,[e]){const n={};1&e&&(n.$$scope={dirty:e,ctx:s}),Gs.$set(n);const a={};1&e&&(a.$$scope={dirty:e,ctx:s}),zs.$set(a);const r={};1&e&&(r.$$scope={dirty:e,ctx:s}),Qs.$set(r);const t={};1&e&&(t.$$scope={dirty:e,ctx:s}),Us.$set(t);const c={};1&e&&(c.$$scope={dirty:e,ctx:s}),Ws.$set(c)},i(s){Ls||(d(Ts.$$.fragment,s),d(Gs.$$.fragment,s),d(zs.$$.fragment,s),d(Js.$$.fragment,s),d(Ks.$$.fragment,s),d(Qs.$$.fragment,s),d(Us.$$.fragment,s),d(Ws.$$.fragment,s),d(Xs.$$.fragment,s),d(Ys.$$.fragment,s),d(Zs.$$.fragment,s),Ls=!0)},o(s){h(Ts.$$.fragment,s),h(Gs.$$.fragment,s),h(zs.$$.fragment,s),h(Js.$$.fragment,s),h(Ks.$$.fragment,s),h(Qs.$$.fragment,s),h(Us.$$.fragment,s),h(Ws.$$.fragment,s),h(Xs.$$.fragment,s),h(Ys.$$.fragment,s),h(Zs.$$.fragment,s),Ls=!1},d(s){b(Ts,s),s&&f(e),s&&f(n),s&&f(j),s&&f(k),s&&f(I),s&&f(P),b(Gs),b(zs),b(Js),b(Ks),b(Qs),b(Us),b(Ws),s&&f(Ps),s&&f(Vs),s&&f(Bs),s&&f(ys),b(Xs),b(Ys),b(Zs)}}}export default class extends s{constructor(s){super(),e(this,s,null,j,n,{})}}
|
||
//# sourceMappingURL=index.3e2262bb.js.map
|