diff --git a/.nojekyll b/.nojekyll new file mode 100644 index 0000000..e69de29 diff --git a/404.html b/404.html new file mode 100644 index 0000000..e3da718 --- /dev/null +++ b/404.html @@ -0,0 +1,20 @@ + + + + + + ronna-admin-doc + + + + + + + + + + +
404
我是谁？我在哪？
返回首页
+ + + diff --git a/CORS b/CORS new file mode 100644 index 0000000..f59ec20 --- /dev/null +++ b/CORS @@ -0,0 +1 @@ +* \ No newline at end of file diff --git a/assets/css/0.styles.ea92d6e2.css b/assets/css/0.styles.ea92d6e2.css new file mode 100644 index 0000000..49a44fb --- /dev/null +++ b/assets/css/0.styles.ea92d6e2.css @@ -0,0 +1 @@ +@import url(//at.alicdn.com/t/font_1678482_4tbhmh589x.css);.code-copy{color:#aaa;fill:#aaa;font-size:14px;display:inline-block;cursor:pointer}div[class*=aside-code] aside .code-copy,div[class*=language-] pre .code-copy{position:absolute;z-index:1000;top:7px;right:35px;opacity:0;font-size:16px}div[class*=aside-code] aside:hover .code-copy,div[class*=language-] pre:hover .code-copy{opacity:1}.content pre,.content pre[class*=language-]{overflow-y:hidden}div[class*=language-] pre,div[class*=language-] pre[class*=language-]{position:static!important}div[class~=language-text]:before{content:"text"}div[class~=language-yml]:before{content:"yml"}div[class*=language-] pre{-webkit-user-select:text;-moz-user-select:text;user-select:text}p code{-webkit-user-select:all;-moz-user-select:all;user-select:all}@keyframes message-move-in{0%{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:translateY(0)}}#message-container .message.move-in{animation:message-move-in .3s ease-in-out}@keyframes message-move-out{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-100%)}}#message-container .message.move-out{animation:message-move-out .3s ease-in-out;animation-fill-mode:forwards}#message-container .message{background:#fff;margin:10px 0;padding:0 10px;height:40px;box-shadow:0 0 10px 0 #ccc;font-size:14px;border-radius:3px;display:flex;align-items:center;transition:height .2s ease-in-out,margin .2s ease-in-out}#message-container{position:fixed;left:0;top:100px;right:0;display:flex;flex-direction:column;align-items:center}#message-container .message .text{color:#333;padding:0 20px 0 5px}.theme-code-block[data-v-12e2413c]{display:none}.theme-code-block__active[data-v-12e2413c]{display:block}.theme-code-block>pre[data-v-12e2413c]{background-color:orange}@media (max-width:419px){.theme-code-group div[class*=language-][data-v-12e2413c]{margin:0}}.theme-mode-light[data-v-48123b87]{--bodyBg:#f4f4f4;--mainBg:#fff;--sidebarBg:hsla(0,0%,100%,0.8);--blurBg:hsla(0,0%,100%,0.9);--customBlockBg:#f1f1f1;--textColor:#00323c;--textLightenColor:#0085ad;--borderColor:rgba(0,0,0,0.12);--codeBg:#f6f6f6;--codeColor:#525252}.theme-mode-light code[class*=language-][data-v-48123b87],.theme-mode-light pre[class*=language-][data-v-48123b87]{color:#000;background:none;text-shadow:0 1px #fff;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;hyphens:none}.theme-mode-light code[class*=language-][data-v-48123b87]::-moz-selection,.theme-mode-light code[class*=language-][data-v-48123b87] ::-moz-selection,.theme-mode-light pre[class*=language-][data-v-48123b87]::-moz-selection,.theme-mode-light pre[class*=language-][data-v-48123b87] ::-moz-selection{text-shadow:none;background:#b3d4fc}.theme-mode-light code[class*=language-][data-v-48123b87]::selection,.theme-mode-light code[class*=language-][data-v-48123b87] ::selection,.theme-mode-light pre[class*=language-][data-v-48123b87]::selection,.theme-mode-light pre[class*=language-][data-v-48123b87] ::selection{text-shadow:none;background:#b3d4fc}@media print{.theme-mode-light code[class*=language-][data-v-48123b87],.theme-mode-light pre[class*=language-][data-v-48123b87]{text-shadow:none}}.theme-mode-light pre[class*=language-][data-v-48123b87]{padding:1em;margin:.5em 0;overflow:auto}.theme-mode-light :not(pre)>code[class*=language-][data-v-48123b87],.theme-mode-light pre[class*=language-][data-v-48123b87]{background:#f5f2f0}.theme-mode-light :not(pre)>code[class*=language-][data-v-48123b87]{padding:.1em;border-radius:.3em;white-space:normal}.theme-mode-light .token.cdata[data-v-48123b87],.theme-mode-light .token.comment[data-v-48123b87],.theme-mode-light .token.doctype[data-v-48123b87],.theme-mode-light .token.prolog[data-v-48123b87]{color:#708090}.theme-mode-light .token.punctuation[data-v-48123b87]{color:#999}.theme-mode-light .namespace[data-v-48123b87]{opacity:.7}.theme-mode-light .token.boolean[data-v-48123b87],.theme-mode-light .token.constant[data-v-48123b87],.theme-mode-light .token.deleted[data-v-48123b87],.theme-mode-light .token.number[data-v-48123b87],.theme-mode-light .token.property[data-v-48123b87],.theme-mode-light .token.symbol[data-v-48123b87],.theme-mode-light .token.tag[data-v-48123b87]{color:#905}.theme-mode-light .token.attr-name[data-v-48123b87],.theme-mode-light .token.builtin[data-v-48123b87],.theme-mode-light .token.char[data-v-48123b87],.theme-mode-light .token.inserted[data-v-48123b87],.theme-mode-light .token.selector[data-v-48123b87],.theme-mode-light .token.string[data-v-48123b87]{color:#690}.theme-mode-light .language-css .token.string[data-v-48123b87],.theme-mode-light .style .token.string[data-v-48123b87],.theme-mode-light .token.entity[data-v-48123b87],.theme-mode-light .token.operator[data-v-48123b87],.theme-mode-light .token.url[data-v-48123b87]{color:#9a6e3a;background:hsla(0,0%,100%,.5)}.theme-mode-light .token.atrule[data-v-48123b87],.theme-mode-light .token.attr-value[data-v-48123b87],.theme-mode-light .token.keyword[data-v-48123b87]{color:#07a}.theme-mode-light .token.class-name[data-v-48123b87],.theme-mode-light .token.function[data-v-48123b87]{color:#dd4a68}.theme-mode-light .token.important[data-v-48123b87],.theme-mode-light .token.regex[data-v-48123b87],.theme-mode-light .token.variable[data-v-48123b87]{color:#e90}.theme-mode-light .token.bold[data-v-48123b87],.theme-mode-light .token.important[data-v-48123b87]{font-weight:700}.theme-mode-light .token.italic[data-v-48123b87]{font-style:italic}.theme-mode-light .token.entity[data-v-48123b87]{cursor:help}.theme-mode-light div[class*=language-] .highlight-lines .highlighted[data-v-48123b87],.theme-mode-light div[class*=language-].line-numbers-mode .highlight-lines .highlighted[data-v-48123b87]:before{background-color:hsla(0,0%,78.4%,.4)}.theme-mode-dark[data-v-48123b87]{--bodyBg:#27272b;--mainBg:#1e1e22;--sidebarBg:rgba(30,30,34,0.8);--blurBg:rgba(30,30,34,0.8);--customBlockBg:#27272b;--textColor:#9b9baa;--textLightenColor:#0085ad;--borderColor:#30363d;--codeBg:#252526;--codeColor:#fff}.theme-mode-dark code[class*=language-][data-v-48123b87],.theme-mode-dark pre[class*=language-][data-v-48123b87]{color:#ccc;background:none;text-shadow:none;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;hyphens:none}.theme-mode-dark pre[class*=language-][data-v-48123b87]{padding:1em;margin:.5em 0;overflow:auto}.theme-mode-dark :not(pre)>code[class*=language-][data-v-48123b87],.theme-mode-dark pre[class*=language-][data-v-48123b87]{background:#2d2d2d}.theme-mode-dark :not(pre)>code[class*=language-][data-v-48123b87]{padding:.1em;border-radius:.3em;white-space:normal}.theme-mode-dark .token.block-comment[data-v-48123b87],.theme-mode-dark .token.cdata[data-v-48123b87],.theme-mode-dark .token.comment[data-v-48123b87],.theme-mode-dark .token.doctype[data-v-48123b87],.theme-mode-dark .token.prolog[data-v-48123b87]{color:#999}.theme-mode-dark .token.punctuation[data-v-48123b87]{color:#ccc}.theme-mode-dark .token.attr-name[data-v-48123b87],.theme-mode-dark .token.deleted[data-v-48123b87],.theme-mode-dark .token.namespace[data-v-48123b87],.theme-mode-dark .token.tag[data-v-48123b87]{color:#e2777a}.theme-mode-dark .token.function-name[data-v-48123b87]{color:#6196cc}.theme-mode-dark .token.boolean[data-v-48123b87],.theme-mode-dark .token.function[data-v-48123b87],.theme-mode-dark .token.number[data-v-48123b87]{color:#f08d49}.theme-mode-dark .token.class-name[data-v-48123b87],.theme-mode-dark .token.constant[data-v-48123b87],.theme-mode-dark .token.property[data-v-48123b87],.theme-mode-dark .token.symbol[data-v-48123b87]{color:#f8c555}.theme-mode-dark .token.atrule[data-v-48123b87],.theme-mode-dark .token.builtin[data-v-48123b87],.theme-mode-dark .token.important[data-v-48123b87],.theme-mode-dark .token.keyword[data-v-48123b87],.theme-mode-dark .token.selector[data-v-48123b87]{color:#cc99cd}.theme-mode-dark .token.attr-value[data-v-48123b87],.theme-mode-dark .token.char[data-v-48123b87],.theme-mode-dark .token.regex[data-v-48123b87],.theme-mode-dark .token.string[data-v-48123b87],.theme-mode-dark .token.variable[data-v-48123b87]{color:#7ec699}.theme-mode-dark .token.entity[data-v-48123b87],.theme-mode-dark .token.operator[data-v-48123b87],.theme-mode-dark .token.url[data-v-48123b87]{color:#67cdcc}.theme-mode-dark .language-css .token.string[data-v-48123b87],.theme-mode-dark .style .token.string[data-v-48123b87],.theme-mode-dark .token.entity[data-v-48123b87],.theme-mode-dark .token.operator[data-v-48123b87],.theme-mode-dark .token.url[data-v-48123b87]{background:none}.theme-mode-dark .token.bold[data-v-48123b87],.theme-mode-dark .token.important[data-v-48123b87]{font-weight:700}.theme-mode-dark .token.italic[data-v-48123b87]{font-style:italic}.theme-mode-dark .token.entity[data-v-48123b87]{cursor:help}.theme-mode-dark .token.inserted[data-v-48123b87]{color:green}.theme-mode-read[data-v-48123b87]{--bodyBg:#ececcc;--mainBg:#f5f5d5;--sidebarBg:rgba(245,245,213,0.8);--blurBg:rgba(245,245,213,0.9);--customBlockBg:#ececcc;--textColor:#704214;--textLightenColor:#963;--borderColor:rgba(0,0,0,0.15);--codeBg:#282c34;--codeColor:#fff}.theme-mode-read code[class*=language-][data-v-48123b87],.theme-mode-read pre[class*=language-][data-v-48123b87]{color:#ccc;background:none;text-shadow:none;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;hyphens:none}.theme-mode-read pre[class*=language-][data-v-48123b87]{padding:1em;margin:.5em 0;overflow:auto}.theme-mode-read :not(pre)>code[class*=language-][data-v-48123b87],.theme-mode-read pre[class*=language-][data-v-48123b87]{background:#2d2d2d}.theme-mode-read :not(pre)>code[class*=language-][data-v-48123b87]{padding:.1em;border-radius:.3em;white-space:normal}.theme-mode-read .token.block-comment[data-v-48123b87],.theme-mode-read .token.cdata[data-v-48123b87],.theme-mode-read .token.comment[data-v-48123b87],.theme-mode-read .token.doctype[data-v-48123b87],.theme-mode-read .token.prolog[data-v-48123b87]{color:#999}.theme-mode-read .token.punctuation[data-v-48123b87]{color:#ccc}.theme-mode-read .token.attr-name[data-v-48123b87],.theme-mode-read .token.deleted[data-v-48123b87],.theme-mode-read .token.namespace[data-v-48123b87],.theme-mode-read .token.tag[data-v-48123b87]{color:#e2777a}.theme-mode-read .token.function-name[data-v-48123b87]{color:#6196cc}.theme-mode-read .token.boolean[data-v-48123b87],.theme-mode-read .token.function[data-v-48123b87],.theme-mode-read .token.number[data-v-48123b87]{color:#f08d49}.theme-mode-read .token.class-name[data-v-48123b87],.theme-mode-read .token.constant[data-v-48123b87],.theme-mode-read .token.property[data-v-48123b87],.theme-mode-read .token.symbol[data-v-48123b87]{color:#f8c555}.theme-mode-read .token.atrule[data-v-48123b87],.theme-mode-read .token.builtin[data-v-48123b87],.theme-mode-read .token.important[data-v-48123b87],.theme-mode-read .token.keyword[data-v-48123b87],.theme-mode-read .token.selector[data-v-48123b87]{color:#cc99cd}.theme-mode-read .token.attr-value[data-v-48123b87],.theme-mode-read .token.char[data-v-48123b87],.theme-mode-read .token.regex[data-v-48123b87],.theme-mode-read .token.string[data-v-48123b87],.theme-mode-read .token.variable[data-v-48123b87]{color:#7ec699}.theme-mode-read .token.entity[data-v-48123b87],.theme-mode-read .token.operator[data-v-48123b87],.theme-mode-read .token.url[data-v-48123b87]{color:#67cdcc}.theme-mode-read .language-css .token.string[data-v-48123b87],.theme-mode-read .style .token.string[data-v-48123b87],.theme-mode-read .token.entity[data-v-48123b87],.theme-mode-read .token.operator[data-v-48123b87],.theme-mode-read .token.url[data-v-48123b87]{background:none}.theme-mode-read .token.bold[data-v-48123b87],.theme-mode-read .token.important[data-v-48123b87]{font-weight:700}.theme-mode-read .token.italic[data-v-48123b87]{font-style:italic}.theme-mode-read .token.entity[data-v-48123b87]{cursor:help}.theme-mode-read .token.inserted[data-v-48123b87]{color:green}.theme-style-line.theme-mode-light[data-v-48123b87]{--bodyBg:#fff}.theme-style-line.theme-mode-dark[data-v-48123b87]{--bodyBg:#1e1e22}.theme-style-line.theme-mode-read[data-v-48123b87]{--bodyBg:#f5f5d5}.theme-code-group[data-v-48123b87],.theme-code-group__nav[data-v-48123b87]{background-color:var(--codeBg);padding-bottom:22px;border-radius:6px;padding-left:10px;padding-top:10px}.theme-code-group__nav[data-v-48123b87]{margin-bottom:-35px}.theme-code-group__ul[data-v-48123b87]{margin:auto 0;padding-left:0;display:inline-flex;list-style:none}.theme-code-group__li[data-v-48123b87],.theme-code-group__nav-tab[data-v-48123b87]{border:0;padding:5px;cursor:pointer;background-color:transparent;font-size:.85em;line-height:1.4;color:var(--codeColor);font-weight:600;opacity:.85}.theme-code-group__nav-tab-active[data-v-48123b87]{border-bottom:1px solid #11a8cd;opacity:1}.pre-blank[data-v-48123b87]{color:#11a8cd}body .theme-vdoing-content code{color:var(--textLightenColor);padding:.25rem .5rem;margin:0;font-size:.9em;background-color:hsla(0,0%,39.2%,.08);border-radius:3px}body .theme-vdoing-content code .token.deleted{color:#ec5975}body .theme-vdoing-content code .token.inserted{color:#11a8cd}body .theme-vdoing-content pre,body .theme-vdoing-content pre[class*=language-]{line-height:1.4;padding:1.25rem 1.5rem;margin:.85rem 0;background-color:#282c34;border-radius:6px;overflow:auto}body .theme-vdoing-content pre[class*=language-] code,body .theme-vdoing-content pre code{color:var(--codeColor);padding:0;background-color:transparent;border-radius:0}div[class*=language-]{position:relative;background-color:var(--codeBg);border-radius:6px}div[class*=language-] .highlight-lines{-webkit-user-select:none;user-select:none;padding-top:1.3rem;position:absolute;top:0;left:0;width:100%;line-height:1.4}div[class*=language-] .highlight-lines .highlighted{background-color:rgba(0,0,0,.3)}div[class*=language-] pre,div[class*=language-] pre[class*=language-]{background:transparent;position:relative!important;z-index:1}div[class*=language-]:before{position:absolute;z-index:3;top:.8em;right:1em;font-size:.8rem;color:hsla(0,0%,58.8%,.7)}div[class*=language-]:not(.line-numbers-mode) .line-numbers-wrapper{display:none}div[class*=language-].line-numbers-mode .highlight-lines .highlighted{position:relative}div[class*=language-].line-numbers-mode .highlight-lines .highlighted:before{content:" ";position:absolute;z-index:3;left:0;top:0;display:block;width:2.5rem;height:100%;background-color:rgba(0,0,0,.3)}div[class*=language-].line-numbers-mode pre{padding-left:3.5rem;vertical-align:middle}div[class*=language-].line-numbers-mode .line-numbers-wrapper{position:absolute;top:0;width:2.5rem;text-align:center;color:hsla(0,0%,49.8%,.5);padding:1.25rem 0;line-height:1.4}div[class*=language-].line-numbers-mode .line-numbers-wrapper br{-webkit-user-select:none;user-select:none}div[class*=language-].line-numbers-mode .line-numbers-wrapper .line-number{position:relative;z-index:4;-webkit-user-select:none;user-select:none;font-size:.85em}div[class*=language-].line-numbers-mode:after{content:"";position:absolute;z-index:2;top:0;left:0;width:2.5rem;height:100%;border-radius:6px 0 0 6px;border-right:1px solid var(--borderColor);background-color:var(--codeBg)}div[class~=language-js]:before{content:"js"}div[class~=language-ts]:before{content:"ts"}div[class~=language-html]:before{content:"html"}div[class~=language-md]:before{content:"md"}div[class~=language-vue]:before{content:"vue"}div[class~=language-css]:before{content:"css"}div[class~=language-sass]:before{content:"sass"}div[class~=language-scss]:before{content:"scss"}div[class~=language-less]:before{content:"less"}div[class~=language-stylus]:before{content:"stylus"}div[class~=language-go]:before{content:"go"}div[class~=language-java]:before{content:"java"}div[class~=language-c]:before{content:"c"}div[class~=language-sh]:before{content:"sh"}div[class~=language-yaml]:before{content:"yaml"}div[class~=language-py]:before{content:"py"}div[class~=language-docker]:before{content:"docker"}div[class~=language-dockerfile]:before{content:"dockerfile"}div[class~=language-makefile]:before{content:"makefile"}div[class~=language-javascript]:before{content:"js"}div[class~=language-typescript]:before{content:"ts"}div[class~=language-markup]:before{content:"html"}div[class~=language-markdown]:before{content:"md"}div[class~=language-json]:before{content:"json"}div[class~=language-ruby]:before{content:"rb"}div[class~=language-python]:before{content:"py"}div[class~=language-bash]:before{content:"sh"}div[class~=language-php]:before{content:"php"}.custom-block .custom-block-title{font-weight:600;margin-bottom:.2rem}.custom-block p{margin:0}.custom-block.danger,.custom-block.note,.custom-block.tip,.custom-block.warning{padding:.5rem 1.5rem;border-left-width:.5rem;border-left-style:solid;margin:1rem 0}.custom-block.tip{background-color:#f3f5f7;border-color:#42b983;color:#215d42}.custom-block.warning{background-color:#fff7d0;border-color:#e7c000;color:#6b5900}.custom-block.warning .custom-block-title{color:#b29400}.custom-block.warning a{color:var(--textColor)}.custom-block.danger{background-color:#ffe6e6;border-color:#c00;color:#4d0000}.custom-block.danger .custom-block-title{color:#900}.custom-block.danger a{color:var(--textColor)}.custom-block.note{background-color:#e8f5fa;border-color:#157bae;color:#0d4a68}.custom-block.right{color:var(--textColor);font-size:.9rem;text-align:right}.custom-block.theorem{margin:1rem 0;padding:.8rem 1.5rem;border-radius:2px;background-color:var(--customBlockBg)}.custom-block.theorem .title{font-weight:700;margin:.5rem 0}.custom-block.details{display:block;position:relative;border-radius:2px;margin:1em 0;padding:1.6em;background-color:var(--customBlockBg)}.custom-block.details p{margin:.8rem 0}.custom-block.details h4{margin-top:0}.custom-block.details figure:last-child,.custom-block.details p:last-child{margin-bottom:0;padding-bottom:0}.custom-block.details summary{outline:none;cursor:pointer}.custom-block.details summary:hover{color:#11a8cd}.theme-mode-dark .custom-block.warning{background-color:rgba(255,247,208,.2);color:#e7c000}.theme-mode-dark .custom-block.warning .custom-block-title{color:#ffdc2f}.theme-mode-dark .custom-block.tip{background-color:rgba(243,245,247,.2);color:#42b983}.theme-mode-dark .custom-block.danger{background-color:rgba(255,230,230,.4);color:maroon}.theme-mode-dark .custom-block.danger a{color:#11a8cd}.theme-mode-dark .custom-block.note{background-color:rgba(243,245,247,.2);color:#157bae}.arrow{display:inline-block;width:0;height:0}.arrow.up{border-bottom:6px solid #ccc}.arrow.down,.arrow.up{border-left:4px solid transparent;border-right:4px solid transparent}.arrow.down{border-top:6px solid #ccc}.arrow.right{border-left:6px solid #ccc}.arrow.left,.arrow.right{border-top:4px solid transparent;border-bottom:4px solid transparent}.arrow.left{border-right:6px solid #ccc}.theme-vdoing-content:not(.custom){max-width:860px}.table-of-contents .badge{vertical-align:middle}.center-container{text-align:center}.center-container>h1,.center-container>h2,.center-container>h3,.center-container>h4,.center-container>h5,.center-container>h6{margin-top:-3.1rem;padding-top:4.6rem;margin-bottom:0}.center-container>h1 a.header-anchor,.center-container>h2 a.header-anchor,.center-container>h3 a.header-anchor,.center-container>h4 a.header-anchor,.center-container>h5 a.header-anchor,.center-container>h6 a.header-anchor{float:none;padding-right:0;margin-left:-.9rem}.cardListContainer{margin:.7rem 0}.cardListContainer>:not(.card-list){display:none}.cardListContainer .card-list{margin:-.35rem;display:flex;flex-wrap:wrap;align-items:flex-start}.cardListContainer .card-list .card-item{width:calc(33.33333% - .7rem);margin:.35rem;background:var(--bodyBg);border-radius:3px;color:var(--textColor);display:flex;box-shadow:1px 1px 2px 0 rgba(0,0,0,.06);transition:all .4s}.cardListContainer .card-list .card-item:hover{text-decoration:none;box-shadow:0 10px 20px -10px var(--randomColor,rgba(0,0,0,.15));transform:translateY(-3px) scale(1.01)}.cardListContainer .card-list .card-item:hover img{box-shadow:3px 2px 7px rgba(0,0,0,.15)}.cardListContainer .card-list .card-item:hover div p{text-shadow:3px 2px 5px rgba(0,0,0,.15)}.cardListContainer .card-list .card-item img{width:60px;height:60px;border-radius:50%;border:2px solid #fff;margin:1rem 0 1rem 1rem;box-shadow:3px 2px 5px rgba(0,0,0,.08);transition:all .4s}.cardListContainer .card-list .card-item div{flex:1;display:inline-block;float:right;padding:1rem 0}.cardListContainer .card-list .card-item div p{margin:0;padding:0 1rem;transition:text-shadow .4s;text-align:center}.cardListContainer .card-list .card-item div .name{margin:.2rem 0 .3rem}.cardListContainer .card-list .card-item div .desc{font-size:.8rem;line-height:1.1rem;opacity:.8;margin-bottom:.2rem}.cardListContainer .card-list .card-item.row-1{width:calc(100% - .7rem)}.cardListContainer .card-list .card-item.row-1 img{margin-left:2rem}.cardListContainer .card-list .card-item.row-2{width:calc(50% - .7rem)}.cardListContainer .card-list .card-item.row-2 img{margin-left:1.5rem}.cardListContainer .card-list .card-item.row-3{width:calc(33.33333% - .7rem)}.cardListContainer .card-list .card-item.row-4{width:calc(25% - .7rem)}.cardImgListContainer{margin:1rem 0}.cardImgListContainer>:not(.card-list){display:none}.cardImgListContainer .card-list{margin:-.5rem;display:flex;flex-wrap:wrap;align-items:flex-start}.cardImgListContainer .card-list .card-item{width:calc(33.33333% - 1rem);margin:.5rem;background:var(--mainBg);border:1px solid rgba(0,0,0,.1);box-sizing:border-box;border-radius:3px;overflow:hidden;color:var(--textColor);box-shadow:2px 2px 10px rgba(0,0,0,.04);display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;align-content:stretch;transition:all .4s}.cardImgListContainer .card-list .card-item:hover{box-shadow:1px 1px 20px rgba(0,0,0,.1);transform:translateY(-3px)}.cardImgListContainer .card-list .card-item .box-img{overflow:hidden;position:relative;background:#eee}.cardImgListContainer .card-list .card-item .box-img img{display:block;width:100%;height:100%;transition:all .3s}.cardImgListContainer .card-list .card-item a{color:var(--textColor);transition:color .3s}.cardImgListContainer .card-list .card-item a:hover{text-decoration:none}.cardImgListContainer .card-list .card-item .box-info{padding:.8rem 1rem}.cardImgListContainer .card-list .card-item .box-info p{margin:0}.cardImgListContainer .card-list .card-item .box-info .desc{margin-top:.3rem;opacity:.8;font-size:.9rem;line-height:1.1rem;overflow:hidden;white-space:normal;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical}.cardImgListContainer .card-list .card-item .box-footer{overflow:hidden;padding:.8rem 1rem;border-top:1px solid rgba(0,0,0,.1)}.cardImgListContainer .card-list .card-item .box-footer img{width:1.8rem;height:1.8rem;border-radius:50%;float:left}.cardImgListContainer .card-list .card-item .box-footer span{line-height:1.8rem;float:left;margin-left:.6rem;font-size:.8rem}.cardImgListContainer .card-list .card-item.row-1{width:calc(100% - 1rem)}.cardImgListContainer .card-list .card-item.row-2{width:calc(50% - 1rem)}.cardImgListContainer .card-list .card-item.row-3{width:calc(33.33333% - 1rem)}.cardImgListContainer .card-list .card-item.row-4{width:calc(25% - 1rem)}.theme-mode-dark .cardImgListContainer .card-list .card-item,.theme-mode-dark .cardImgListContainer .card-list .card-item .box-footer{border-color:var(--borderColor)}@media (max-width:900px){.cardListContainer .card-list .card-item.row-4{width:calc(33.33333% - .7rem)}.cardImgListContainer .card-list .card-item.row-4{width:calc(33.33333% - 1rem)}}@media (max-width:720px){.cardListContainer .card-list .card-item.row-3,.cardListContainer .card-list .card-item.row-4{width:calc(50% - .7rem)}.cardListContainer .card-list .card-item.row-3 img,.cardListContainer .card-list .card-item.row-4 img{margin-left:1.5rem}.cardImgListContainer .card-list .card-item.row-3,.cardImgListContainer .card-list .card-item.row-4{width:calc(50% - 1rem)}}@media (max-width:500px){.cardListContainer .card-list .card-item.row-1,.cardListContainer .card-list .card-item.row-2,.cardListContainer .card-list .card-item.row-3,.cardListContainer .card-list .card-item.row-4{width:calc(100% - .7rem)}.cardListContainer .card-list .card-item.row-1 img,.cardListContainer .card-list .card-item.row-2 img,.cardListContainer .card-list .card-item.row-3 img,.cardListContainer .card-list .card-item.row-4 img{margin-left:1.5rem}.cardImgListContainer .card-list .card-item.row-1,.cardImgListContainer .card-list .card-item.row-2,.cardImgListContainer .card-list .card-item.row-3,.cardImgListContainer .card-list .card-item.row-4{width:calc(100% - 1rem)}}body,html{padding:0;margin:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-tap-highlight-color:transparent;font-size:16px;color:#2c3e50;background:var(--bodyBg)}a,button,input{outline:none;-webkit-tap-highlight-color:rgba(255,255,255,0);-webkit-focus-ring-color:transparent}@media (min-width:719px){::-webkit-scrollbar{width:6px;height:5px}::-webkit-scrollbar-track-piece{background-color:rgba(0,0,0,.15);-webkit-border-radius:3px}::-webkit-scrollbar-thumb:vertical{height:5px;background-color:rgba(0,0,0,.28);-webkit-border-radius:3px}::-webkit-scrollbar-thumb:horizontal{width:5px;background-color:rgba(0,0,0,.28);-webkit-border-radius:3px}}.card-box{border-radius:5px;background:var(--mainBg);box-shadow:0 0 4px 0 rgba(0,0,0,.1);transition:box-shadow .5s}.card-box:hover{box-shadow:0 1px 15px 0 rgba(0,0,0,.1)}@media (max-width:719px){.theme-style-line{margin-left:-1px;margin-right:-1px}}.theme-style-line .card-box{box-shadow:0 0;border:1px solid var(--borderColor)}.blur{-webkit-backdrop-filter:saturate(200%) blur(20px);backdrop-filter:saturate(200%) blur(20px)}.custom-page{min-height:calc(100vh - 3.6rem);padding-top:3.6rem;padding-bottom:.9rem}.custom-page .theme-vdoing-wrapper{margin:0 auto}body .search-box input{background-color:transparent;color:var(--textColor);border:1px solid var(--borderColor,#ccc)}@media (max-width:959px){body .search-box input{border-color:transparent}}.page{transition:padding .2s ease;padding-left:.8rem}.navbar{position:fixed;z-index:20;top:0;left:0;right:0;height:3.6rem;background-color:var(--blurBg);box-sizing:border-box;box-shadow:0 2px 5px rgba(0,0,0,.06)}.sidebar-mask{top:0;width:100vw;height:100vh}.sidebar-hover-trigger,.sidebar-mask{position:fixed;z-index:12;left:0;display:none}.sidebar-hover-trigger{top:8.1rem;bottom:0;width:24px}.sidebar{font-size:16px;background-color:var(--sidebarBg);width:18rem;position:fixed;z-index:13;margin:0;top:3.6rem;left:0;bottom:0;box-sizing:border-box;border-right:1px solid var(--borderColor);overflow-y:auto;transform:translateX(-100%);transition:transform .2s}@media (max-width:719px){.sidebar{background-color:var(--mainBg)}}.theme-vdoing-content:not(.custom){word-wrap:break-word}.theme-vdoing-content:not(.custom) a:hover{text-decoration:underline}.theme-vdoing-content:not(.custom) p.demo{padding:1rem 1.5rem;border:1px solid #ddd;border-radius:4px}.theme-vdoing-content:not(.custom) img{max-width:100%}.theme-vdoing-content.custom{padding:0;margin:0}.theme-vdoing-content.custom img{max-width:100%}a{font-weight:500;text-decoration:none}a,p a code{color:#11a8cd}p a code{font-weight:400}kbd{background:#eee;border:.15rem solid #ddd;border-bottom:.25rem solid #ddd;border-radius:.15rem;padding:0 .15em}blockquote{font-size:1rem;opacity:.75;border-left:.2rem solid hsla(0,0%,39.2%,.3);margin:1rem 0;padding:.25rem 0 .25rem 1rem}blockquote>p{margin:0}ol,ul{padding-left:1.2em}strong{font-weight:600}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.25}.theme-vdoing-content:not(.custom)>h1,.theme-vdoing-content:not(.custom)>h2,.theme-vdoing-content:not(.custom)>h3,.theme-vdoing-content:not(.custom)>h4,.theme-vdoing-content:not(.custom)>h5,.theme-vdoing-content:not(.custom)>h6{margin-top:-3.1rem;padding-top:4.6rem;margin-bottom:0}.theme-vdoing-content:not(.custom)>h1:first-child,.theme-vdoing-content:not(.custom)>h2:first-child,.theme-vdoing-content:not(.custom)>h3:first-child,.theme-vdoing-content:not(.custom)>h4:first-child,.theme-vdoing-content:not(.custom)>h5:first-child,.theme-vdoing-content:not(.custom)>h6:first-child{margin-bottom:1rem}.theme-vdoing-content:not(.custom)>h1:first-child+.custom-block,.theme-vdoing-content:not(.custom)>h1:first-child+p,.theme-vdoing-content:not(.custom)>h1:first-child+pre,.theme-vdoing-content:not(.custom)>h2:first-child+.custom-block,.theme-vdoing-content:not(.custom)>h2:first-child+p,.theme-vdoing-content:not(.custom)>h2:first-child+pre,.theme-vdoing-content:not(.custom)>h3:first-child+.custom-block,.theme-vdoing-content:not(.custom)>h3:first-child+p,.theme-vdoing-content:not(.custom)>h3:first-child+pre,.theme-vdoing-content:not(.custom)>h4:first-child+.custom-block,.theme-vdoing-content:not(.custom)>h4:first-child+p,.theme-vdoing-content:not(.custom)>h4:first-child+pre,.theme-vdoing-content:not(.custom)>h5:first-child+.custom-block,.theme-vdoing-content:not(.custom)>h5:first-child+p,.theme-vdoing-content:not(.custom)>h5:first-child+pre,.theme-vdoing-content:not(.custom)>h6:first-child+.custom-block,.theme-vdoing-content:not(.custom)>h6:first-child+p,.theme-vdoing-content:not(.custom)>h6:first-child+pre{margin-top:2rem}h1:focus .header-anchor,h1:hover .header-anchor,h2:focus .header-anchor,h2:hover .header-anchor,h3:focus .header-anchor,h3:hover .header-anchor,h4:focus .header-anchor,h4:hover .header-anchor,h5:focus .header-anchor,h5:hover .header-anchor,h6:focus .header-anchor,h6:hover .header-anchor{opacity:1}.theme-vdoing-content:not(.custom)>.custom-block:first-child,.theme-vdoing-content:not(.custom)>p:first-child,.theme-vdoing-content:not(.custom)>pre:first-child{margin-top:2rem}h1{font-size:1.9rem}.theme-vdoing-content:not(.custom)>h1:first-child{display:none}h2{font-size:1.5rem;padding-bottom:.3rem;border-bottom:1px solid var(--borderColor)}h3{font-size:1.35rem}.page h4{font-size:1.25rem}.page h5{font-size:1.15rem}.page h6{font-size:1.05rem}a.header-anchor{font-size:.85em;float:left;margin-left:-.87em;padding-right:.23em;margin-top:.125em;opacity:0}a.header-anchor:focus,a.header-anchor:hover{text-decoration:none}.line-number,code,kbd{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}ol,p,ul{line-height:1.7}hr{border:0;border-top:1px solid var(--borderColor)}table{border-collapse:collapse;margin:1rem 0;overflow-x:auto;width:100%;display:inline-table}@media (max-width:719px){table{display:block}}tr{border-top:1px solid var(--borderColor)}tr:nth-child(2n){background-color:hsla(0,0%,58.8%,.1)}td,th{border:1px solid var(--borderColor);padding:.6em 1em}@media (max-width:719px){td,th{padding:.3em .5em}}td a,th a{word-break:break-all}.theme-container{color:var(--textColor);min-height:100vh}.theme-container.sidebar-open .sidebar-mask{display:block}.theme-container.no-navbar .theme-vdoing-content:not(.custom)>h1,.theme-container.no-navbar h2,.theme-container.no-navbar h3,.theme-container.no-navbar h4,.theme-container.no-navbar h5,.theme-container.no-navbar h6{margin-top:1.5rem;padding-top:0}.theme-container.no-navbar .sidebar{top:0}@media (min-width:720px){.theme-container.no-sidebar .sidebar{display:none}.theme-container.no-sidebar .page{padding-left:0}}@media (max-width:959px){.sidebar{font-size:15px}}@media (max-width:719px){.sidebar{width:17.099999999999998rem}}@media (min-width:720px) and (max-width:959px){.sidebar{width:16.2rem}.theme-container.sidebar-open .page{padding-left:17rem!important}}@media (max-width:719px){.sidebar{top:0;height:100vh;padding-top:3.6rem;transform:translateX(-100%);transition:transform .2s ease}.page{padding-left:0}.theme-container.sidebar-open .sidebar{transform:translateX(0)}.theme-container.sidebar-open .sidebar-mask{display:block}.theme-container.no-navbar .sidebar{padding-top:0}}@media (max-width:419px){h1{font-size:1.9rem}.theme-vdoing-content div[class*=language-]{margin:.85rem -1.5rem;border-radius:0}}@media (min-width:720px){.theme-container .sidebar-hover-trigger{display:block}.theme-container .sidebar-hover-trigger:hover~.sidebar,.theme-container:not(.sidebar-open) .sidebar-hover-trigger~.sidebar:hover{transform:translateX(0);z-index:100}.theme-container.sidebar-open .sidebar-mask{display:none}.theme-container.sidebar-open .sidebar{transform:translateX(0)}.theme-container.sidebar-open .sidebar-button{left:18rem}.theme-container.sidebar-open .page{padding-left:18.8rem;padding-right:.8rem}.theme-container.sidebar-open .sidebar-hover-trigger{display:none}.theme-container.have-rightmenu .page{padding-right:250px}.theme-container.no-sidebar .page{padding-left:0!important}.theme-container.no-sidebar .sidebar-hover-trigger{display:none}.theme-container.hide-navbar .sidebar-hover-trigger{top:4.5rem}.theme-container.hide-navbar .sidebar{top:0}.theme-container.no-sidebar .sidebar-button{display:none}}@media print{.buttons,.navbar,.sidebar{display:none}.page{padding-top:0!important}}@media (min-width:720px) and (max-width:959px){.theme-container.sidebar-open:not(.on-sidebar) .sidebar-button{left:12.6rem}}.gt-container .gt-ico-tip:after{content:"。( Win + . ) or ( ⌃ + ⌘ + ␣ ) open Emoji";color:#999}.gt-container .gt-meta{border-color:var(--borderColor)!important}.gt-container .gt-comments-null{color:var(--textColor);opacity:.5}.gt-container .gt-header-textarea{color:var(--textColor);background:hsla(0,0%,70.6%,.1)!important}.gt-container .gt-btn{border-color:#11a8cd!important;background-color:#11a8cd!important}.gt-container .gt-btn-preview{background-color:hsla(0,0%,100%,0)!important;color:#11a8cd!important}.gt-container a{color:#11a8cd!important}.gt-container .gt-svg svg{fill:#11a8cd!important}.gt-container .gt-comment-admin .gt-comment-content,.gt-container .gt-comment-content{background-color:hsla(0,0%,58.8%,.1)!important}.gt-container .gt-comment-admin .gt-comment-content:hover,.gt-container .gt-comment-content:hover{box-shadow:0 0 25px hsla(0,0%,58.8%,.5)!important}.gt-container .gt-comment-admin .gt-comment-content .gt-comment-body,.gt-container .gt-comment-content .gt-comment-body{color:var(--textColor)!important}.qq{position:relative}.qq:after{content:"可撩";background:#11a8cd;color:#fff;padding:0 5px;border-radius:10px;font-size:12px;position:absolute;top:-4px;right:-35px;transform:scale(.85)}body .vuepress-plugin-demo-block__wrapper,body .vuepress-plugin-demo-block__wrapper .vuepress-plugin-demo-block__display{border-color:hsla(0,0%,62.7%,.3)}body .vuepress-plugin-demo-block__wrapper .vuepress-plugin-demo-block__footer:hover .vuepress-plugin-demo-block__expand:before{border-top-color:#11a8cd!important;border-bottom-color:#11a8cd!important}body .vuepress-plugin-demo-block__wrapper .vuepress-plugin-demo-block__footer:hover svg{fill:#11a8cd!important}.suggestions{overflow:auto;max-height:calc(100vh - 6rem)}@media (max-width:719px){.suggestions{width:90vw;min-width:90vw!important;margin-right:-20px}}.suggestions .highlight{color:#11a8cd;font-weight:700}#nprogress{pointer-events:none}#nprogress .bar{background:#11a8cd;position:fixed;z-index:1031;top:0;left:0;width:100%;height:2px}#nprogress .peg{display:block;position:absolute;right:0;width:100px;height:100%;box-shadow:0 0 10px #11a8cd,0 0 5px #11a8cd;opacity:1;transform:rotate(3deg) translateY(-4px)}#nprogress .spinner{display:block;position:fixed;z-index:1031;top:15px;right:15px}#nprogress .spinner-icon{width:18px;height:18px;box-sizing:border-box;border-color:#11a8cd transparent transparent #11a8cd;border-style:solid;border-width:2px;border-radius:50%;animation:nprogress-spinner .4s linear infinite}.nprogress-custom-parent{overflow:hidden;position:relative}.nprogress-custom-parent #nprogress .bar,.nprogress-custom-parent #nprogress .spinner{position:absolute}@keyframes nprogress-spinner{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.icon.outbound{color:#aaa;display:inline-block;vertical-align:middle;position:relative;top:-1px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.theme-mode-light[data-v-76f36478]{--bodyBg:#f4f4f4;--mainBg:#fff;--sidebarBg:hsla(0,0%,100%,0.8);--blurBg:hsla(0,0%,100%,0.9);--customBlockBg:#f1f1f1;--textColor:#00323c;--textLightenColor:#0085ad;--borderColor:rgba(0,0,0,0.12);--codeBg:#f6f6f6;--codeColor:#525252}.theme-mode-light code[class*=language-][data-v-76f36478],.theme-mode-light pre[class*=language-][data-v-76f36478]{color:#000;background:none;text-shadow:0 1px #fff;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;hyphens:none}.theme-mode-light code[class*=language-][data-v-76f36478]::-moz-selection,.theme-mode-light code[class*=language-][data-v-76f36478] ::-moz-selection,.theme-mode-light pre[class*=language-][data-v-76f36478]::-moz-selection,.theme-mode-light pre[class*=language-][data-v-76f36478] ::-moz-selection{text-shadow:none;background:#b3d4fc}.theme-mode-light code[class*=language-][data-v-76f36478]::selection,.theme-mode-light code[class*=language-][data-v-76f36478] ::selection,.theme-mode-light pre[class*=language-][data-v-76f36478]::selection,.theme-mode-light pre[class*=language-][data-v-76f36478] ::selection{text-shadow:none;background:#b3d4fc}@media print{.theme-mode-light code[class*=language-][data-v-76f36478],.theme-mode-light pre[class*=language-][data-v-76f36478]{text-shadow:none}}.theme-mode-light pre[class*=language-][data-v-76f36478]{padding:1em;margin:.5em 0;overflow:auto}.theme-mode-light :not(pre)>code[class*=language-][data-v-76f36478],.theme-mode-light pre[class*=language-][data-v-76f36478]{background:#f5f2f0}.theme-mode-light :not(pre)>code[class*=language-][data-v-76f36478]{padding:.1em;border-radius:.3em;white-space:normal}.theme-mode-light .token.cdata[data-v-76f36478],.theme-mode-light .token.comment[data-v-76f36478],.theme-mode-light .token.doctype[data-v-76f36478],.theme-mode-light .token.prolog[data-v-76f36478]{color:#708090}.theme-mode-light .token.punctuation[data-v-76f36478]{color:#999}.theme-mode-light .namespace[data-v-76f36478]{opacity:.7}.theme-mode-light .token.boolean[data-v-76f36478],.theme-mode-light .token.constant[data-v-76f36478],.theme-mode-light .token.deleted[data-v-76f36478],.theme-mode-light .token.number[data-v-76f36478],.theme-mode-light .token.property[data-v-76f36478],.theme-mode-light .token.symbol[data-v-76f36478],.theme-mode-light .token.tag[data-v-76f36478]{color:#905}.theme-mode-light .token.attr-name[data-v-76f36478],.theme-mode-light .token.builtin[data-v-76f36478],.theme-mode-light .token.char[data-v-76f36478],.theme-mode-light .token.inserted[data-v-76f36478],.theme-mode-light .token.selector[data-v-76f36478],.theme-mode-light .token.string[data-v-76f36478]{color:#690}.theme-mode-light .language-css .token.string[data-v-76f36478],.theme-mode-light .style .token.string[data-v-76f36478],.theme-mode-light .token.entity[data-v-76f36478],.theme-mode-light .token.operator[data-v-76f36478],.theme-mode-light .token.url[data-v-76f36478]{color:#9a6e3a;background:hsla(0,0%,100%,.5)}.theme-mode-light .token.atrule[data-v-76f36478],.theme-mode-light .token.attr-value[data-v-76f36478],.theme-mode-light .token.keyword[data-v-76f36478]{color:#07a}.theme-mode-light .token.class-name[data-v-76f36478],.theme-mode-light .token.function[data-v-76f36478]{color:#dd4a68}.theme-mode-light .token.important[data-v-76f36478],.theme-mode-light .token.regex[data-v-76f36478],.theme-mode-light .token.variable[data-v-76f36478]{color:#e90}.theme-mode-light .token.bold[data-v-76f36478],.theme-mode-light .token.important[data-v-76f36478]{font-weight:700}.theme-mode-light .token.italic[data-v-76f36478]{font-style:italic}.theme-mode-light .token.entity[data-v-76f36478]{cursor:help}.theme-mode-light div[class*=language-] .highlight-lines .highlighted[data-v-76f36478],.theme-mode-light div[class*=language-].line-numbers-mode .highlight-lines .highlighted[data-v-76f36478]:before{background-color:hsla(0,0%,78.4%,.4)}.theme-mode-dark[data-v-76f36478]{--bodyBg:#27272b;--mainBg:#1e1e22;--sidebarBg:rgba(30,30,34,0.8);--blurBg:rgba(30,30,34,0.8);--customBlockBg:#27272b;--textColor:#9b9baa;--textLightenColor:#0085ad;--borderColor:#30363d;--codeBg:#252526;--codeColor:#fff}.theme-mode-dark code[class*=language-][data-v-76f36478],.theme-mode-dark pre[class*=language-][data-v-76f36478]{color:#ccc;background:none;text-shadow:none;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;hyphens:none}.theme-mode-dark pre[class*=language-][data-v-76f36478]{padding:1em;margin:.5em 0;overflow:auto}.theme-mode-dark :not(pre)>code[class*=language-][data-v-76f36478],.theme-mode-dark pre[class*=language-][data-v-76f36478]{background:#2d2d2d}.theme-mode-dark :not(pre)>code[class*=language-][data-v-76f36478]{padding:.1em;border-radius:.3em;white-space:normal}.theme-mode-dark .token.block-comment[data-v-76f36478],.theme-mode-dark .token.cdata[data-v-76f36478],.theme-mode-dark .token.comment[data-v-76f36478],.theme-mode-dark .token.doctype[data-v-76f36478],.theme-mode-dark .token.prolog[data-v-76f36478]{color:#999}.theme-mode-dark .token.punctuation[data-v-76f36478]{color:#ccc}.theme-mode-dark .token.attr-name[data-v-76f36478],.theme-mode-dark .token.deleted[data-v-76f36478],.theme-mode-dark .token.namespace[data-v-76f36478],.theme-mode-dark .token.tag[data-v-76f36478]{color:#e2777a}.theme-mode-dark .token.function-name[data-v-76f36478]{color:#6196cc}.theme-mode-dark .token.boolean[data-v-76f36478],.theme-mode-dark .token.function[data-v-76f36478],.theme-mode-dark .token.number[data-v-76f36478]{color:#f08d49}.theme-mode-dark .token.class-name[data-v-76f36478],.theme-mode-dark .token.constant[data-v-76f36478],.theme-mode-dark .token.property[data-v-76f36478],.theme-mode-dark .token.symbol[data-v-76f36478]{color:#f8c555}.theme-mode-dark .token.atrule[data-v-76f36478],.theme-mode-dark .token.builtin[data-v-76f36478],.theme-mode-dark .token.important[data-v-76f36478],.theme-mode-dark .token.keyword[data-v-76f36478],.theme-mode-dark .token.selector[data-v-76f36478]{color:#cc99cd}.theme-mode-dark .token.attr-value[data-v-76f36478],.theme-mode-dark .token.char[data-v-76f36478],.theme-mode-dark .token.regex[data-v-76f36478],.theme-mode-dark .token.string[data-v-76f36478],.theme-mode-dark .token.variable[data-v-76f36478]{color:#7ec699}.theme-mode-dark .token.entity[data-v-76f36478],.theme-mode-dark .token.operator[data-v-76f36478],.theme-mode-dark .token.url[data-v-76f36478]{color:#67cdcc}.theme-mode-dark .language-css .token.string[data-v-76f36478],.theme-mode-dark .style .token.string[data-v-76f36478],.theme-mode-dark .token.entity[data-v-76f36478],.theme-mode-dark .token.operator[data-v-76f36478],.theme-mode-dark .token.url[data-v-76f36478]{background:none}.theme-mode-dark .token.bold[data-v-76f36478],.theme-mode-dark .token.important[data-v-76f36478]{font-weight:700}.theme-mode-dark .token.italic[data-v-76f36478]{font-style:italic}.theme-mode-dark .token.entity[data-v-76f36478]{cursor:help}.theme-mode-dark .token.inserted[data-v-76f36478]{color:green}.theme-mode-read[data-v-76f36478]{--bodyBg:#ececcc;--mainBg:#f5f5d5;--sidebarBg:rgba(245,245,213,0.8);--blurBg:rgba(245,245,213,0.9);--customBlockBg:#ececcc;--textColor:#704214;--textLightenColor:#963;--borderColor:rgba(0,0,0,0.15);--codeBg:#282c34;--codeColor:#fff}.theme-mode-read code[class*=language-][data-v-76f36478],.theme-mode-read pre[class*=language-][data-v-76f36478]{color:#ccc;background:none;text-shadow:none;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;hyphens:none}.theme-mode-read pre[class*=language-][data-v-76f36478]{padding:1em;margin:.5em 0;overflow:auto}.theme-mode-read :not(pre)>code[class*=language-][data-v-76f36478],.theme-mode-read pre[class*=language-][data-v-76f36478]{background:#2d2d2d}.theme-mode-read :not(pre)>code[class*=language-][data-v-76f36478]{padding:.1em;border-radius:.3em;white-space:normal}.theme-mode-read .token.block-comment[data-v-76f36478],.theme-mode-read .token.cdata[data-v-76f36478],.theme-mode-read .token.comment[data-v-76f36478],.theme-mode-read .token.doctype[data-v-76f36478],.theme-mode-read .token.prolog[data-v-76f36478]{color:#999}.theme-mode-read .token.punctuation[data-v-76f36478]{color:#ccc}.theme-mode-read .token.attr-name[data-v-76f36478],.theme-mode-read .token.deleted[data-v-76f36478],.theme-mode-read .token.namespace[data-v-76f36478],.theme-mode-read .token.tag[data-v-76f36478]{color:#e2777a}.theme-mode-read .token.function-name[data-v-76f36478]{color:#6196cc}.theme-mode-read .token.boolean[data-v-76f36478],.theme-mode-read .token.function[data-v-76f36478],.theme-mode-read .token.number[data-v-76f36478]{color:#f08d49}.theme-mode-read .token.class-name[data-v-76f36478],.theme-mode-read .token.constant[data-v-76f36478],.theme-mode-read .token.property[data-v-76f36478],.theme-mode-read .token.symbol[data-v-76f36478]{color:#f8c555}.theme-mode-read .token.atrule[data-v-76f36478],.theme-mode-read .token.builtin[data-v-76f36478],.theme-mode-read .token.important[data-v-76f36478],.theme-mode-read .token.keyword[data-v-76f36478],.theme-mode-read .token.selector[data-v-76f36478]{color:#cc99cd}.theme-mode-read .token.attr-value[data-v-76f36478],.theme-mode-read .token.char[data-v-76f36478],.theme-mode-read .token.regex[data-v-76f36478],.theme-mode-read .token.string[data-v-76f36478],.theme-mode-read .token.variable[data-v-76f36478]{color:#7ec699}.theme-mode-read .token.entity[data-v-76f36478],.theme-mode-read .token.operator[data-v-76f36478],.theme-mode-read .token.url[data-v-76f36478]{color:#67cdcc}.theme-mode-read .language-css .token.string[data-v-76f36478],.theme-mode-read .style .token.string[data-v-76f36478],.theme-mode-read .token.entity[data-v-76f36478],.theme-mode-read .token.operator[data-v-76f36478],.theme-mode-read .token.url[data-v-76f36478]{background:none}.theme-mode-read .token.bold[data-v-76f36478],.theme-mode-read .token.important[data-v-76f36478]{font-weight:700}.theme-mode-read .token.italic[data-v-76f36478]{font-style:italic}.theme-mode-read .token.entity[data-v-76f36478]{cursor:help}.theme-mode-read .token.inserted[data-v-76f36478]{color:green}.theme-style-line.theme-mode-light[data-v-76f36478]{--bodyBg:#fff}.theme-style-line.theme-mode-dark[data-v-76f36478]{--bodyBg:#1e1e22}.theme-style-line.theme-mode-read[data-v-76f36478]{--bodyBg:#f5f5d5}.theme-vdoing-content[data-v-76f36478]{margin:3rem auto;padding:1.5rem}.theme-vdoing-content span[data-v-76f36478]{font-size:6rem;color:#11a8cd}.main-wrapper{margin:1.5rem auto 0;max-width:1100px;padding:0 .9rem;box-sizing:border-box;position:relative;display:flex}.main-wrapper .main-left{flex:1}.main-wrapper .main-left .theme-vdoing-content.card-box{padding:1rem 1.5rem;margin-bottom:.9rem}.main-wrapper .main-left .home-content{padding:1rem 1.5rem 0}.main-wrapper .main-right>*{width:245px;box-sizing:border-box}@media (max-width:900px){.main-wrapper .main-right>*{width:235px}}.main-wrapper .main-right .card-box{margin:0 0 .8rem .8rem;padding-top:.95rem;padding-bottom:.95rem}@media (max-width:719px){.main-wrapper{margin:.9rem 0;padding:0;display:block}.main-wrapper .main-left{width:100%}.main-wrapper .main-left .post-list{margin-bottom:3rem}.main-wrapper .main-left .post-list .post{border-radius:0}.main-wrapper .main-left .pagination{margin-bottom:3rem}.main-wrapper .main-right .blogger-wrapper{display:none}.main-wrapper .main-right .card-box{margin:0 0 .9rem;border-radius:0;width:100%}.theme-style-line .main-wrapper .main-right .card-box{margin:-1px 0 0}}.post-list{margin-bottom:3rem}.post-list .post{position:relative;padding:1rem 1.5rem;margin-bottom:.8rem;transition:all .3s}.post-list .post:last-child{border-bottom:none}.post-list .post.post-leave-active{display:none}.post-list .post.post-enter{opacity:0;transform:translateX(-20px)}.post-list .post:before{position:absolute;top:-1px;right:0;font-size:2.5rem;color:#ff5722;opacity:.85}.post-list .post .title-wrapper a{color:var(--textColor)}.post-list .post .title-wrapper a:hover{color:#11a8cd}.post-list .post .title-wrapper h2{margin:.5rem 0;font-size:1.4rem;border:none}.post-list .post .title-wrapper h2 .title-tag{height:1.2rem;line-height:1.2rem;border:1px solid #ff5722;color:#ff5722;font-size:.8rem;padding:0 .35rem;border-radius:.2rem;margin-left:0;transform:translateY(-.15rem);display:inline-block}.post-list .post .title-wrapper h2 a{display:block}@media (max-width:719px){.post-list .post .title-wrapper h2 a{font-weight:400}}.post-list .post .title-wrapper .article-info>a,.post-list .post .title-wrapper .article-info>span{opacity:.7;font-size:.8rem;margin-right:1rem;cursor:pointer}.post-list .post .title-wrapper .article-info>a:before,.post-list .post .title-wrapper .article-info>span:before{margin-right:.3rem}.post-list .post .title-wrapper .article-info>a a,.post-list .post .title-wrapper .article-info>span a{margin:0}.post-list .post .title-wrapper .article-info>a a:not(:first-child):before,.post-list .post .title-wrapper .article-info>span a:not(:first-child):before{content:"/"}.post-list .post .title-wrapper .article-info .tags a:not(:first-child):before{content:"、"}.post-list .post .excerpt-wrapper{border-top:1px solid var(--borderColor);margin:.5rem 0;overflow:hidden}.post-list .post .excerpt-wrapper .excerpt{margin-bottom:.3rem;font-size:.92rem}.post-list .post .excerpt-wrapper .excerpt h1,.post-list .post .excerpt-wrapper .excerpt h2,.post-list .post .excerpt-wrapper .excerpt h3{display:none}.post-list .post .excerpt-wrapper .excerpt img{max-height:280px;max-width:100%!important;margin:0 auto}.post-list .post .excerpt-wrapper .readmore{float:right;margin-right:1rem;line-height:1rem}.post-list .post .excerpt-wrapper .readmore:before{float:right;font-size:.8rem;margin:.1rem 0 0 .2rem}.theme-style-line .post-list{border:1px solid var(--borderColor);border-bottom:none;border-radius:5px;overflow:hidden}.theme-style-line .post-list .post{margin-bottom:0;border:none;border-bottom:1px solid var(--borderColor);border-radius:0}.article-list{padding:1rem 2rem}@media (max-width:959px){.article-list{padding:1rem 1.5rem}}.article-list.no-article-list{display:none}.article-list .article-title{border-bottom:1px solid var(--borderColor);font-size:1.3rem;padding:1rem}.article-list .article-title a{font-size:1.2rem;color:var(--textColor);opacity:.9}.article-list .article-title a:before{margin-right:.4rem;font-size:1.1rem}.article-list .article-wrapper{overflow:hidden}.article-list .article-wrapper dl{border-bottom:1px dotted var(--borderColor);float:left;display:flex;padding:8px 0;margin:0;height:45px;width:100%}.article-list .article-wrapper dl dd{font-size:1.1rem;color:#f17229;width:50px;text-align:center;margin:0;line-height:45px}.article-list .article-wrapper dl dt{flex:1;display:flex}.article-list .article-wrapper dl dt a{color:var(--textColor);flex:1;display:flex;height:45px;align-items:center;font-weight:400}.article-list .article-wrapper dl dt a div{overflow:hidden;white-space:normal;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.article-list .article-wrapper dl dt a div .title-tag{border:1px solid #ff5722;color:#ff5722;font-size:.8rem;padding:0 .35rem;border-radius:.2rem;margin-left:0;transform:translateY(-.05rem);display:inline-block}.article-list .article-wrapper dl dt a:hover{text-decoration:underline}.article-list .article-wrapper dl dt a.more{color:#11a8cd}.article-list .article-wrapper dl dt .date{width:50px;margin-right:15px;color:#999;text-align:right;font-size:.9rem;line-height:45px}.pagination{position:relative;height:60px;text-align:center}@media (max-width:720px){.pagination{margin-left:1px;margin-right:1px}}.pagination span{line-height:1rem;opacity:.9;cursor:pointer}.pagination span:hover{color:#11a8cd}.pagination span.ellipsis{opacity:.5}.pagination span.ellipsis:before{content:"...";font-size:1.2rem}@media (any-hover:hover){.pagination span.ellipsis.ell-two:hover:before{content:"«"}.pagination span.ellipsis.ell-four:hover:before{content:"»"}}.pagination>span{position:absolute;top:0;padding:1rem 1.2rem;font-size:.95rem}.pagination>span:before{font-size:.4rem}.pagination>span.disabled{color:hsla(0,0%,49%,.5)}.pagination>span.prev{left:0}.pagination>span.prev:before{margin-right:.3rem}.pagination>span.next{right:0}.pagination>span.next:before{float:right;margin-left:.3rem}.pagination>span p{display:inline;line-height:.95rem}.pagination .pagination-list span{display:inline-block;width:2.5rem;height:2.5rem;line-height:2.5rem;margin:.3rem}.pagination .pagination-list span.active{background:#11a8cd;color:var(--mainBg)}@media (max-width:800px){.pagination>span{padding:1rem 1.5rem}.pagination>span p{display:none}}@media (max-width:719px){.pagination>span{padding:.9rem 1.5rem}.pagination .pagination-list span{width:2.3rem;height:2.3rem;line-height:2.3rem;margin:.25rem}}@media (max-width:390px){.pagination>span{padding:.8rem 1.3rem}.pagination .pagination-list span{width:2rem;height:2rem;line-height:2rem;margin:.3rem .1rem .1rem}}.blogger-wrapper{height:auto;display:inline-table;padding-top:0!important;overflow:hidden}.blogger-wrapper .avatar{width:100%;overflow:hidden}.blogger-wrapper .avatar img{width:100%;height:100%}.blogger-wrapper .icons{border-top:none;height:35px;line-height:35px}.blogger-wrapper .icons a{font-size:20px;width:33%;color:var(--textColor);display:block;float:left;text-align:center;opacity:.8}.blogger-wrapper .icons a:hover{color:#11a8cd}.blogger-wrapper .blogger{padding:.3rem .95rem 0}.blogger-wrapper .blogger .name{font-size:1.3rem;display:block;margin-bottom:6px}.blogger-wrapper .blogger .slogan{color:var(--textColor)}.categories-wrapper .title{color:var(--textColor);opacity:.9;font-size:1.2rem;padding:0 .95rem}.categories-wrapper .title:before{margin-right:.3rem}.categories-wrapper .categories{margin-top:.6rem}.categories-wrapper .categories a{display:block;padding:8px 2.4rem 7px .95rem;color:var(--textColor);opacity:.8;font-size:.95rem;line-height:.95rem;position:relative;transition:all .2s;border-left:2px solid transparent;margin-top:-1px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}@media (max-width:719px){.categories-wrapper .categories a{font-weight:400}}.categories-wrapper .categories a:not(.active):hover{color:#11a8cd;background:#f8f8f8;border-color:#11a8cd}.categories-wrapper .categories a:not(.active):hover span{opacity:.8}.categories-wrapper .categories a span{background-color:var(--textColor);color:var(--mainBg);border-radius:8px;padding:0 .13rem;min-width:1rem;height:1rem;line-height:1rem;font-size:12px;text-align:center;opacity:.6;transition:opacity .3s;position:absolute;right:.95rem;top:8px}.categories-wrapper .categories a.active{background:#11a8cd;color:var(--mainBg);padding-left:.8rem;border-radius:1px;border-color:transparent}.theme-mode-dark .categories-wrapper .categories a:not(.active):hover,.theme-mode-read .categories-wrapper .categories a:not(.active):hover{background:var(--customBlockBg)}.tags-wrapper{padding:0 .95rem}.tags-wrapper .title{color:var(--textColor);opacity:.9;font-size:1.2rem}.tags-wrapper .title:before{margin-right:.3rem}.tags-wrapper .tags{text-align:justify;padding:.8rem .5rem .5rem;margin:0 -.5rem -.5rem}.tags-wrapper .tags a{opacity:.8;display:inline-block;padding:.2rem .4rem;transition:all .4s;background-color:var(--textColor);color:var(--mainBg);border-radius:3px;margin:0 .3rem .5rem 0;min-width:2rem;height:1rem;line-height:1rem;font-size:.8rem;text-align:center}@media (max-width:719px){.tags-wrapper .tags a{font-weight:400}}.tags-wrapper .tags a:hover{opacity:1;transform:scale(1.1)}.tags-wrapper .tags a.active{box-shadow:0 5px 10px -5px var(--randomColor,rgba(0,0,0,.15));transform:scale(1.22);opacity:1}.tags-wrapper .tags a.active:hover{text-decoration:none}.theme-mode-light[data-v-2a444754]{--bodyBg:#f4f4f4;--mainBg:#fff;--sidebarBg:hsla(0,0%,100%,0.8);--blurBg:hsla(0,0%,100%,0.9);--customBlockBg:#f1f1f1;--textColor:#00323c;--textLightenColor:#0085ad;--borderColor:rgba(0,0,0,0.12);--codeBg:#f6f6f6;--codeColor:#525252}.theme-mode-light code[class*=language-][data-v-2a444754],.theme-mode-light pre[class*=language-][data-v-2a444754]{color:#000;background:none;text-shadow:0 1px #fff;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;hyphens:none}.theme-mode-light code[class*=language-][data-v-2a444754]::-moz-selection,.theme-mode-light code[class*=language-][data-v-2a444754] ::-moz-selection,.theme-mode-light pre[class*=language-][data-v-2a444754]::-moz-selection,.theme-mode-light pre[class*=language-][data-v-2a444754] ::-moz-selection{text-shadow:none;background:#b3d4fc}.theme-mode-light code[class*=language-][data-v-2a444754]::selection,.theme-mode-light code[class*=language-][data-v-2a444754] ::selection,.theme-mode-light pre[class*=language-][data-v-2a444754]::selection,.theme-mode-light pre[class*=language-][data-v-2a444754] ::selection{text-shadow:none;background:#b3d4fc}@media print{.theme-mode-light code[class*=language-][data-v-2a444754],.theme-mode-light pre[class*=language-][data-v-2a444754]{text-shadow:none}}.theme-mode-light pre[class*=language-][data-v-2a444754]{padding:1em;margin:.5em 0;overflow:auto}.theme-mode-light :not(pre)>code[class*=language-][data-v-2a444754],.theme-mode-light pre[class*=language-][data-v-2a444754]{background:#f5f2f0}.theme-mode-light :not(pre)>code[class*=language-][data-v-2a444754]{padding:.1em;border-radius:.3em;white-space:normal}.theme-mode-light .token.cdata[data-v-2a444754],.theme-mode-light .token.comment[data-v-2a444754],.theme-mode-light .token.doctype[data-v-2a444754],.theme-mode-light .token.prolog[data-v-2a444754]{color:#708090}.theme-mode-light .token.punctuation[data-v-2a444754]{color:#999}.theme-mode-light .namespace[data-v-2a444754]{opacity:.7}.theme-mode-light .token.boolean[data-v-2a444754],.theme-mode-light .token.constant[data-v-2a444754],.theme-mode-light .token.deleted[data-v-2a444754],.theme-mode-light .token.number[data-v-2a444754],.theme-mode-light .token.property[data-v-2a444754],.theme-mode-light .token.symbol[data-v-2a444754],.theme-mode-light .token.tag[data-v-2a444754]{color:#905}.theme-mode-light .token.attr-name[data-v-2a444754],.theme-mode-light .token.builtin[data-v-2a444754],.theme-mode-light .token.char[data-v-2a444754],.theme-mode-light .token.inserted[data-v-2a444754],.theme-mode-light .token.selector[data-v-2a444754],.theme-mode-light .token.string[data-v-2a444754]{color:#690}.theme-mode-light .language-css .token.string[data-v-2a444754],.theme-mode-light .style .token.string[data-v-2a444754],.theme-mode-light .token.entity[data-v-2a444754],.theme-mode-light .token.operator[data-v-2a444754],.theme-mode-light .token.url[data-v-2a444754]{color:#9a6e3a;background:hsla(0,0%,100%,.5)}.theme-mode-light .token.atrule[data-v-2a444754],.theme-mode-light .token.attr-value[data-v-2a444754],.theme-mode-light .token.keyword[data-v-2a444754]{color:#07a}.theme-mode-light .token.class-name[data-v-2a444754],.theme-mode-light .token.function[data-v-2a444754]{color:#dd4a68}.theme-mode-light .token.important[data-v-2a444754],.theme-mode-light .token.regex[data-v-2a444754],.theme-mode-light .token.variable[data-v-2a444754]{color:#e90}.theme-mode-light .token.bold[data-v-2a444754],.theme-mode-light .token.important[data-v-2a444754]{font-weight:700}.theme-mode-light .token.italic[data-v-2a444754]{font-style:italic}.theme-mode-light .token.entity[data-v-2a444754]{cursor:help}.theme-mode-light div[class*=language-] .highlight-lines .highlighted[data-v-2a444754],.theme-mode-light div[class*=language-].line-numbers-mode .highlight-lines .highlighted[data-v-2a444754]:before{background-color:hsla(0,0%,78.4%,.4)}.theme-mode-dark[data-v-2a444754]{--bodyBg:#27272b;--mainBg:#1e1e22;--sidebarBg:rgba(30,30,34,0.8);--blurBg:rgba(30,30,34,0.8);--customBlockBg:#27272b;--textColor:#9b9baa;--textLightenColor:#0085ad;--borderColor:#30363d;--codeBg:#252526;--codeColor:#fff}.theme-mode-dark code[class*=language-][data-v-2a444754],.theme-mode-dark pre[class*=language-][data-v-2a444754]{color:#ccc;background:none;text-shadow:none;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;hyphens:none}.theme-mode-dark pre[class*=language-][data-v-2a444754]{padding:1em;margin:.5em 0;overflow:auto}.theme-mode-dark :not(pre)>code[class*=language-][data-v-2a444754],.theme-mode-dark pre[class*=language-][data-v-2a444754]{background:#2d2d2d}.theme-mode-dark :not(pre)>code[class*=language-][data-v-2a444754]{padding:.1em;border-radius:.3em;white-space:normal}.theme-mode-dark .token.block-comment[data-v-2a444754],.theme-mode-dark .token.cdata[data-v-2a444754],.theme-mode-dark .token.comment[data-v-2a444754],.theme-mode-dark .token.doctype[data-v-2a444754],.theme-mode-dark .token.prolog[data-v-2a444754]{color:#999}.theme-mode-dark .token.punctuation[data-v-2a444754]{color:#ccc}.theme-mode-dark .token.attr-name[data-v-2a444754],.theme-mode-dark .token.deleted[data-v-2a444754],.theme-mode-dark .token.namespace[data-v-2a444754],.theme-mode-dark .token.tag[data-v-2a444754]{color:#e2777a}.theme-mode-dark .token.function-name[data-v-2a444754]{color:#6196cc}.theme-mode-dark .token.boolean[data-v-2a444754],.theme-mode-dark .token.function[data-v-2a444754],.theme-mode-dark .token.number[data-v-2a444754]{color:#f08d49}.theme-mode-dark .token.class-name[data-v-2a444754],.theme-mode-dark .token.constant[data-v-2a444754],.theme-mode-dark .token.property[data-v-2a444754],.theme-mode-dark .token.symbol[data-v-2a444754]{color:#f8c555}.theme-mode-dark .token.atrule[data-v-2a444754],.theme-mode-dark .token.builtin[data-v-2a444754],.theme-mode-dark .token.important[data-v-2a444754],.theme-mode-dark .token.keyword[data-v-2a444754],.theme-mode-dark .token.selector[data-v-2a444754]{color:#cc99cd}.theme-mode-dark .token.attr-value[data-v-2a444754],.theme-mode-dark .token.char[data-v-2a444754],.theme-mode-dark .token.regex[data-v-2a444754],.theme-mode-dark .token.string[data-v-2a444754],.theme-mode-dark .token.variable[data-v-2a444754]{color:#7ec699}.theme-mode-dark .token.entity[data-v-2a444754],.theme-mode-dark .token.operator[data-v-2a444754],.theme-mode-dark .token.url[data-v-2a444754]{color:#67cdcc}.theme-mode-dark .language-css .token.string[data-v-2a444754],.theme-mode-dark .style .token.string[data-v-2a444754],.theme-mode-dark .token.entity[data-v-2a444754],.theme-mode-dark .token.operator[data-v-2a444754],.theme-mode-dark .token.url[data-v-2a444754]{background:none}.theme-mode-dark .token.bold[data-v-2a444754],.theme-mode-dark .token.important[data-v-2a444754]{font-weight:700}.theme-mode-dark .token.italic[data-v-2a444754]{font-style:italic}.theme-mode-dark .token.entity[data-v-2a444754]{cursor:help}.theme-mode-dark .token.inserted[data-v-2a444754]{color:green}.theme-mode-read[data-v-2a444754]{--bodyBg:#ececcc;--mainBg:#f5f5d5;--sidebarBg:rgba(245,245,213,0.8);--blurBg:rgba(245,245,213,0.9);--customBlockBg:#ececcc;--textColor:#704214;--textLightenColor:#963;--borderColor:rgba(0,0,0,0.15);--codeBg:#282c34;--codeColor:#fff}.theme-mode-read code[class*=language-][data-v-2a444754],.theme-mode-read pre[class*=language-][data-v-2a444754]{color:#ccc;background:none;text-shadow:none;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;hyphens:none}.theme-mode-read pre[class*=language-][data-v-2a444754]{padding:1em;margin:.5em 0;overflow:auto}.theme-mode-read :not(pre)>code[class*=language-][data-v-2a444754],.theme-mode-read pre[class*=language-][data-v-2a444754]{background:#2d2d2d}.theme-mode-read :not(pre)>code[class*=language-][data-v-2a444754]{padding:.1em;border-radius:.3em;white-space:normal}.theme-mode-read .token.block-comment[data-v-2a444754],.theme-mode-read .token.cdata[data-v-2a444754],.theme-mode-read .token.comment[data-v-2a444754],.theme-mode-read .token.doctype[data-v-2a444754],.theme-mode-read .token.prolog[data-v-2a444754]{color:#999}.theme-mode-read .token.punctuation[data-v-2a444754]{color:#ccc}.theme-mode-read .token.attr-name[data-v-2a444754],.theme-mode-read .token.deleted[data-v-2a444754],.theme-mode-read .token.namespace[data-v-2a444754],.theme-mode-read .token.tag[data-v-2a444754]{color:#e2777a}.theme-mode-read .token.function-name[data-v-2a444754]{color:#6196cc}.theme-mode-read .token.boolean[data-v-2a444754],.theme-mode-read .token.function[data-v-2a444754],.theme-mode-read .token.number[data-v-2a444754]{color:#f08d49}.theme-mode-read .token.class-name[data-v-2a444754],.theme-mode-read .token.constant[data-v-2a444754],.theme-mode-read .token.property[data-v-2a444754],.theme-mode-read .token.symbol[data-v-2a444754]{color:#f8c555}.theme-mode-read .token.atrule[data-v-2a444754],.theme-mode-read .token.builtin[data-v-2a444754],.theme-mode-read .token.important[data-v-2a444754],.theme-mode-read .token.keyword[data-v-2a444754],.theme-mode-read .token.selector[data-v-2a444754]{color:#cc99cd}.theme-mode-read .token.attr-value[data-v-2a444754],.theme-mode-read .token.char[data-v-2a444754],.theme-mode-read .token.regex[data-v-2a444754],.theme-mode-read .token.string[data-v-2a444754],.theme-mode-read .token.variable[data-v-2a444754]{color:#7ec699}.theme-mode-read .token.entity[data-v-2a444754],.theme-mode-read .token.operator[data-v-2a444754],.theme-mode-read .token.url[data-v-2a444754]{color:#67cdcc}.theme-mode-read .language-css .token.string[data-v-2a444754],.theme-mode-read .style .token.string[data-v-2a444754],.theme-mode-read .token.entity[data-v-2a444754],.theme-mode-read .token.operator[data-v-2a444754],.theme-mode-read .token.url[data-v-2a444754]{background:none}.theme-mode-read .token.bold[data-v-2a444754],.theme-mode-read .token.important[data-v-2a444754]{font-weight:700}.theme-mode-read .token.italic[data-v-2a444754]{font-style:italic}.theme-mode-read .token.entity[data-v-2a444754]{cursor:help}.theme-mode-read .token.inserted[data-v-2a444754]{color:green}.theme-style-line.theme-mode-light[data-v-2a444754]{--bodyBg:#fff}.theme-style-line.theme-mode-dark[data-v-2a444754]{--bodyBg:#1e1e22}.theme-style-line.theme-mode-read[data-v-2a444754]{--bodyBg:#f5f5d5}.home-wrapper .banner[data-v-2a444754]{width:100%;min-height:450px;margin-top:3.6rem;color:#fff;position:relative;overflow:hidden}.home-wrapper .banner .banner-conent[data-v-2a444754]{max-width:1100px;margin:0 auto;position:relative;z-index:1;overflow:hidden}.home-wrapper .banner .banner-conent .hero[data-v-2a444754]{text-align:center;margin-top:3rem}.home-wrapper .banner .banner-conent .hero img[data-v-2a444754]{max-width:100%;max-height:240px;display:block;margin:2rem auto 1.5rem}.home-wrapper .banner .banner-conent .hero h1[data-v-2a444754]{margin:0;font-size:3.2rem}.home-wrapper .banner .banner-conent .hero .action[data-v-2a444754],.home-wrapper .banner .banner-conent .hero .description[data-v-2a444754]{margin:1.5rem auto}.home-wrapper .banner .banner-conent .hero .description[data-v-2a444754]{max-width:40rem;font-size:1.1rem;line-height:1.3;opacity:.9}.home-wrapper .banner .banner-conent .hero .action-button[data-v-2a444754]{display:inline-block;font-size:1.2rem;background-color:#11a8cd;padding:.8rem 1.6rem;border-radius:4px;transition:background-color .1s ease;box-sizing:border-box;border-bottom:1px solid #0f97b9;color:#fff}.home-wrapper .banner .banner-conent .hero .action-button[data-v-2a444754]:hover{background-color:#13bee8}.home-wrapper .banner .banner-conent .features[data-v-2a444754]{padding:2rem 0;margin-top:2.5rem;display:flex;flex-wrap:wrap;align-items:flex-start;align-content:stretch;justify-content:space-between}.home-wrapper .banner .banner-conent .feature[data-v-2a444754]{flex-grow:1;flex-basis:30%;max-width:30%;text-align:center}.home-wrapper .banner .banner-conent .feature a[data-v-2a444754]{color:inherit}.home-wrapper .banner .banner-conent .feature a .feature-img[data-v-2a444754]{width:10rem;height:10rem;animation:heart-data-v-2a444754 1.2s ease-in-out 0s infinite alternate;animation-play-state:paused}.home-wrapper .banner .banner-conent .feature a h2[data-v-2a444754]{font-weight:500;font-size:1.3rem;border-bottom:none;padding-bottom:0}.home-wrapper .banner .banner-conent .feature a p[data-v-2a444754]{opacity:.8;padding:0 .8rem}.home-wrapper .banner .banner-conent .feature:hover .feature-img[data-v-2a444754]{animation-play-state:running}.home-wrapper .banner .banner-conent .feature:hover h2[data-v-2a444754],.home-wrapper .banner .banner-conent .feature:hover p[data-v-2a444754]{color:#11a8cd}.home-wrapper .banner .slide-banner[data-v-2a444754]{margin-top:2rem}.home-wrapper .banner .slide-banner .banner-wrapper[data-v-2a444754]{position:relative}.home-wrapper .banner .slide-banner .slide-banner-scroll[data-v-2a444754]{min-height:1px;overflow:hidden}.home-wrapper .banner .slide-banner .slide-banner-wrapper[data-v-2a444754]{height:300px}.home-wrapper .banner .slide-banner .slide-banner-wrapper .slide-item[data-v-2a444754]{display:inline-block;height:300px;width:100%;text-align:center}.home-wrapper .banner .slide-banner .slide-banner-wrapper .slide-item a[data-v-2a444754]{color:inherit}.home-wrapper .banner .slide-banner .slide-banner-wrapper .slide-item a .feature-img[data-v-2a444754]{width:10rem;height:10rem}.home-wrapper .banner .slide-banner .slide-banner-wrapper .slide-item a h2[data-v-2a444754]{font-size:1.1rem;font-weight:500;border-bottom:none;padding-bottom:0}.home-wrapper .banner .slide-banner .slide-banner-wrapper .slide-item a p[data-v-2a444754]{opacity:.8;padding:0 .8rem}.home-wrapper .banner .slide-banner .docs-wrapper[data-v-2a444754]{position:absolute;bottom:25px;left:50%;transform:translateX(-50%)}.home-wrapper .banner .slide-banner .docs-wrapper .doc[data-v-2a444754]{display:inline-block;margin:0 4px;width:8px;height:8px;border-radius:50%;background:var(--textColor);opacity:.9}.home-wrapper .banner .slide-banner .docs-wrapper .doc.active[data-v-2a444754]{opacity:.5}.home-wrapper .banner.hide-banner[data-v-2a444754]{display:none}.home-wrapper .banner.hide-banner+.main-wrapper[data-v-2a444754]{margin-top:4.5rem}.home-wrapper .main-wrapper[data-v-2a444754]{margin-top:2rem}.home-wrapper .main-wrapper .main-left .card-box[data-v-2a444754]{margin-bottom:2rem}.home-wrapper .main-wrapper .main-left .pagination[data-v-2a444754]{margin-bottom:3rem}.home-wrapper .main-wrapper .main-left .theme-vdoing-content[data-v-2a444754]{padding:0 2rem;overflow:hidden;border:none}.home-wrapper .main-wrapper .main-left .theme-vdoing-content[data-v-2a444754]>:first-child{padding-top:2rem}.home-wrapper .main-wrapper .main-left .theme-vdoing-content[data-v-2a444754]>:last-child{padding-bottom:2rem}.home-wrapper .main-wrapper .main-right .custom-html-box[data-v-2a444754]{padding:0;overflow:hidden}@media (max-width:1025px){.home-wrapper .banner .banner-conent .hero h1[data-v-2a444754]{font-size:2.5rem}.home-wrapper .banner .banner-conent .hero .description[data-v-2a444754]{font-size:1rem}.home-wrapper .banner .banner-conent .feature a h2[data-v-2a444754]{font-size:1.1rem}.home-wrapper .banner .banner-conent .feature a .feature-img[data-v-2a444754]{width:9rem;height:9rem}}@media (max-width:719px){.home-wrapper .banner .banner-conent .features[data-v-2a444754]{display:none!important}}@media (max-width:419px){.home-wrapper .banner-conent[data-v-2a444754]{padding-left:1.5rem;padding-right:1.5rem}.home-wrapper .banner-conent .hero img[data-v-2a444754]{max-height:210px;margin:2rem auto 1.2rem}.home-wrapper .banner-conent .hero h1[data-v-2a444754]{font-size:2rem}.home-wrapper .banner-conent .hero .action[data-v-2a444754],.home-wrapper .banner-conent .hero .description[data-v-2a444754],.home-wrapper .banner-conent .hero h1[data-v-2a444754]{margin:1.2rem auto}.home-wrapper .banner-conent .hero .description[data-v-2a444754]{font-size:1.2rem}.home-wrapper .banner-conent .hero .action-button[data-v-2a444754]{font-size:1rem;padding:.6rem 1.2rem}.home-wrapper .banner-conent .feature h2[data-v-2a444754]{font-size:1.25rem}}@media (max-width:719px){.theme-style-line .main-wrapper[data-v-2a444754]{margin-top:-1px}}@keyframes heart-data-v-2a444754{0%{transform:translate(0)}to{transform:translateY(8px)}}.search-box{display:inline-block;position:relative;margin-right:1rem}.search-box input{cursor:text;width:10rem;height:2rem;color:#4e6e8e;display:inline-block;border:1px solid #cfd4db;border-radius:2rem;font-size:.9rem;line-height:2rem;padding:0 .5rem 0 2rem;outline:none;transition:all .2s ease;background:#fff url(/ronna-admin-doc/assets/img/search.237d6f6a.svg) .6rem .5rem no-repeat;background-size:1rem}.search-box input:focus{cursor:auto;border-color:#11a8cd}.search-box .suggestions{background:#fff;min-width:500px;max-width:700px;position:absolute;top:2rem;border:1px solid #cfd4db;border-radius:6px;padding:.4rem;list-style-type:none}.search-box .suggestions.align-right{right:0}.search-box .suggestion{line-height:1.4;border-radius:4px;cursor:pointer;width:100%}.search-box .suggestion a{display:block;white-space:normal;color:#415b75;width:100%}.search-box .suggestion a .parent-page-title{color:#fff;font-weight:600;background-color:#11a8cd;padding:5px}.search-box .suggestion a .suggestion-row{border-collapse:collapse;width:100%;display:table}.search-box .suggestion a .suggestion-row .page-title{width:35%;background:#f5f5f5;border:1px solid #eaecef;border-left:none;display:table-cell;text-align:right;padding:5px;font-weight:600}.search-box .suggestion a .suggestion-row .suggestion-content{font-weight:400;border:1px solid #eaecef;border-right:none;width:65%;display:table-cell;padding:5px}.search-box .suggestion a .suggestion-row .suggestion-content .highlight{text-decoration:underline}.search-box .suggestion a .suggestion-row .suggestion-content .header{font-weight:600}.search-box .suggestion.focused{background-color:#f3f4f5}@media (max-width:959px){.search-box input{cursor:pointer;width:0;border-color:transparent;position:relative}.search-box input:focus{cursor:text;left:0;width:10rem}}@media (-ms-high-contrast:none){.search-box input{height:2rem}}@media (max-width:959px) and (min-width:719px){.search-box .suggestions{left:0}}@media (max-width:719px){.search-box{margin-right:0}.search-box input{left:1rem}.search-box .suggestions{right:0}}@media (max-width:419px){.search-box .suggestions{width:calc(100vw - 4rem)}.search-box input:focus{width:8rem}}.sidebar-button{cursor:pointer;display:none;width:1.25rem;height:1.25rem;position:absolute;padding:.6rem;top:.6rem;left:1rem}@media (max-width:719px){.sidebar-button{display:block}}.sidebar-button .icon{display:block;width:1.25rem;height:1.25rem}@media (min-width:720px){.sidebar-button{width:40px;height:40px;display:inline-block;position:fixed;left:0;top:4.6rem;text-align:center;line-height:44px;margin:5px 8px;color:#888;border-radius:50%;padding:0;transition:all .2s}.sidebar-button:hover{background:#11a8cd;color:#fff;box-shadow:0 0 6px #11a8cd}.sidebar-button .icon{display:inline;width:1rem;height:1rem}}.dropdown-enter,.dropdown-leave-to{height:0!important}.dropdown-wrapper{cursor:pointer}.dropdown-wrapper .dropdown-title{display:block;font-size:.9rem;font-family:inherit;cursor:inherit;padding:inherit;line-height:1.4rem;background:transparent;border:none;font-weight:500;color:var(--textColor)}.dropdown-wrapper .dropdown-title:hover{border-color:transparent}.dropdown-wrapper .dropdown-title .arrow{vertical-align:middle;margin-top:-1px;margin-left:.4rem}.dropdown-wrapper .nav-dropdown .dropdown-item{color:inherit;line-height:1.7rem}.dropdown-wrapper .nav-dropdown .dropdown-item h4{margin:.45rem 0 0;border-top:1px solid var(--borderColor);padding:.45rem 1.5rem 0 1.25rem}.dropdown-wrapper .nav-dropdown .dropdown-item .dropdown-subitem-wrapper{padding:0;list-style:none}.dropdown-wrapper .nav-dropdown .dropdown-item .dropdown-subitem-wrapper .dropdown-subitem{font-size:.9em}.dropdown-wrapper .nav-dropdown .dropdown-item a{display:block;line-height:1.7rem;position:relative;border-bottom:none;font-weight:400;margin-bottom:0;padding:0 1.5rem 0 1.25rem}.dropdown-wrapper .nav-dropdown .dropdown-item a.router-link-active,.dropdown-wrapper .nav-dropdown .dropdown-item a:hover{color:#11a8cd}.dropdown-wrapper .nav-dropdown .dropdown-item a.router-link-active:after{content:"";width:0;height:0;border-left:5px solid #11a8cd;border-top:3px solid transparent;border-bottom:3px solid transparent;position:absolute;top:calc(50% - 2px);left:9px}.dropdown-wrapper .nav-dropdown .dropdown-item:first-child h4{margin-top:0;padding-top:0;border-top:0}@media (max-width:719px){.dropdown-wrapper.open .dropdown-title{margin-bottom:.5rem}.dropdown-wrapper .dropdown-title{font-weight:600;font-size:inherit}.dropdown-wrapper .dropdown-title:hover{color:#11a8cd}.dropdown-wrapper .dropdown-title .link-title{display:none}.dropdown-wrapper .dropdown-title .title{display:inline-block!important}.dropdown-wrapper .nav-dropdown{transition:height .1s ease-out;overflow:hidden}.dropdown-wrapper .nav-dropdown .dropdown-item h4{border-top:0;margin-top:0;padding-top:0}.dropdown-wrapper .nav-dropdown .dropdown-item>a,.dropdown-wrapper .nav-dropdown .dropdown-item h4{font-size:15px;line-height:2rem}.dropdown-wrapper .nav-dropdown .dropdown-item .dropdown-subitem{font-size:14px;padding-left:1rem}}@media (min-width:719px){.dropdown-wrapper{height:1.8rem}.dropdown-wrapper.open .nav-dropdown,.dropdown-wrapper:hover .nav-dropdown{display:block!important}.dropdown-wrapper.open:blur{display:none}.dropdown-wrapper .dropdown-title .arrow{border-left:4px solid transparent;border-right:4px solid transparent;border-top:6px solid #ccc;border-bottom:0}.dropdown-wrapper .nav-dropdown{display:none;height:auto!important;box-sizing:border-box;max-height:calc(100vh - 2.7rem);overflow-y:auto;position:absolute;top:100%;right:0;background-color:var(--mainBg);padding:.6rem 0;border-bottom-color:var(--borderColor);border:1px solid var(--borderColor);text-align:left;border-radius:.25rem;white-space:nowrap;margin:0}.nav-item .dropdown-title a.router-link-active,.nav-item .dropdown-title a:hover{margin-bottom:-2px;border-bottom:2px solid #13b9e2}}.nav-links{display:inline-block}.nav-links a{line-height:1.4rem;color:inherit}.nav-links a.router-link-active,.nav-links a:hover{color:#11a8cd}.nav-links .nav-item{position:relative;display:inline-block;margin-left:1.5rem;line-height:2rem}.nav-links .nav-item:first-child{margin-left:0}.nav-links .repo-link{margin-left:1.5rem}@media (max-width:959px){.nav-links .nav-item{margin-left:1.2rem}}@media (max-width:719px){.nav-links .nav-item,.nav-links .repo-link{margin-left:0}}@media (min-width:719px){.nav-links a.router-link-active,.nav-links a:hover{color:var(--textColor)}.nav-item>a:not(.external).router-link-active,.nav-item>a:not(.external):hover{margin-bottom:-2px;border-bottom:2px solid #13b9e2}}.navbar{padding:.7rem 1.5rem;line-height:2.2rem;transition:transform .3s}.navbar a,.navbar img,.navbar span{display:inline-block}.navbar .logo{height:2.2rem;min-width:2.2rem;margin-right:.8rem;vertical-align:top}.navbar .site-name{font-size:1.3rem;font-weight:600;color:var(--textColor);position:relative}.navbar .links{padding-left:1.5rem;box-sizing:border-box;white-space:nowrap;font-size:.9rem;position:absolute;right:1.5rem;top:.7rem;display:flex}.navbar .links .search-box{flex:0 0 auto;vertical-align:top}.hide-navbar .navbar{transform:translateY(-100%)}@media (max-width:959px){.navbar .site-name{display:none}}@media (max-width:719px){.navbar{padding-left:4rem}.navbar .can-hide{display:none}.navbar .links{padding-left:1.5rem}.navbar .site-name{width:calc(100vw - 9.4rem);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}}.page-edit{max-width:860px;padding-top:1rem;padding-bottom:1rem;overflow:auto}.page-edit .edit-link{display:inline-block;float:left;margin:0 2rem .5rem 0}.page-edit .edit-link a{margin-right:.25rem}.page-edit .tags{float:left}.page-edit .tags a{margin:0 .8rem .5rem 0;display:inline-block;color:var(--textLightenColor);padding:.2rem .7rem;font-size:.9em;background-color:hsla(0,0%,50.2%,.08);border-radius:3px;opacity:.8}.page-edit .last-updated{float:right;font-size:.9em}.page-edit .last-updated .prefix{font-weight:500;color:var(--textColor);opacity:.8}.page-edit .last-updated .time{font-weight:400;color:#aaa}@media (max-width:719px){.page-edit .edit-link,.page-edit .tags{margin-bottom:.5rem}.page-edit .last-updated{width:100%;font-size:.8em;text-align:left}}.page-nav{max-width:860px;padding-top:1rem;padding-bottom:0}.page-nav .inner{min-height:2rem;margin-top:0;border-top:1px solid var(--borderColor);padding-top:1rem;overflow:auto}.page-nav .next{float:right}.page-nav-centre-wrap .page-nav-centre{position:fixed;top:50%;width:80px;height:70px;margin-top:-35px;outline:0;transition:all .2s;border-radius:3px;opacity:.55;z-index:99}@media (max-width:1340px){.page-nav-centre-wrap .page-nav-centre{width:50px}}@media (max-width:960px){.page-nav-centre-wrap .page-nav-centre{display:none}}.page-nav-centre-wrap .page-nav-centre:hover{background:hsla(0,0%,60%,.15);opacity:1}.page-nav-centre-wrap .page-nav-centre:hover .tooltip{display:block}.page-nav-centre-wrap .page-nav-centre:before{content:"";display:block;width:10px;height:10px;border-top:2px solid #999;border-right:2px solid #999;position:absolute;top:0;right:0;bottom:0;left:0;margin:auto}.page-nav-centre-wrap .page-nav-centre .tooltip{display:none;background:rgba(0,0,0,.5);color:#fff;padding:4px 8px;font-size:13px;border-radius:3px;position:fixed;max-width:200px;z-index:99}.page-nav-centre-wrap .page-nav-centre-prev{left:0}.page-nav-centre-wrap .page-nav-centre-prev:before{transform:rotate(-135deg)}.page-nav-centre-wrap .page-nav-centre-next{right:0}.page-nav-centre-wrap .page-nav-centre-next:before{transform:rotate(45deg)}.sidebar-open .page-nav-centre-wrap .page-nav-centre-prev{left:18rem}.no-sidebar .page-nav-centre-wrap .page-nav-centre-prev{left:0}.theme-mode-light[data-v-057748f7]{--bodyBg:#f4f4f4;--mainBg:#fff;--sidebarBg:hsla(0,0%,100%,0.8);--blurBg:hsla(0,0%,100%,0.9);--customBlockBg:#f1f1f1;--textColor:#00323c;--textLightenColor:#0085ad;--borderColor:rgba(0,0,0,0.12);--codeBg:#f6f6f6;--codeColor:#525252}.theme-mode-light code[class*=language-][data-v-057748f7],.theme-mode-light pre[class*=language-][data-v-057748f7]{color:#000;background:none;text-shadow:0 1px #fff;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;hyphens:none}.theme-mode-light code[class*=language-][data-v-057748f7]::-moz-selection,.theme-mode-light code[class*=language-][data-v-057748f7] ::-moz-selection,.theme-mode-light pre[class*=language-][data-v-057748f7]::-moz-selection,.theme-mode-light pre[class*=language-][data-v-057748f7] ::-moz-selection{text-shadow:none;background:#b3d4fc}.theme-mode-light code[class*=language-][data-v-057748f7]::selection,.theme-mode-light code[class*=language-][data-v-057748f7] ::selection,.theme-mode-light pre[class*=language-][data-v-057748f7]::selection,.theme-mode-light pre[class*=language-][data-v-057748f7] ::selection{text-shadow:none;background:#b3d4fc}@media print{.theme-mode-light code[class*=language-][data-v-057748f7],.theme-mode-light pre[class*=language-][data-v-057748f7]{text-shadow:none}}.theme-mode-light pre[class*=language-][data-v-057748f7]{padding:1em;margin:.5em 0;overflow:auto}.theme-mode-light :not(pre)>code[class*=language-][data-v-057748f7],.theme-mode-light pre[class*=language-][data-v-057748f7]{background:#f5f2f0}.theme-mode-light :not(pre)>code[class*=language-][data-v-057748f7]{padding:.1em;border-radius:.3em;white-space:normal}.theme-mode-light .token.cdata[data-v-057748f7],.theme-mode-light .token.comment[data-v-057748f7],.theme-mode-light .token.doctype[data-v-057748f7],.theme-mode-light .token.prolog[data-v-057748f7]{color:#708090}.theme-mode-light .token.punctuation[data-v-057748f7]{color:#999}.theme-mode-light .namespace[data-v-057748f7]{opacity:.7}.theme-mode-light .token.boolean[data-v-057748f7],.theme-mode-light .token.constant[data-v-057748f7],.theme-mode-light .token.deleted[data-v-057748f7],.theme-mode-light .token.number[data-v-057748f7],.theme-mode-light .token.property[data-v-057748f7],.theme-mode-light .token.symbol[data-v-057748f7],.theme-mode-light .token.tag[data-v-057748f7]{color:#905}.theme-mode-light .token.attr-name[data-v-057748f7],.theme-mode-light .token.builtin[data-v-057748f7],.theme-mode-light .token.char[data-v-057748f7],.theme-mode-light .token.inserted[data-v-057748f7],.theme-mode-light .token.selector[data-v-057748f7],.theme-mode-light .token.string[data-v-057748f7]{color:#690}.theme-mode-light .language-css .token.string[data-v-057748f7],.theme-mode-light .style .token.string[data-v-057748f7],.theme-mode-light .token.entity[data-v-057748f7],.theme-mode-light .token.operator[data-v-057748f7],.theme-mode-light .token.url[data-v-057748f7]{color:#9a6e3a;background:hsla(0,0%,100%,.5)}.theme-mode-light .token.atrule[data-v-057748f7],.theme-mode-light .token.attr-value[data-v-057748f7],.theme-mode-light .token.keyword[data-v-057748f7]{color:#07a}.theme-mode-light .token.class-name[data-v-057748f7],.theme-mode-light .token.function[data-v-057748f7]{color:#dd4a68}.theme-mode-light .token.important[data-v-057748f7],.theme-mode-light .token.regex[data-v-057748f7],.theme-mode-light .token.variable[data-v-057748f7]{color:#e90}.theme-mode-light .token.bold[data-v-057748f7],.theme-mode-light .token.important[data-v-057748f7]{font-weight:700}.theme-mode-light .token.italic[data-v-057748f7]{font-style:italic}.theme-mode-light .token.entity[data-v-057748f7]{cursor:help}.theme-mode-light div[class*=language-] .highlight-lines .highlighted[data-v-057748f7],.theme-mode-light div[class*=language-].line-numbers-mode .highlight-lines .highlighted[data-v-057748f7]:before{background-color:hsla(0,0%,78.4%,.4)}.theme-mode-dark[data-v-057748f7]{--bodyBg:#27272b;--mainBg:#1e1e22;--sidebarBg:rgba(30,30,34,0.8);--blurBg:rgba(30,30,34,0.8);--customBlockBg:#27272b;--textColor:#9b9baa;--textLightenColor:#0085ad;--borderColor:#30363d;--codeBg:#252526;--codeColor:#fff}.theme-mode-dark code[class*=language-][data-v-057748f7],.theme-mode-dark pre[class*=language-][data-v-057748f7]{color:#ccc;background:none;text-shadow:none;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;hyphens:none}.theme-mode-dark pre[class*=language-][data-v-057748f7]{padding:1em;margin:.5em 0;overflow:auto}.theme-mode-dark :not(pre)>code[class*=language-][data-v-057748f7],.theme-mode-dark pre[class*=language-][data-v-057748f7]{background:#2d2d2d}.theme-mode-dark :not(pre)>code[class*=language-][data-v-057748f7]{padding:.1em;border-radius:.3em;white-space:normal}.theme-mode-dark .token.block-comment[data-v-057748f7],.theme-mode-dark .token.cdata[data-v-057748f7],.theme-mode-dark .token.comment[data-v-057748f7],.theme-mode-dark .token.doctype[data-v-057748f7],.theme-mode-dark .token.prolog[data-v-057748f7]{color:#999}.theme-mode-dark .token.punctuation[data-v-057748f7]{color:#ccc}.theme-mode-dark .token.attr-name[data-v-057748f7],.theme-mode-dark .token.deleted[data-v-057748f7],.theme-mode-dark .token.namespace[data-v-057748f7],.theme-mode-dark .token.tag[data-v-057748f7]{color:#e2777a}.theme-mode-dark .token.function-name[data-v-057748f7]{color:#6196cc}.theme-mode-dark .token.boolean[data-v-057748f7],.theme-mode-dark .token.function[data-v-057748f7],.theme-mode-dark .token.number[data-v-057748f7]{color:#f08d49}.theme-mode-dark .token.class-name[data-v-057748f7],.theme-mode-dark .token.constant[data-v-057748f7],.theme-mode-dark .token.property[data-v-057748f7],.theme-mode-dark .token.symbol[data-v-057748f7]{color:#f8c555}.theme-mode-dark .token.atrule[data-v-057748f7],.theme-mode-dark .token.builtin[data-v-057748f7],.theme-mode-dark .token.important[data-v-057748f7],.theme-mode-dark .token.keyword[data-v-057748f7],.theme-mode-dark .token.selector[data-v-057748f7]{color:#cc99cd}.theme-mode-dark .token.attr-value[data-v-057748f7],.theme-mode-dark .token.char[data-v-057748f7],.theme-mode-dark .token.regex[data-v-057748f7],.theme-mode-dark .token.string[data-v-057748f7],.theme-mode-dark .token.variable[data-v-057748f7]{color:#7ec699}.theme-mode-dark .token.entity[data-v-057748f7],.theme-mode-dark .token.operator[data-v-057748f7],.theme-mode-dark .token.url[data-v-057748f7]{color:#67cdcc}.theme-mode-dark .language-css .token.string[data-v-057748f7],.theme-mode-dark .style .token.string[data-v-057748f7],.theme-mode-dark .token.entity[data-v-057748f7],.theme-mode-dark .token.operator[data-v-057748f7],.theme-mode-dark .token.url[data-v-057748f7]{background:none}.theme-mode-dark .token.bold[data-v-057748f7],.theme-mode-dark .token.important[data-v-057748f7]{font-weight:700}.theme-mode-dark .token.italic[data-v-057748f7]{font-style:italic}.theme-mode-dark .token.entity[data-v-057748f7]{cursor:help}.theme-mode-dark .token.inserted[data-v-057748f7]{color:green}.theme-mode-read[data-v-057748f7]{--bodyBg:#ececcc;--mainBg:#f5f5d5;--sidebarBg:rgba(245,245,213,0.8);--blurBg:rgba(245,245,213,0.9);--customBlockBg:#ececcc;--textColor:#704214;--textLightenColor:#963;--borderColor:rgba(0,0,0,0.15);--codeBg:#282c34;--codeColor:#fff}.theme-mode-read code[class*=language-][data-v-057748f7],.theme-mode-read pre[class*=language-][data-v-057748f7]{color:#ccc;background:none;text-shadow:none;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;hyphens:none}.theme-mode-read pre[class*=language-][data-v-057748f7]{padding:1em;margin:.5em 0;overflow:auto}.theme-mode-read :not(pre)>code[class*=language-][data-v-057748f7],.theme-mode-read pre[class*=language-][data-v-057748f7]{background:#2d2d2d}.theme-mode-read :not(pre)>code[class*=language-][data-v-057748f7]{padding:.1em;border-radius:.3em;white-space:normal}.theme-mode-read .token.block-comment[data-v-057748f7],.theme-mode-read .token.cdata[data-v-057748f7],.theme-mode-read .token.comment[data-v-057748f7],.theme-mode-read .token.doctype[data-v-057748f7],.theme-mode-read .token.prolog[data-v-057748f7]{color:#999}.theme-mode-read .token.punctuation[data-v-057748f7]{color:#ccc}.theme-mode-read .token.attr-name[data-v-057748f7],.theme-mode-read .token.deleted[data-v-057748f7],.theme-mode-read .token.namespace[data-v-057748f7],.theme-mode-read .token.tag[data-v-057748f7]{color:#e2777a}.theme-mode-read .token.function-name[data-v-057748f7]{color:#6196cc}.theme-mode-read .token.boolean[data-v-057748f7],.theme-mode-read .token.function[data-v-057748f7],.theme-mode-read .token.number[data-v-057748f7]{color:#f08d49}.theme-mode-read .token.class-name[data-v-057748f7],.theme-mode-read .token.constant[data-v-057748f7],.theme-mode-read .token.property[data-v-057748f7],.theme-mode-read .token.symbol[data-v-057748f7]{color:#f8c555}.theme-mode-read .token.atrule[data-v-057748f7],.theme-mode-read .token.builtin[data-v-057748f7],.theme-mode-read .token.important[data-v-057748f7],.theme-mode-read .token.keyword[data-v-057748f7],.theme-mode-read .token.selector[data-v-057748f7]{color:#cc99cd}.theme-mode-read .token.attr-value[data-v-057748f7],.theme-mode-read .token.char[data-v-057748f7],.theme-mode-read .token.regex[data-v-057748f7],.theme-mode-read .token.string[data-v-057748f7],.theme-mode-read .token.variable[data-v-057748f7]{color:#7ec699}.theme-mode-read .token.entity[data-v-057748f7],.theme-mode-read .token.operator[data-v-057748f7],.theme-mode-read .token.url[data-v-057748f7]{color:#67cdcc}.theme-mode-read .language-css .token.string[data-v-057748f7],.theme-mode-read .style .token.string[data-v-057748f7],.theme-mode-read .token.entity[data-v-057748f7],.theme-mode-read .token.operator[data-v-057748f7],.theme-mode-read .token.url[data-v-057748f7]{background:none}.theme-mode-read .token.bold[data-v-057748f7],.theme-mode-read .token.important[data-v-057748f7]{font-weight:700}.theme-mode-read .token.italic[data-v-057748f7]{font-style:italic}.theme-mode-read .token.entity[data-v-057748f7]{cursor:help}.theme-mode-read .token.inserted[data-v-057748f7]{color:green}.theme-style-line.theme-mode-light[data-v-057748f7]{--bodyBg:#fff}.theme-style-line.theme-mode-dark[data-v-057748f7]{--bodyBg:#1e1e22}.theme-style-line.theme-mode-read[data-v-057748f7]{--bodyBg:#f5f5d5}.articleInfo-wrap[data-v-057748f7]{max-width:860px}.theme-style-line .articleInfo-wrap .articleInfo[data-v-057748f7]{padding-top:.5rem}.articleInfo-wrap[data-v-057748f7]{position:relative;z-index:1;color:#888}.articleInfo-wrap .articleInfo[data-v-057748f7]{overflow:hidden;font-size:.92rem}.articleInfo-wrap .articleInfo .breadcrumbs[data-v-057748f7]{margin:0;padding:0;overflow:hidden;display:inline-block;line-height:2rem}@media (max-width:960px){.articleInfo-wrap .articleInfo .breadcrumbs[data-v-057748f7]{width:100%}}.articleInfo-wrap .articleInfo .breadcrumbs li[data-v-057748f7]{list-style-type:none;float:left;padding-right:5px}.articleInfo-wrap .articleInfo .breadcrumbs li[data-v-057748f7]:after{content:"/";margin-left:5px;color:#999}.articleInfo-wrap .articleInfo .breadcrumbs li[data-v-057748f7]:last-child:after{content:""}.articleInfo-wrap .articleInfo .breadcrumbs li a[data-v-057748f7]{color:#888}.articleInfo-wrap .articleInfo .breadcrumbs li a[data-v-057748f7]:before{font-size:.92rem}.articleInfo-wrap .articleInfo .breadcrumbs li a[data-v-057748f7]:hover{color:#11a8cd}.articleInfo-wrap .articleInfo .breadcrumbs li .icon-home[data-v-057748f7]{text-decoration:none}.articleInfo-wrap .articleInfo .info[data-v-057748f7]{float:right;line-height:32px}@media (max-width:960px){.articleInfo-wrap .articleInfo .info[data-v-057748f7]{float:left}}.articleInfo-wrap .articleInfo .info div[data-v-057748f7]{float:left;margin-left:20px;font-size:.8rem}@media (max-width:960px){.articleInfo-wrap .articleInfo .info div[data-v-057748f7]{margin:0 20px 0 0}}.articleInfo-wrap .articleInfo .info div[data-v-057748f7]:before{margin-right:3px}.articleInfo-wrap .articleInfo .info div a[data-v-057748f7]{color:#888}.articleInfo-wrap .articleInfo .info div a[data-v-057748f7]:hover{text-decoration:none}.articleInfo-wrap .articleInfo .info div a.beLink[data-v-057748f7]:hover{color:#11a8cd;text-decoration:underline}.theme-mode-light[data-v-f12ba5ac]{--bodyBg:#f4f4f4;--mainBg:#fff;--sidebarBg:hsla(0,0%,100%,0.8);--blurBg:hsla(0,0%,100%,0.9);--customBlockBg:#f1f1f1;--textColor:#00323c;--textLightenColor:#0085ad;--borderColor:rgba(0,0,0,0.12);--codeBg:#f6f6f6;--codeColor:#525252}.theme-mode-light code[class*=language-][data-v-f12ba5ac],.theme-mode-light pre[class*=language-][data-v-f12ba5ac]{color:#000;background:none;text-shadow:0 1px #fff;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;hyphens:none}.theme-mode-light code[class*=language-][data-v-f12ba5ac]::-moz-selection,.theme-mode-light code[class*=language-][data-v-f12ba5ac] ::-moz-selection,.theme-mode-light pre[class*=language-][data-v-f12ba5ac]::-moz-selection,.theme-mode-light pre[class*=language-][data-v-f12ba5ac] ::-moz-selection{text-shadow:none;background:#b3d4fc}.theme-mode-light code[class*=language-][data-v-f12ba5ac]::selection,.theme-mode-light code[class*=language-][data-v-f12ba5ac] ::selection,.theme-mode-light pre[class*=language-][data-v-f12ba5ac]::selection,.theme-mode-light pre[class*=language-][data-v-f12ba5ac] ::selection{text-shadow:none;background:#b3d4fc}@media print{.theme-mode-light code[class*=language-][data-v-f12ba5ac],.theme-mode-light pre[class*=language-][data-v-f12ba5ac]{text-shadow:none}}.theme-mode-light pre[class*=language-][data-v-f12ba5ac]{padding:1em;margin:.5em 0;overflow:auto}.theme-mode-light :not(pre)>code[class*=language-][data-v-f12ba5ac],.theme-mode-light pre[class*=language-][data-v-f12ba5ac]{background:#f5f2f0}.theme-mode-light :not(pre)>code[class*=language-][data-v-f12ba5ac]{padding:.1em;border-radius:.3em;white-space:normal}.theme-mode-light .token.cdata[data-v-f12ba5ac],.theme-mode-light .token.comment[data-v-f12ba5ac],.theme-mode-light .token.doctype[data-v-f12ba5ac],.theme-mode-light .token.prolog[data-v-f12ba5ac]{color:#708090}.theme-mode-light .token.punctuation[data-v-f12ba5ac]{color:#999}.theme-mode-light .namespace[data-v-f12ba5ac]{opacity:.7}.theme-mode-light .token.boolean[data-v-f12ba5ac],.theme-mode-light .token.constant[data-v-f12ba5ac],.theme-mode-light .token.deleted[data-v-f12ba5ac],.theme-mode-light .token.number[data-v-f12ba5ac],.theme-mode-light .token.property[data-v-f12ba5ac],.theme-mode-light .token.symbol[data-v-f12ba5ac],.theme-mode-light .token.tag[data-v-f12ba5ac]{color:#905}.theme-mode-light .token.attr-name[data-v-f12ba5ac],.theme-mode-light .token.builtin[data-v-f12ba5ac],.theme-mode-light .token.char[data-v-f12ba5ac],.theme-mode-light .token.inserted[data-v-f12ba5ac],.theme-mode-light .token.selector[data-v-f12ba5ac],.theme-mode-light .token.string[data-v-f12ba5ac]{color:#690}.theme-mode-light .language-css .token.string[data-v-f12ba5ac],.theme-mode-light .style .token.string[data-v-f12ba5ac],.theme-mode-light .token.entity[data-v-f12ba5ac],.theme-mode-light .token.operator[data-v-f12ba5ac],.theme-mode-light .token.url[data-v-f12ba5ac]{color:#9a6e3a;background:hsla(0,0%,100%,.5)}.theme-mode-light .token.atrule[data-v-f12ba5ac],.theme-mode-light .token.attr-value[data-v-f12ba5ac],.theme-mode-light .token.keyword[data-v-f12ba5ac]{color:#07a}.theme-mode-light .token.class-name[data-v-f12ba5ac],.theme-mode-light .token.function[data-v-f12ba5ac]{color:#dd4a68}.theme-mode-light .token.important[data-v-f12ba5ac],.theme-mode-light .token.regex[data-v-f12ba5ac],.theme-mode-light .token.variable[data-v-f12ba5ac]{color:#e90}.theme-mode-light .token.bold[data-v-f12ba5ac],.theme-mode-light .token.important[data-v-f12ba5ac]{font-weight:700}.theme-mode-light .token.italic[data-v-f12ba5ac]{font-style:italic}.theme-mode-light .token.entity[data-v-f12ba5ac]{cursor:help}.theme-mode-light div[class*=language-] .highlight-lines .highlighted[data-v-f12ba5ac],.theme-mode-light div[class*=language-].line-numbers-mode .highlight-lines .highlighted[data-v-f12ba5ac]:before{background-color:hsla(0,0%,78.4%,.4)}.theme-mode-dark[data-v-f12ba5ac]{--bodyBg:#27272b;--mainBg:#1e1e22;--sidebarBg:rgba(30,30,34,0.8);--blurBg:rgba(30,30,34,0.8);--customBlockBg:#27272b;--textColor:#9b9baa;--textLightenColor:#0085ad;--borderColor:#30363d;--codeBg:#252526;--codeColor:#fff}.theme-mode-dark code[class*=language-][data-v-f12ba5ac],.theme-mode-dark pre[class*=language-][data-v-f12ba5ac]{color:#ccc;background:none;text-shadow:none;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;hyphens:none}.theme-mode-dark pre[class*=language-][data-v-f12ba5ac]{padding:1em;margin:.5em 0;overflow:auto}.theme-mode-dark :not(pre)>code[class*=language-][data-v-f12ba5ac],.theme-mode-dark pre[class*=language-][data-v-f12ba5ac]{background:#2d2d2d}.theme-mode-dark :not(pre)>code[class*=language-][data-v-f12ba5ac]{padding:.1em;border-radius:.3em;white-space:normal}.theme-mode-dark .token.block-comment[data-v-f12ba5ac],.theme-mode-dark .token.cdata[data-v-f12ba5ac],.theme-mode-dark .token.comment[data-v-f12ba5ac],.theme-mode-dark .token.doctype[data-v-f12ba5ac],.theme-mode-dark .token.prolog[data-v-f12ba5ac]{color:#999}.theme-mode-dark .token.punctuation[data-v-f12ba5ac]{color:#ccc}.theme-mode-dark .token.attr-name[data-v-f12ba5ac],.theme-mode-dark .token.deleted[data-v-f12ba5ac],.theme-mode-dark .token.namespace[data-v-f12ba5ac],.theme-mode-dark .token.tag[data-v-f12ba5ac]{color:#e2777a}.theme-mode-dark .token.function-name[data-v-f12ba5ac]{color:#6196cc}.theme-mode-dark .token.boolean[data-v-f12ba5ac],.theme-mode-dark .token.function[data-v-f12ba5ac],.theme-mode-dark .token.number[data-v-f12ba5ac]{color:#f08d49}.theme-mode-dark .token.class-name[data-v-f12ba5ac],.theme-mode-dark .token.constant[data-v-f12ba5ac],.theme-mode-dark .token.property[data-v-f12ba5ac],.theme-mode-dark .token.symbol[data-v-f12ba5ac]{color:#f8c555}.theme-mode-dark .token.atrule[data-v-f12ba5ac],.theme-mode-dark .token.builtin[data-v-f12ba5ac],.theme-mode-dark .token.important[data-v-f12ba5ac],.theme-mode-dark .token.keyword[data-v-f12ba5ac],.theme-mode-dark .token.selector[data-v-f12ba5ac]{color:#cc99cd}.theme-mode-dark .token.attr-value[data-v-f12ba5ac],.theme-mode-dark .token.char[data-v-f12ba5ac],.theme-mode-dark .token.regex[data-v-f12ba5ac],.theme-mode-dark .token.string[data-v-f12ba5ac],.theme-mode-dark .token.variable[data-v-f12ba5ac]{color:#7ec699}.theme-mode-dark .token.entity[data-v-f12ba5ac],.theme-mode-dark .token.operator[data-v-f12ba5ac],.theme-mode-dark .token.url[data-v-f12ba5ac]{color:#67cdcc}.theme-mode-dark .language-css .token.string[data-v-f12ba5ac],.theme-mode-dark .style .token.string[data-v-f12ba5ac],.theme-mode-dark .token.entity[data-v-f12ba5ac],.theme-mode-dark .token.operator[data-v-f12ba5ac],.theme-mode-dark .token.url[data-v-f12ba5ac]{background:none}.theme-mode-dark .token.bold[data-v-f12ba5ac],.theme-mode-dark .token.important[data-v-f12ba5ac]{font-weight:700}.theme-mode-dark .token.italic[data-v-f12ba5ac]{font-style:italic}.theme-mode-dark .token.entity[data-v-f12ba5ac]{cursor:help}.theme-mode-dark .token.inserted[data-v-f12ba5ac]{color:green}.theme-mode-read[data-v-f12ba5ac]{--bodyBg:#ececcc;--mainBg:#f5f5d5;--sidebarBg:rgba(245,245,213,0.8);--blurBg:rgba(245,245,213,0.9);--customBlockBg:#ececcc;--textColor:#704214;--textLightenColor:#963;--borderColor:rgba(0,0,0,0.15);--codeBg:#282c34;--codeColor:#fff}.theme-mode-read code[class*=language-][data-v-f12ba5ac],.theme-mode-read pre[class*=language-][data-v-f12ba5ac]{color:#ccc;background:none;text-shadow:none;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;hyphens:none}.theme-mode-read pre[class*=language-][data-v-f12ba5ac]{padding:1em;margin:.5em 0;overflow:auto}.theme-mode-read :not(pre)>code[class*=language-][data-v-f12ba5ac],.theme-mode-read pre[class*=language-][data-v-f12ba5ac]{background:#2d2d2d}.theme-mode-read :not(pre)>code[class*=language-][data-v-f12ba5ac]{padding:.1em;border-radius:.3em;white-space:normal}.theme-mode-read .token.block-comment[data-v-f12ba5ac],.theme-mode-read .token.cdata[data-v-f12ba5ac],.theme-mode-read .token.comment[data-v-f12ba5ac],.theme-mode-read .token.doctype[data-v-f12ba5ac],.theme-mode-read .token.prolog[data-v-f12ba5ac]{color:#999}.theme-mode-read .token.punctuation[data-v-f12ba5ac]{color:#ccc}.theme-mode-read .token.attr-name[data-v-f12ba5ac],.theme-mode-read .token.deleted[data-v-f12ba5ac],.theme-mode-read .token.namespace[data-v-f12ba5ac],.theme-mode-read .token.tag[data-v-f12ba5ac]{color:#e2777a}.theme-mode-read .token.function-name[data-v-f12ba5ac]{color:#6196cc}.theme-mode-read .token.boolean[data-v-f12ba5ac],.theme-mode-read .token.function[data-v-f12ba5ac],.theme-mode-read .token.number[data-v-f12ba5ac]{color:#f08d49}.theme-mode-read .token.class-name[data-v-f12ba5ac],.theme-mode-read .token.constant[data-v-f12ba5ac],.theme-mode-read .token.property[data-v-f12ba5ac],.theme-mode-read .token.symbol[data-v-f12ba5ac]{color:#f8c555}.theme-mode-read .token.atrule[data-v-f12ba5ac],.theme-mode-read .token.builtin[data-v-f12ba5ac],.theme-mode-read .token.important[data-v-f12ba5ac],.theme-mode-read .token.keyword[data-v-f12ba5ac],.theme-mode-read .token.selector[data-v-f12ba5ac]{color:#cc99cd}.theme-mode-read .token.attr-value[data-v-f12ba5ac],.theme-mode-read .token.char[data-v-f12ba5ac],.theme-mode-read .token.regex[data-v-f12ba5ac],.theme-mode-read .token.string[data-v-f12ba5ac],.theme-mode-read .token.variable[data-v-f12ba5ac]{color:#7ec699}.theme-mode-read .token.entity[data-v-f12ba5ac],.theme-mode-read .token.operator[data-v-f12ba5ac],.theme-mode-read .token.url[data-v-f12ba5ac]{color:#67cdcc}.theme-mode-read .language-css .token.string[data-v-f12ba5ac],.theme-mode-read .style .token.string[data-v-f12ba5ac],.theme-mode-read .token.entity[data-v-f12ba5ac],.theme-mode-read .token.operator[data-v-f12ba5ac],.theme-mode-read .token.url[data-v-f12ba5ac]{background:none}.theme-mode-read .token.bold[data-v-f12ba5ac],.theme-mode-read .token.important[data-v-f12ba5ac]{font-weight:700}.theme-mode-read .token.italic[data-v-f12ba5ac]{font-style:italic}.theme-mode-read .token.entity[data-v-f12ba5ac]{cursor:help}.theme-mode-read .token.inserted[data-v-f12ba5ac]{color:green}.theme-style-line.theme-mode-light[data-v-f12ba5ac]{--bodyBg:#fff}.theme-style-line.theme-mode-dark[data-v-f12ba5ac]{--bodyBg:#1e1e22}.theme-style-line.theme-mode-read[data-v-f12ba5ac]{--bodyBg:#f5f5d5}.theme-vdoing-content[data-v-f12ba5ac]{margin-bottom:3.6rem}.title-tag[data-v-f12ba5ac]{border:1px solid #ff5722;color:#ff5722;font-size:.8rem;padding:0 .35rem;border-radius:.2rem;margin-left:0;transform:translateY(-.05rem);display:inline-block}dd[data-v-f12ba5ac],dl[data-v-f12ba5ac]{margin:0}.column-wrapper[data-v-f12ba5ac]{margin-top:1rem;display:flex;padding-bottom:2rem;border-bottom:1px solid var(--borderColor)}.column-wrapper img[data-v-f12ba5ac]{width:80px;height:80px;border-radius:2px;margin-right:1rem}.column-wrapper .column-info .title[data-v-f12ba5ac]{font-size:1.6rem}.column-wrapper .column-info .description[data-v-f12ba5ac]{color:var(--textColor);opacity:.8;margin:.5rem 0}.catalogue-wrapper .catalogue-title[data-v-f12ba5ac]{font-size:1.45rem;margin:2rem 0}.catalogue-wrapper .catalogue-content dl[data-v-f12ba5ac]{margin-bottom:1.8rem}.catalogue-wrapper .catalogue-content dl.inline[data-v-f12ba5ac]{display:inline-block;width:50%;margin-bottom:1rem}@media (max-width:419px){.catalogue-wrapper .catalogue-content dl.inline[data-v-f12ba5ac]{width:100%}}.catalogue-wrapper .catalogue-content dl.inline a[data-v-f12ba5ac]{width:100%}.catalogue-wrapper .catalogue-content dl:not(.inline) dt[data-v-f12ba5ac]{margin-top:-3.6rem;padding-top:3.6rem}.catalogue-wrapper .catalogue-content dl dt[data-v-f12ba5ac]{font-size:1.1rem}.catalogue-wrapper .catalogue-content dl dt:hover .header-anchor[data-v-f12ba5ac]{opacity:1}.catalogue-wrapper .catalogue-content dl dd[data-v-f12ba5ac]{margin-top:.7rem;margin-left:1rem}.catalogue-wrapper .catalogue-content dl dd a[data-v-f12ba5ac]:not(.header-anchor){margin-bottom:.5rem;display:inline-block;width:50%}.catalogue-wrapper .catalogue-content dl dd a[data-v-f12ba5ac]:not(.header-anchor):hover{color:#ff5722;text-decoration:none}@media (max-width:720px){.catalogue-wrapper .catalogue-content dl dd a[data-v-f12ba5ac]:not(.header-anchor){width:100%}}.catalogue-wrapper .catalogue-content dl .sub-cat-wrap[data-v-f12ba5ac]{margin:5px 0 8px;font-size:.95rem}.catalogue-wrapper .catalogue-content dl .sub-cat-wrap>a[data-v-f12ba5ac]{padding-left:1rem;box-sizing:border-box}.catalogue-wrapper .catalogue-content dl .sub-cat-wrap .sub-title[data-v-f12ba5ac]{margin-top:-3.6rem;padding-top:3.6rem;margin-bottom:6px;font-size:1rem}.catalogue-wrapper .catalogue-content dl .sub-cat-wrap:hover .header-anchor[data-v-f12ba5ac]{opacity:1}.theme-style-line .right-menu-wrapper .right-menu-margin{border-left:1px solid var(--borderColor)}.right-menu-wrapper{width:230px;float:right;margin-right:-285px;position:sticky;top:0;font-size:.8rem}.right-menu-wrapper .right-menu-margin{margin-top:4.6rem;border-radius:3px;overflow:hidden}.right-menu-wrapper .right-menu-title{padding:10px 15px 0;background:var(--mainBg);font-size:1rem}.right-menu-wrapper .right-menu-title:after{content:"";display:block;width:100%;height:1px;background:var(--borderColor);margin-top:10px}.right-menu-wrapper .right-menu-content{max-height:80vh;position:relative;overflow:hidden;background:var(--mainBg);padding:4px 3px 4px 0}.right-menu-wrapper .right-menu-content::-webkit-scrollbar{width:3px;height:3px}.right-menu-wrapper .right-menu-content::-webkit-scrollbar-track-piece{background:none}.right-menu-wrapper .right-menu-content::-webkit-scrollbar-thumb:vertical{background-color:hsla(0,0%,49%,.3)}.right-menu-wrapper .right-menu-content:hover{overflow-y:auto;padding-right:0}.right-menu-wrapper .right-menu-content .right-menu-item{padding:4px 15px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;position:relative}.right-menu-wrapper .right-menu-content .right-menu-item.level2{font-size:.8rem}.right-menu-wrapper .right-menu-content .right-menu-item.level3{padding-left:27px}.right-menu-wrapper .right-menu-content .right-menu-item.level4{padding-left:37px}.right-menu-wrapper .right-menu-content .right-menu-item.level5{padding-left:47px}.right-menu-wrapper .right-menu-content .right-menu-item.level6{padding-left:57px}.right-menu-wrapper .right-menu-content .right-menu-item.active:before{content:"";position:absolute;top:5px;left:0;width:3px;height:14px;background:#11a8cd;border-radius:0 4px 4px 0}.right-menu-wrapper .right-menu-content .right-menu-item.active a{color:#11a8cd;opacity:1}.right-menu-wrapper .right-menu-content .right-menu-item a{color:var(--textColor);opacity:.75;display:inline-block;width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.right-menu-wrapper .right-menu-content .right-menu-item a:hover{opacity:1}.right-menu-wrapper .right-menu-content:hover{color:#11a8cd}.page>*{max-width:860px;margin:0 auto;padding:1rem 2.5rem 2rem}.page>:not(.footer){background:var(--mainBg);box-shadow:0 1px 2px 0 rgba(0,0,0,.1);margin-bottom:1rem}@media (min-width:940px){.page>:not(.footer){border-radius:2px}}@media (max-width:959px){.page>*{padding:1rem 2rem}}@media (max-width:419px){.page>*{padding:1rem 1.5rem}}.page{padding-bottom:2rem;display:block}@media (max-width:719px){.page{padding-top:3.6rem}}@media (min-width:719px){.page{padding-top:5.1rem}}@media (min-width:719px){.theme-style-line .page{padding-top:3.6rem}}.theme-style-line .page>:not(.footer){box-shadow:0 0}@media (min-width:720px){.theme-style-line .page .placeholder{height:1.2rem}}.theme-vdoing-wrapper .content-wrapper{position:relative}.theme-vdoing-wrapper h1 .title-tag{height:1.5rem;line-height:1.5rem;border:1px solid #ff5722;color:#ff5722;font-size:1rem;padding:0 .4rem;border-radius:.2rem;margin-left:.5rem;transform:translateY(-.25rem);display:inline-block}.theme-vdoing-wrapper h1 img{margin-bottom:-.2rem;margin-right:.2rem;max-width:2.2rem;max-height:2.2rem}.theme-vdoing-wrapper{--linesColor:rgba(50,0,0,0.05)}.theme-vdoing-wrapper.bg-style-1{background-image:linear-gradient(90deg,var(--linesColor) 3%,transparent 0),linear-gradient(0deg,var(--linesColor) 3%,transparent 0);background-position:50%;background-size:20px 20px}.theme-vdoing-wrapper.bg-style-2{background-image:repeating-linear-gradient(0,var(--linesColor),var(--linesColor) 1px,transparent 0,transparent 50%);background-size:30px 30px}.theme-vdoing-wrapper.bg-style-3{background-image:repeating-linear-gradient(90deg,var(--linesColor),var(--linesColor) 1px,transparent 0,transparent 50%);background-size:30px 30px}.theme-vdoing-wrapper.bg-style-4{background-image:repeating-linear-gradient(-45deg,var(--linesColor),var(--linesColor) 1px,transparent 0,transparent 50%);background-size:20px 20px}.theme-vdoing-wrapper.bg-style-5{background-image:repeating-linear-gradient(45deg,var(--linesColor),var(--linesColor) 1px,transparent 0,transparent 50%);background-size:20px 20px}.theme-vdoing-wrapper.bg-style-6{background-image:radial-gradient(var(--linesColor) 1px,transparent 0);background-size:10px 10px}.theme-mode-dark .theme-vdoing-wrapper{--linesColor:hsla(0,0%,49%,0.05)}@media (min-width:720px) and (max-width:1279px){.have-rightmenu .page{padding-right:.8rem!important}}@media (max-width:1279px){.have-rightmenu .right-menu-wrapper{display:none}}@media (min-width:1280px){.have-rightmenu .sidebar .sidebar-sub-headers{display:none}}.theme-container.only-sidebarItem:not(.have-rightmenu) .sidebar,.theme-container.only-sidebarItem:not(.have-rightmenu) .sidebar-button{display:none}@media (min-width:720px){.theme-container.only-sidebarItem:not(.have-rightmenu) .page{padding-left:.8rem!important}}@media (max-width:719px){.theme-container.only-sidebarItem:not(.have-rightmenu) .page{padding-left:0!important}.theme-container.only-sidebarItem:not(.have-rightmenu) .sidebar,.theme-container.only-sidebarItem:not(.have-rightmenu) .sidebar-button{display:block}}@media (min-width:720px) and (max-width:1279px){.theme-container.only-sidebarItem.have-rightmenu .sidebar,.theme-container.only-sidebarItem.have-rightmenu .sidebar-button{display:block}}@media (min-width:1280px){.theme-container.only-sidebarItem.have-rightmenu .sidebar,.theme-container.only-sidebarItem.have-rightmenu .sidebar-button{display:none}}.categories-page .categories-wrapper{position:sticky;top:4.5rem;max-height:calc(100vh - 10rem);min-height:4.2rem}@media (max-width:719px){.categories-page .categories-wrapper{display:none}}.categories-page .categories-wrapper .categories{max-height:calc(100vh - 14rem);min-height:2.2rem;overflow-y:auto;transition:all .2s;position:relative}.categories-page .categories-wrapper .categories a{padding-right:1.8rem}.categories-page .categories-wrapper .categories a span{right:.4rem}.categories-page .categories-wrapper .categories::-webkit-scrollbar-track-piece{background-color:rgba(0,0,0,.05)}.categories-page .categories-wrapper .categories::-webkit-scrollbar-thumb:vertical{background-color:rgba(0,0,0,.15)}.categories-page .categories-wrapper .categories:hover::-webkit-scrollbar-track-piece{background-color:rgba(0,0,0,.1)}.categories-page .categories-wrapper .categories:hover::-webkit-scrollbar-thumb:vertical{background-color:rgba(0,0,0,.25)}.categories-page .main-left .categories-wrapper{position:relative;top:0;padding:.9rem 1.5rem;margin-bottom:.9rem;max-height:15rem;border-radius:0;display:none}@media (max-width:719px){.categories-page .main-left .categories-wrapper{display:block}}.categories-page .main-left .categories-wrapper .categories{max-height:12.3rem}@media (max-width:719px){.theme-style-line .categories-page .main-left .categories-wrapper{margin-top:-.91rem;margin-bottom:-1px;padding:.9rem .2rem .5rem}}.tags-page .tags-wrapper{position:sticky;top:4.5rem;max-height:calc(100vh - 10rem);min-height:4.2rem}@media (max-width:719px){.tags-page .tags-wrapper{display:none}}.tags-page .tags-wrapper .tags{max-height:calc(100vh - 14rem);min-height:2.2rem;overflow-x:hidden;overflow-y:auto;transition:all .2s}.tags-page .tags-wrapper .tags::-webkit-scrollbar-track-piece{background-color:rgba(0,0,0,.05)}.tags-page .tags-wrapper .tags::-webkit-scrollbar-thumb:vertical{background-color:rgba(0,0,0,.15)}.tags-page .tags-wrapper .tags:hover::-webkit-scrollbar-track-piece{background-color:rgba(0,0,0,.1)}.tags-page .tags-wrapper .tags:hover::-webkit-scrollbar-thumb:vertical{background-color:rgba(0,0,0,.25)}.tags-page .main-left .tags-wrapper{position:relative;top:0;padding:.9rem 1.5rem;margin-bottom:.9rem;max-height:15rem;border-radius:0;display:none}@media (max-width:719px){.tags-page .main-left .tags-wrapper{display:block}}.tags-page .main-left .tags-wrapper .tags{max-height:11.5rem}@media (max-width:719px){.theme-style-line .tags-page .main-left .tags-wrapper{margin-top:-.91rem;margin-bottom:-1px}}.archives-page .theme-vdoing-wrapper{max-width:860px;margin:0 auto;padding:1rem 2.5rem 2rem}.archives-page .theme-vdoing-wrapper:not(.footer){background:var(--mainBg);box-shadow:0 1px 2px 0 rgba(0,0,0,.1);margin-bottom:1rem}@media (min-width:940px){.archives-page .theme-vdoing-wrapper:not(.footer){border-radius:2px}}@media (max-width:959px){.archives-page .theme-vdoing-wrapper{padding:1rem 2rem}}@media (max-width:419px){.archives-page .theme-vdoing-wrapper{padding:1rem 1.5rem}}.theme-style-line .archives-page .theme-vdoing-wrapper{box-shadow:0 0}.archives-page .theme-vdoing-wrapper{position:relative}@media (min-width:940px){.archives-page .theme-vdoing-wrapper{margin-top:1.5rem!important}}.archives-page .theme-vdoing-wrapper .count{text-align:right;margin-top:-2.5rem;font-size:.85rem;opacity:.8}.archives-page .theme-vdoing-wrapper li,.archives-page .theme-vdoing-wrapper ul{margin:0;padding:0}.archives-page .theme-vdoing-wrapper ul{margin-top:2rem}.archives-page .theme-vdoing-wrapper li{list-style:none}.archives-page .theme-vdoing-wrapper li.year{position:sticky;top:3.6rem;background:var(--mainBg);z-index:1}.archives-page .theme-vdoing-wrapper li.year:not(:first-child){margin-top:3.5rem}.archives-page .theme-vdoing-wrapper li h2{margin-bottom:.8rem;font-weight:400;padding:.5rem 0}.archives-page .theme-vdoing-wrapper li h2 span{font-size:.85rem;font-weight:300;float:right;margin-top:1rem}.archives-page .theme-vdoing-wrapper li a{display:block;color:var(--textColor);transition:padding .3s;padding:.5rem 2rem;line-height:1.2rem}.archives-page .theme-vdoing-wrapper li a:hover{padding-left:2.5rem;color:#11a8cd;background:#f9f9f9}@media (max-width:940px){.archives-page .theme-vdoing-wrapper li a{padding:.5rem 1rem;font-weight:400}.archives-page .theme-vdoing-wrapper li a:hover{padding-left:1.5rem}}.archives-page .theme-vdoing-wrapper li a span.date{opacity:.6;font-size:.85rem;font-weight:400;margin-right:.3rem}.archives-page .theme-vdoing-wrapper li a .title-tag{border:1px solid #ff5722;color:#ff5722;font-size:.8rem;padding:0 .35rem;border-radius:.2rem;margin-left:0;transform:translateY(-.05rem);display:inline-block}.archives-page .theme-vdoing-wrapper .loadmore{text-align:center;margin-top:1rem;opacity:.5}.theme-mode-dark .archives-page .theme-vdoing-wrapper li a:hover,.theme-mode-read .archives-page .theme-vdoing-wrapper li a:hover{background:var(--customBlockBg)}.hide-navbar .archives-page .theme-vdoing-wrapper li.year{top:0}.sidebar-group .sidebar-group{padding-left:.5em}.sidebar-group:not(.collapsable) .sidebar-heading:not(.clickable){cursor:auto;color:inherit}.sidebar-group.is-sub-group{padding-left:0}.sidebar-group.is-sub-group>.sidebar-heading{font-size:1.01em;line-height:1.4;font-weight:700;padding-left:2rem}.sidebar-group.is-sub-group>.sidebar-group-items{padding-left:1rem}.sidebar-group.is-sub-group>.sidebar-group-items>li>.sidebar-link{font-size:.98em;border-left:none}.sidebar-group.depth-2>.sidebar-heading{border-left:none}.sidebar-heading{color:var(--textColor);transition:color .15s ease;cursor:pointer;font-size:1.1em;font-weight:700;padding:.35rem 1.5rem .35rem 1.25rem;width:100%;box-sizing:border-box;margin:0;border-left:.25rem solid transparent}.sidebar-heading.open,.sidebar-heading:hover{color:inherit}.sidebar-heading .arrow{position:relative;top:-.12em;left:.5em}.sidebar-heading.clickable.active{font-weight:600;color:#11a8cd;border-left-color:#11a8cd}.sidebar-heading.clickable:hover{color:#11a8cd}.sidebar-group-items{transition:height .1s ease-out;font-size:.95em;overflow:hidden}.sidebar .sidebar-sub-headers{padding-left:1rem;font-size:.95em}.sidebar .sidebar-sub-headers .level4{padding-left:.2rem}.sidebar .sidebar-sub-headers .level5{padding-left:.4rem}.sidebar .sidebar-sub-headers .level6{padding-left:.6rem}a.sidebar-link{font-size:1em;font-weight:400;display:inline-block;color:var(--textColor);border-left:.25rem solid transparent;padding:.35rem 1rem .35rem 1.25rem;line-height:1.4;width:100%;box-sizing:border-box}a.sidebar-link:hover{color:#11a8cd}a.sidebar-link.active{font-weight:600;color:#11a8cd;border-left-color:#11a8cd}.sidebar-group a.sidebar-link{padding-left:2rem}.sidebar-sub-headers a.sidebar-link{padding-top:.25rem;padding-bottom:.25rem;border-left:none}.sidebar-sub-headers a.sidebar-link.active{font-weight:500}.sidebar ul{padding:0;margin:0;list-style-type:none}.sidebar a{display:inline-block}.sidebar .nav-links{display:none;border-bottom:1px solid var(--borderColor);padding:.5rem 0 .75rem}.sidebar .nav-links a{font-weight:600}.sidebar .nav-links .nav-item,.sidebar .nav-links .repo-link{display:block;line-height:1.25rem;font-size:1.1em;padding:.5rem 0 .5rem 1.5rem}.sidebar>.sidebar-links{padding:1.5rem 0}.sidebar>.sidebar-links>li>a.sidebar-link{font-size:1.1em;line-height:1.7;font-weight:700}.sidebar>.sidebar-links>li:not(:first-child){margin-top:.75rem}.sidebar .blogger{display:none;border-bottom:1px solid var(--borderColor)}.sidebar .blogger img{width:60px;height:60px;border-radius:5px;margin:.75rem 1rem}.sidebar .blogger .blogger-info{flex:1;padding:0 .3rem .3rem 0}.sidebar .blogger .blogger-info h3{margin:.95rem 0 .6rem;font-size:1.1rem}.sidebar .blogger .blogger-info .icons .iconfont{font-size:1.2rem;padding-right:.6rem;color:#777}.sidebar .sidebar-slot{margin-bottom:-.5rem;font-size:.85rem}.sidebar .sidebar-slot.sidebar-slot-top{padding:1.5rem 1.5rem 0}.sidebar .sidebar-slot.sidebar-slot-bottom{padding:0 1.5rem 1.5rem}@media (max-width:719px){.sidebar .blogger{display:flex}.sidebar .nav-links{display:block}.sidebar .nav-links .dropdown-wrapper .nav-dropdown .dropdown-item a.router-link-active:after{top:calc(1rem - 2px)}.sidebar>.sidebar-links{padding:1rem 0}}.yellowBorder{border-radius:5px;box-shadow:0 0 15px #ffe089!important}.buttons{position:fixed;right:2rem;bottom:2.5rem;z-index:11}@media (max-width:959px){.buttons{right:1rem;bottom:1.5rem}}.buttons .button{width:2.2rem;height:2.2rem;line-height:2.2rem;border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.15);margin-top:.9rem;text-align:center;cursor:pointer;transition:all .5s;background:var(--blurBg)}.buttons .button.hover{background:#11a8cd;box-shadow:0 0 15px #11a8cd}.buttons .button.hover:before{color:#fff}@media (any-hover:hover){.buttons .button:hover{background:#11a8cd;box-shadow:0 0 15px #11a8cd}.buttons .button:hover:before{color:#fff}}.buttons .button .select-box{margin:0;padding:.8rem 0;position:absolute;bottom:0;right:1.5rem;background:var(--mainBg);border:1px solid var(--borderColor);width:120px;border-radius:6px;box-shadow:0 0 15px hsla(0,0%,100%,.2)}.buttons .button .select-box li{list-style:none;line-height:2rem;font-size:.95rem}.buttons .button .select-box li:hover{color:#11a8cd}.buttons .button .select-box li.active{background-color:hsla(0,0%,58.8%,.2);color:#11a8cd}.mode-enter-active,.mode-leave-active{transition:all .3s}.mode-enter,.mode-leave-to{opacity:0;transform:scale(.8)}.fade-enter-active,.fade-leave-active{transition:opacity .2s}.fade-enter,.fade-leave-to{opacity:0}.footer{padding:5rem 1.5rem 2.5rem;text-align:center;color:#666;box-sizing:border-box;font-size:.85rem;transition:all .2s ease}.footer>span{line-height:1.5rem}.footer .icons{margin-bottom:12px}.footer .icons .iconfont{padding:0 10px;font-size:1.3rem}.footer a{color:inherit}.footer a:hover{color:#11a8cd}@media (min-width:720px){.sidebar-open .footer{width:auto;padding-left:19.5rem}}@media (min-width:1520px){.have-rightmenu .footer{padding-right:231.5px}}.no-sidebar .footer{width:auto;padding-left:1.5rem}.body-bg{position:fixed;left:0;top:0;z-index:-999999;height:100vh;width:100vw;transition:background .5s}.theme-mode-light{--bodyBg:#f4f4f4;--mainBg:#fff;--sidebarBg:hsla(0,0%,100%,0.8);--blurBg:hsla(0,0%,100%,0.9);--customBlockBg:#f1f1f1;--textColor:#00323c;--textLightenColor:#0085ad;--borderColor:rgba(0,0,0,0.12);--codeBg:#f6f6f6;--codeColor:#525252}.theme-mode-light code[class*=language-],.theme-mode-light pre[class*=language-]{color:#000;background:none;text-shadow:0 1px #fff;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;hyphens:none}.theme-mode-light code[class*=language-]::-moz-selection,.theme-mode-light code[class*=language-] ::-moz-selection,.theme-mode-light pre[class*=language-]::-moz-selection,.theme-mode-light pre[class*=language-] ::-moz-selection{text-shadow:none;background:#b3d4fc}.theme-mode-light code[class*=language-]::selection,.theme-mode-light code[class*=language-] ::selection,.theme-mode-light pre[class*=language-]::selection,.theme-mode-light pre[class*=language-] ::selection{text-shadow:none;background:#b3d4fc}@media print{.theme-mode-light code[class*=language-],.theme-mode-light pre[class*=language-]{text-shadow:none}}.theme-mode-light pre[class*=language-]{padding:1em;margin:.5em 0;overflow:auto}.theme-mode-light :not(pre)>code[class*=language-],.theme-mode-light pre[class*=language-]{background:#f5f2f0}.theme-mode-light :not(pre)>code[class*=language-]{padding:.1em;border-radius:.3em;white-space:normal}.theme-mode-light .token.cdata,.theme-mode-light .token.comment,.theme-mode-light .token.doctype,.theme-mode-light .token.prolog{color:#708090}.theme-mode-light .token.punctuation{color:#999}.theme-mode-light .namespace{opacity:.7}.theme-mode-light .token.boolean,.theme-mode-light .token.constant,.theme-mode-light .token.deleted,.theme-mode-light .token.number,.theme-mode-light .token.property,.theme-mode-light .token.symbol,.theme-mode-light .token.tag{color:#905}.theme-mode-light .token.attr-name,.theme-mode-light .token.builtin,.theme-mode-light .token.char,.theme-mode-light .token.inserted,.theme-mode-light .token.selector,.theme-mode-light .token.string{color:#690}.theme-mode-light .language-css .token.string,.theme-mode-light .style .token.string,.theme-mode-light .token.entity,.theme-mode-light .token.operator,.theme-mode-light .token.url{color:#9a6e3a;background:hsla(0,0%,100%,.5)}.theme-mode-light .token.atrule,.theme-mode-light .token.attr-value,.theme-mode-light .token.keyword{color:#07a}.theme-mode-light .token.class-name,.theme-mode-light .token.function{color:#dd4a68}.theme-mode-light .token.important,.theme-mode-light .token.regex,.theme-mode-light .token.variable{color:#e90}.theme-mode-light .token.bold,.theme-mode-light .token.important{font-weight:700}.theme-mode-light .token.italic{font-style:italic}.theme-mode-light .token.entity{cursor:help}.theme-mode-light div[class*=language-] .highlight-lines .highlighted,.theme-mode-light div[class*=language-].line-numbers-mode .highlight-lines .highlighted:before{background-color:hsla(0,0%,78.4%,.4)}.theme-mode-dark{--bodyBg:#27272b;--mainBg:#1e1e22;--sidebarBg:rgba(30,30,34,0.8);--blurBg:rgba(30,30,34,0.8);--customBlockBg:#27272b;--textColor:#9b9baa;--textLightenColor:#0085ad;--borderColor:#30363d;--codeBg:#252526;--codeColor:#fff}.theme-mode-dark code[class*=language-],.theme-mode-dark pre[class*=language-]{color:#ccc;background:none;text-shadow:none;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;hyphens:none}.theme-mode-dark pre[class*=language-]{padding:1em;margin:.5em 0;overflow:auto}.theme-mode-dark :not(pre)>code[class*=language-],.theme-mode-dark pre[class*=language-]{background:#2d2d2d}.theme-mode-dark :not(pre)>code[class*=language-]{padding:.1em;border-radius:.3em;white-space:normal}.theme-mode-dark .token.block-comment,.theme-mode-dark .token.cdata,.theme-mode-dark .token.comment,.theme-mode-dark .token.doctype,.theme-mode-dark .token.prolog{color:#999}.theme-mode-dark .token.punctuation{color:#ccc}.theme-mode-dark .token.attr-name,.theme-mode-dark .token.deleted,.theme-mode-dark .token.namespace,.theme-mode-dark .token.tag{color:#e2777a}.theme-mode-dark .token.function-name{color:#6196cc}.theme-mode-dark .token.boolean,.theme-mode-dark .token.function,.theme-mode-dark .token.number{color:#f08d49}.theme-mode-dark .token.class-name,.theme-mode-dark .token.constant,.theme-mode-dark .token.property,.theme-mode-dark .token.symbol{color:#f8c555}.theme-mode-dark .token.atrule,.theme-mode-dark .token.builtin,.theme-mode-dark .token.important,.theme-mode-dark .token.keyword,.theme-mode-dark .token.selector{color:#cc99cd}.theme-mode-dark .token.attr-value,.theme-mode-dark .token.char,.theme-mode-dark .token.regex,.theme-mode-dark .token.string,.theme-mode-dark .token.variable{color:#7ec699}.theme-mode-dark .token.entity,.theme-mode-dark .token.operator,.theme-mode-dark .token.url{color:#67cdcc}.theme-mode-dark .language-css .token.string,.theme-mode-dark .style .token.string,.theme-mode-dark .token.entity,.theme-mode-dark .token.operator,.theme-mode-dark .token.url{background:none}.theme-mode-dark .token.bold,.theme-mode-dark .token.important{font-weight:700}.theme-mode-dark .token.italic{font-style:italic}.theme-mode-dark .token.entity{cursor:help}.theme-mode-dark .token.inserted{color:green}.theme-mode-read{--bodyBg:#ececcc;--mainBg:#f5f5d5;--sidebarBg:rgba(245,245,213,0.8);--blurBg:rgba(245,245,213,0.9);--customBlockBg:#ececcc;--textColor:#704214;--textLightenColor:#963;--borderColor:rgba(0,0,0,0.15);--codeBg:#282c34;--codeColor:#fff}.theme-mode-read code[class*=language-],.theme-mode-read pre[class*=language-]{color:#ccc;background:none;text-shadow:none;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;hyphens:none}.theme-mode-read pre[class*=language-]{padding:1em;margin:.5em 0;overflow:auto}.theme-mode-read :not(pre)>code[class*=language-],.theme-mode-read pre[class*=language-]{background:#2d2d2d}.theme-mode-read :not(pre)>code[class*=language-]{padding:.1em;border-radius:.3em;white-space:normal}.theme-mode-read .token.block-comment,.theme-mode-read .token.cdata,.theme-mode-read .token.comment,.theme-mode-read .token.doctype,.theme-mode-read .token.prolog{color:#999}.theme-mode-read .token.punctuation{color:#ccc}.theme-mode-read .token.attr-name,.theme-mode-read .token.deleted,.theme-mode-read .token.namespace,.theme-mode-read .token.tag{color:#e2777a}.theme-mode-read .token.function-name{color:#6196cc}.theme-mode-read .token.boolean,.theme-mode-read .token.function,.theme-mode-read .token.number{color:#f08d49}.theme-mode-read .token.class-name,.theme-mode-read .token.constant,.theme-mode-read .token.property,.theme-mode-read .token.symbol{color:#f8c555}.theme-mode-read .token.atrule,.theme-mode-read .token.builtin,.theme-mode-read .token.important,.theme-mode-read .token.keyword,.theme-mode-read .token.selector{color:#cc99cd}.theme-mode-read .token.attr-value,.theme-mode-read .token.char,.theme-mode-read .token.regex,.theme-mode-read .token.string,.theme-mode-read .token.variable{color:#7ec699}.theme-mode-read .token.entity,.theme-mode-read .token.operator,.theme-mode-read .token.url{color:#67cdcc}.theme-mode-read .language-css .token.string,.theme-mode-read .style .token.string,.theme-mode-read .token.entity,.theme-mode-read .token.operator,.theme-mode-read .token.url{background:none}.theme-mode-read .token.bold,.theme-mode-read .token.important{font-weight:700}.theme-mode-read .token.italic{font-style:italic}.theme-mode-read .token.entity{cursor:help}.theme-mode-read .token.inserted{color:green}.theme-style-line.theme-mode-light{--bodyBg:#fff}.theme-style-line.theme-mode-dark{--bodyBg:#1e1e22}.theme-style-line.theme-mode-read{--bodyBg:#f5f5d5}.custom-html-window{position:fixed;bottom:0;display:flex;overflow:hidden;font-weight:350}@media (max-width:960px){.custom-html-window{display:none}}.custom-html-window .custom-wrapper{position:relative;max-width:200px;max-height:400px}.custom-html-window .custom-wrapper .close-but{cursor:pointer;position:absolute;right:0;top:0;font-size:1.5rem;line-height:1.5rem;width:1.5rem;height:1.5rem;opacity:0;transition:all .2s}.custom-html-window .custom-wrapper .close-but:hover{opacity:.9}.custom-html-window .custom-wrapper:hover .close-but{opacity:.7}.custom-html-window.custom-html-window-lb{left:0;z-index:99}.custom-html-window.custom-html-window-lb>*{align-self:flex-end}.custom-html-window.custom-html-window-rb{right:80px;z-index:10;justify-content:flex-end}.custom-html-window.custom-html-window-rb>*{align-self:flex-end}#app>div.theme-container.sidebar-open.have-rightmenu.only-sidebarItem>div:nth-child(5)>main>div.theme-vdoing-wrapper>div.content-wrapper>div.theme-vdoing-content.content__default>table:nth-child(30)>thead>tr>th[data-v-2fa38447]:first-child{width:75px}.doc-deleted[data-v-2fa38447]{position:relative;text-decoration:none}.doc-deleted[data-v-2fa38447]:before{content:"";position:absolute;left:0;bottom:35%;width:100%;height:1px;background-color:#000}.become-sponsor{padding:8px 20px;display:inline-block;color:#11a8cd;border-radius:30px;box-sizing:border-box;border:1px solid #11a8cd}.theme-mode-light[data-v-3f5e71b8]{--bodyBg:#f4f4f4;--mainBg:#fff;--sidebarBg:hsla(0,0%,100%,0.8);--blurBg:hsla(0,0%,100%,0.9);--customBlockBg:#f1f1f1;--textColor:#00323c;--textLightenColor:#0085ad;--borderColor:rgba(0,0,0,0.12);--codeBg:#f6f6f6;--codeColor:#525252}.theme-mode-light code[class*=language-][data-v-3f5e71b8],.theme-mode-light pre[class*=language-][data-v-3f5e71b8]{color:#000;background:none;text-shadow:0 1px #fff;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;hyphens:none}.theme-mode-light code[class*=language-][data-v-3f5e71b8]::-moz-selection,.theme-mode-light code[class*=language-][data-v-3f5e71b8] ::-moz-selection,.theme-mode-light pre[class*=language-][data-v-3f5e71b8]::-moz-selection,.theme-mode-light pre[class*=language-][data-v-3f5e71b8] ::-moz-selection{text-shadow:none;background:#b3d4fc}.theme-mode-light code[class*=language-][data-v-3f5e71b8]::selection,.theme-mode-light code[class*=language-][data-v-3f5e71b8] ::selection,.theme-mode-light pre[class*=language-][data-v-3f5e71b8]::selection,.theme-mode-light pre[class*=language-][data-v-3f5e71b8] ::selection{text-shadow:none;background:#b3d4fc}@media print{.theme-mode-light code[class*=language-][data-v-3f5e71b8],.theme-mode-light pre[class*=language-][data-v-3f5e71b8]{text-shadow:none}}.theme-mode-light pre[class*=language-][data-v-3f5e71b8]{padding:1em;margin:.5em 0;overflow:auto}.theme-mode-light :not(pre)>code[class*=language-][data-v-3f5e71b8],.theme-mode-light pre[class*=language-][data-v-3f5e71b8]{background:#f5f2f0}.theme-mode-light :not(pre)>code[class*=language-][data-v-3f5e71b8]{padding:.1em;border-radius:.3em;white-space:normal}.theme-mode-light .token.cdata[data-v-3f5e71b8],.theme-mode-light .token.comment[data-v-3f5e71b8],.theme-mode-light .token.doctype[data-v-3f5e71b8],.theme-mode-light .token.prolog[data-v-3f5e71b8]{color:#708090}.theme-mode-light .token.punctuation[data-v-3f5e71b8]{color:#999}.theme-mode-light .namespace[data-v-3f5e71b8]{opacity:.7}.theme-mode-light .token.boolean[data-v-3f5e71b8],.theme-mode-light .token.constant[data-v-3f5e71b8],.theme-mode-light .token.deleted[data-v-3f5e71b8],.theme-mode-light .token.number[data-v-3f5e71b8],.theme-mode-light .token.property[data-v-3f5e71b8],.theme-mode-light .token.symbol[data-v-3f5e71b8],.theme-mode-light .token.tag[data-v-3f5e71b8]{color:#905}.theme-mode-light .token.attr-name[data-v-3f5e71b8],.theme-mode-light .token.builtin[data-v-3f5e71b8],.theme-mode-light .token.char[data-v-3f5e71b8],.theme-mode-light .token.inserted[data-v-3f5e71b8],.theme-mode-light .token.selector[data-v-3f5e71b8],.theme-mode-light .token.string[data-v-3f5e71b8]{color:#690}.theme-mode-light .language-css .token.string[data-v-3f5e71b8],.theme-mode-light .style .token.string[data-v-3f5e71b8],.theme-mode-light .token.entity[data-v-3f5e71b8],.theme-mode-light .token.operator[data-v-3f5e71b8],.theme-mode-light .token.url[data-v-3f5e71b8]{color:#9a6e3a;background:hsla(0,0%,100%,.5)}.theme-mode-light .token.atrule[data-v-3f5e71b8],.theme-mode-light .token.attr-value[data-v-3f5e71b8],.theme-mode-light .token.keyword[data-v-3f5e71b8]{color:#07a}.theme-mode-light .token.class-name[data-v-3f5e71b8],.theme-mode-light .token.function[data-v-3f5e71b8]{color:#dd4a68}.theme-mode-light .token.important[data-v-3f5e71b8],.theme-mode-light .token.regex[data-v-3f5e71b8],.theme-mode-light .token.variable[data-v-3f5e71b8]{color:#e90}.theme-mode-light .token.bold[data-v-3f5e71b8],.theme-mode-light .token.important[data-v-3f5e71b8]{font-weight:700}.theme-mode-light .token.italic[data-v-3f5e71b8]{font-style:italic}.theme-mode-light .token.entity[data-v-3f5e71b8]{cursor:help}.theme-mode-light div[class*=language-] .highlight-lines .highlighted[data-v-3f5e71b8],.theme-mode-light div[class*=language-].line-numbers-mode .highlight-lines .highlighted[data-v-3f5e71b8]:before{background-color:hsla(0,0%,78.4%,.4)}.theme-mode-dark[data-v-3f5e71b8]{--bodyBg:#27272b;--mainBg:#1e1e22;--sidebarBg:rgba(30,30,34,0.8);--blurBg:rgba(30,30,34,0.8);--customBlockBg:#27272b;--textColor:#9b9baa;--textLightenColor:#0085ad;--borderColor:#30363d;--codeBg:#252526;--codeColor:#fff}.theme-mode-dark code[class*=language-][data-v-3f5e71b8],.theme-mode-dark pre[class*=language-][data-v-3f5e71b8]{color:#ccc;background:none;text-shadow:none;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;hyphens:none}.theme-mode-dark pre[class*=language-][data-v-3f5e71b8]{padding:1em;margin:.5em 0;overflow:auto}.theme-mode-dark :not(pre)>code[class*=language-][data-v-3f5e71b8],.theme-mode-dark pre[class*=language-][data-v-3f5e71b8]{background:#2d2d2d}.theme-mode-dark :not(pre)>code[class*=language-][data-v-3f5e71b8]{padding:.1em;border-radius:.3em;white-space:normal}.theme-mode-dark .token.block-comment[data-v-3f5e71b8],.theme-mode-dark .token.cdata[data-v-3f5e71b8],.theme-mode-dark .token.comment[data-v-3f5e71b8],.theme-mode-dark .token.doctype[data-v-3f5e71b8],.theme-mode-dark .token.prolog[data-v-3f5e71b8]{color:#999}.theme-mode-dark .token.punctuation[data-v-3f5e71b8]{color:#ccc}.theme-mode-dark .token.attr-name[data-v-3f5e71b8],.theme-mode-dark .token.deleted[data-v-3f5e71b8],.theme-mode-dark .token.namespace[data-v-3f5e71b8],.theme-mode-dark .token.tag[data-v-3f5e71b8]{color:#e2777a}.theme-mode-dark .token.function-name[data-v-3f5e71b8]{color:#6196cc}.theme-mode-dark .token.boolean[data-v-3f5e71b8],.theme-mode-dark .token.function[data-v-3f5e71b8],.theme-mode-dark .token.number[data-v-3f5e71b8]{color:#f08d49}.theme-mode-dark .token.class-name[data-v-3f5e71b8],.theme-mode-dark .token.constant[data-v-3f5e71b8],.theme-mode-dark .token.property[data-v-3f5e71b8],.theme-mode-dark .token.symbol[data-v-3f5e71b8]{color:#f8c555}.theme-mode-dark .token.atrule[data-v-3f5e71b8],.theme-mode-dark .token.builtin[data-v-3f5e71b8],.theme-mode-dark .token.important[data-v-3f5e71b8],.theme-mode-dark .token.keyword[data-v-3f5e71b8],.theme-mode-dark .token.selector[data-v-3f5e71b8]{color:#cc99cd}.theme-mode-dark .token.attr-value[data-v-3f5e71b8],.theme-mode-dark .token.char[data-v-3f5e71b8],.theme-mode-dark .token.regex[data-v-3f5e71b8],.theme-mode-dark .token.string[data-v-3f5e71b8],.theme-mode-dark .token.variable[data-v-3f5e71b8]{color:#7ec699}.theme-mode-dark .token.entity[data-v-3f5e71b8],.theme-mode-dark .token.operator[data-v-3f5e71b8],.theme-mode-dark .token.url[data-v-3f5e71b8]{color:#67cdcc}.theme-mode-dark .language-css .token.string[data-v-3f5e71b8],.theme-mode-dark .style .token.string[data-v-3f5e71b8],.theme-mode-dark .token.entity[data-v-3f5e71b8],.theme-mode-dark .token.operator[data-v-3f5e71b8],.theme-mode-dark .token.url[data-v-3f5e71b8]{background:none}.theme-mode-dark .token.bold[data-v-3f5e71b8],.theme-mode-dark .token.important[data-v-3f5e71b8]{font-weight:700}.theme-mode-dark .token.italic[data-v-3f5e71b8]{font-style:italic}.theme-mode-dark .token.entity[data-v-3f5e71b8]{cursor:help}.theme-mode-dark .token.inserted[data-v-3f5e71b8]{color:green}.theme-mode-read[data-v-3f5e71b8]{--bodyBg:#ececcc;--mainBg:#f5f5d5;--sidebarBg:rgba(245,245,213,0.8);--blurBg:rgba(245,245,213,0.9);--customBlockBg:#ececcc;--textColor:#704214;--textLightenColor:#963;--borderColor:rgba(0,0,0,0.15);--codeBg:#282c34;--codeColor:#fff}.theme-mode-read code[class*=language-][data-v-3f5e71b8],.theme-mode-read pre[class*=language-][data-v-3f5e71b8]{color:#ccc;background:none;text-shadow:none;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;hyphens:none}.theme-mode-read pre[class*=language-][data-v-3f5e71b8]{padding:1em;margin:.5em 0;overflow:auto}.theme-mode-read :not(pre)>code[class*=language-][data-v-3f5e71b8],.theme-mode-read pre[class*=language-][data-v-3f5e71b8]{background:#2d2d2d}.theme-mode-read :not(pre)>code[class*=language-][data-v-3f5e71b8]{padding:.1em;border-radius:.3em;white-space:normal}.theme-mode-read .token.block-comment[data-v-3f5e71b8],.theme-mode-read .token.cdata[data-v-3f5e71b8],.theme-mode-read .token.comment[data-v-3f5e71b8],.theme-mode-read .token.doctype[data-v-3f5e71b8],.theme-mode-read .token.prolog[data-v-3f5e71b8]{color:#999}.theme-mode-read .token.punctuation[data-v-3f5e71b8]{color:#ccc}.theme-mode-read .token.attr-name[data-v-3f5e71b8],.theme-mode-read .token.deleted[data-v-3f5e71b8],.theme-mode-read .token.namespace[data-v-3f5e71b8],.theme-mode-read .token.tag[data-v-3f5e71b8]{color:#e2777a}.theme-mode-read .token.function-name[data-v-3f5e71b8]{color:#6196cc}.theme-mode-read .token.boolean[data-v-3f5e71b8],.theme-mode-read .token.function[data-v-3f5e71b8],.theme-mode-read .token.number[data-v-3f5e71b8]{color:#f08d49}.theme-mode-read .token.class-name[data-v-3f5e71b8],.theme-mode-read .token.constant[data-v-3f5e71b8],.theme-mode-read .token.property[data-v-3f5e71b8],.theme-mode-read .token.symbol[data-v-3f5e71b8]{color:#f8c555}.theme-mode-read .token.atrule[data-v-3f5e71b8],.theme-mode-read .token.builtin[data-v-3f5e71b8],.theme-mode-read .token.important[data-v-3f5e71b8],.theme-mode-read .token.keyword[data-v-3f5e71b8],.theme-mode-read .token.selector[data-v-3f5e71b8]{color:#cc99cd}.theme-mode-read .token.attr-value[data-v-3f5e71b8],.theme-mode-read .token.char[data-v-3f5e71b8],.theme-mode-read .token.regex[data-v-3f5e71b8],.theme-mode-read .token.string[data-v-3f5e71b8],.theme-mode-read .token.variable[data-v-3f5e71b8]{color:#7ec699}.theme-mode-read .token.entity[data-v-3f5e71b8],.theme-mode-read .token.operator[data-v-3f5e71b8],.theme-mode-read .token.url[data-v-3f5e71b8]{color:#67cdcc}.theme-mode-read .language-css .token.string[data-v-3f5e71b8],.theme-mode-read .style .token.string[data-v-3f5e71b8],.theme-mode-read .token.entity[data-v-3f5e71b8],.theme-mode-read .token.operator[data-v-3f5e71b8],.theme-mode-read .token.url[data-v-3f5e71b8]{background:none}.theme-mode-read .token.bold[data-v-3f5e71b8],.theme-mode-read .token.important[data-v-3f5e71b8]{font-weight:700}.theme-mode-read .token.italic[data-v-3f5e71b8]{font-style:italic}.theme-mode-read .token.entity[data-v-3f5e71b8]{cursor:help}.theme-mode-read .token.inserted[data-v-3f5e71b8]{color:green}.theme-style-line.theme-mode-light[data-v-3f5e71b8]{--bodyBg:#fff}.theme-style-line.theme-mode-dark[data-v-3f5e71b8]{--bodyBg:#1e1e22}.theme-style-line.theme-mode-read[data-v-3f5e71b8]{--bodyBg:#f5f5d5}.badge[data-v-3f5e71b8]{display:inline-block;font-size:14px;height:18px;line-height:18px;border-radius:3px;padding:0 6px;color:#fff}.badge.green[data-v-3f5e71b8],.badge.tip[data-v-3f5e71b8],.badge[data-v-3f5e71b8]{background-color:#42b983}.badge.error[data-v-3f5e71b8]{background-color:#da5961}.badge.warn[data-v-3f5e71b8],.badge.warning[data-v-3f5e71b8],.badge.yellow[data-v-3f5e71b8]{background-color:#e7c000}.badge+.badge[data-v-3f5e71b8]{margin-left:5px} \ No newline at end of file diff --git a/assets/img/_com1.d83f6b8c.png b/assets/img/_com1.d83f6b8c.png new file mode 100644 index 0000000..045f66f Binary files /dev/null and b/assets/img/_com1.d83f6b8c.png differ diff --git a/assets/img/_com2.b4ed4f99.png b/assets/img/_com2.b4ed4f99.png new file mode 100644 index 0000000..94a9300 Binary files /dev/null and b/assets/img/_com2.b4ed4f99.png differ diff --git a/assets/img/after-gzip.5db603db.jpg b/assets/img/after-gzip.5db603db.jpg new file mode 100644 index 0000000..9782977 Binary files /dev/null and b/assets/img/after-gzip.5db603db.jpg differ diff --git a/assets/img/after.4a71f4e3.jpg b/assets/img/after.4a71f4e3.jpg new file mode 100644 index 0000000..332bf19 Binary files /dev/null and b/assets/img/after.4a71f4e3.jpg differ diff --git a/assets/img/ant-icon.16b70c25.png b/assets/img/ant-icon.16b70c25.png new file mode 100644 index 0000000..fe2ff71 Binary files /dev/null and b/assets/img/ant-icon.16b70c25.png differ diff --git a/assets/img/ant-install.29360849.png b/assets/img/ant-install.29360849.png new file mode 100644 index 0000000..2eae4dd Binary files /dev/null and b/assets/img/ant-install.29360849.png differ diff --git a/assets/img/ant-install2.850df243.png b/assets/img/ant-install2.850df243.png new file mode 100644 index 0000000..4e53ba9 Binary files /dev/null and b/assets/img/ant-install2.850df243.png differ diff --git a/assets/img/async10.6d6b3ca4.jpg b/assets/img/async10.6d6b3ca4.jpg new file mode 100644 index 0000000..19639c1 Binary files /dev/null and b/assets/img/async10.6d6b3ca4.jpg differ diff --git a/assets/img/auths.6821040b.png b/assets/img/auths.6821040b.png new file mode 100644 index 0000000..405b407 Binary files /dev/null and b/assets/img/auths.6821040b.png differ diff --git a/assets/img/before-gzip.98470d85.jpg b/assets/img/before-gzip.98470d85.jpg new file mode 100644 index 0000000..69071e9 Binary files /dev/null and b/assets/img/before-gzip.98470d85.jpg differ diff --git a/assets/img/before.3b6d79a3.jpg b/assets/img/before.3b6d79a3.jpg new file mode 100644 index 0000000..bfbc55c Binary files /dev/null and b/assets/img/before.3b6d79a3.jpg differ diff --git a/assets/img/buildgood.a05286f4.jpg b/assets/img/buildgood.a05286f4.jpg new file mode 100644 index 0000000..e7ddc38 Binary files /dev/null and b/assets/img/buildgood.a05286f4.jpg differ diff --git a/assets/img/check-nginx-config.10ef0bbd.jpg b/assets/img/check-nginx-config.10ef0bbd.jpg new file mode 100644 index 0000000..d533db7 Binary files /dev/null and b/assets/img/check-nginx-config.10ef0bbd.jpg differ diff --git a/assets/img/cloc.1e69fa2f.jpg b/assets/img/cloc.1e69fa2f.jpg new file mode 100644 index 0000000..0e70213 Binary files /dev/null and b/assets/img/cloc.1e69fa2f.jpg differ diff --git a/assets/img/config-logo.3e10c5ac.jpg b/assets/img/config-logo.3e10c5ac.jpg new file mode 100644 index 0000000..1e45b2e Binary files /dev/null and b/assets/img/config-logo.3e10c5ac.jpg differ diff --git a/assets/img/dialog-dark.7fad47e0.jpg b/assets/img/dialog-dark.7fad47e0.jpg new file mode 100644 index 0000000..11fdb04 Binary files /dev/null and b/assets/img/dialog-dark.7fad47e0.jpg differ diff --git a/assets/img/dialog.9144179f.jpg b/assets/img/dialog.9144179f.jpg new file mode 100644 index 0000000..3af7b56 Binary files /dev/null and b/assets/img/dialog.9144179f.jpg differ diff --git a/assets/img/dist-small.7326ecf3.jpg b/assets/img/dist-small.7326ecf3.jpg new file mode 100644 index 0000000..73b79b8 Binary files /dev/null and b/assets/img/dist-small.7326ecf3.jpg differ diff --git a/assets/img/dist.193bee67.jpg b/assets/img/dist.193bee67.jpg new file mode 100644 index 0000000..3df7908 Binary files /dev/null and b/assets/img/dist.193bee67.jpg differ diff --git a/assets/img/drawer-dark.d3239406.jpg b/assets/img/drawer-dark.d3239406.jpg new file mode 100644 index 0000000..ba7f3c6 Binary files /dev/null and b/assets/img/drawer-dark.d3239406.jpg differ diff --git a/assets/img/drawer.8612c11d.jpg b/assets/img/drawer.8612c11d.jpg new file mode 100644 index 0000000..0aae517 Binary files /dev/null and b/assets/img/drawer.8612c11d.jpg differ diff --git a/assets/img/ep-icon.3b647555.png b/assets/img/ep-icon.3b647555.png new file mode 100644 index 0000000..e49a561 Binary files /dev/null and b/assets/img/ep-icon.3b647555.png differ diff --git a/assets/img/ep1.53bf38e0.png b/assets/img/ep1.53bf38e0.png new file mode 100644 index 0000000..30fb50c Binary files /dev/null and b/assets/img/ep1.53bf38e0.png differ diff --git a/assets/img/ep2.bf9bf490.png b/assets/img/ep2.bf9bf490.png new file mode 100644 index 0000000..04ad122 Binary files /dev/null and b/assets/img/ep2.bf9bf490.png differ diff --git a/assets/img/ep3.40f769cf.png b/assets/img/ep3.40f769cf.png new file mode 100644 index 0000000..a88fd95 Binary files /dev/null and b/assets/img/ep3.40f769cf.png differ diff --git a/assets/img/error1.15f745e0.png b/assets/img/error1.15f745e0.png new file mode 100644 index 0000000..24836d6 Binary files /dev/null and b/assets/img/error1.15f745e0.png differ diff --git a/assets/img/eslint.237cc470.jpg b/assets/img/eslint.237cc470.jpg new file mode 100644 index 0000000..6964caa Binary files /dev/null and b/assets/img/eslint.237cc470.jpg differ diff --git a/assets/img/eslint1.1a4b1d65.jpg b/assets/img/eslint1.1a4b1d65.jpg new file mode 100644 index 0000000..f5b09f5 Binary files /dev/null and b/assets/img/eslint1.1a4b1d65.jpg differ diff --git a/assets/img/grey.4fab236e.jpg b/assets/img/grey.4fab236e.jpg new file mode 100644 index 0000000..b7f7e51 Binary files /dev/null and b/assets/img/grey.4fab236e.jpg differ diff --git a/assets/img/horizontal-detail.5953eb90.jpg b/assets/img/horizontal-detail.5953eb90.jpg new file mode 100644 index 0000000..10bc318 Binary files /dev/null and b/assets/img/horizontal-detail.5953eb90.jpg differ diff --git a/assets/img/horizontal.b42a1783.jpg b/assets/img/horizontal.b42a1783.jpg new file mode 100644 index 0000000..5f50f49 Binary files /dev/null and b/assets/img/horizontal.b42a1783.jpg differ diff --git a/assets/img/hotlog.d61a5738.png b/assets/img/hotlog.d61a5738.png new file mode 100644 index 0000000..62ddace Binary files /dev/null and b/assets/img/hotlog.d61a5738.png differ diff --git a/assets/img/i18n.c4b58e17.png b/assets/img/i18n.c4b58e17.png new file mode 100644 index 0000000..2e2a48a Binary files /dev/null and b/assets/img/i18n.c4b58e17.png differ diff --git a/assets/img/i18nAlly.62395d00.jpg b/assets/img/i18nAlly.62395d00.jpg new file mode 100644 index 0000000..c038225 Binary files /dev/null and b/assets/img/i18nAlly.62395d00.jpg differ diff --git a/assets/img/i18nRouter.d53a62e8.png b/assets/img/i18nRouter.d53a62e8.png new file mode 100644 index 0000000..118e3df Binary files /dev/null and b/assets/img/i18nRouter.d53a62e8.png differ diff --git a/assets/img/i18nVue.648163b2.png b/assets/img/i18nVue.648163b2.png new file mode 100644 index 0000000..2c0d82d Binary files /dev/null and b/assets/img/i18nVue.648163b2.png differ diff --git a/assets/img/icon-online.139d08c0.png b/assets/img/icon-online.139d08c0.png new file mode 100644 index 0000000..9cad7e7 Binary files /dev/null and b/assets/img/icon-online.139d08c0.png differ diff --git a/assets/img/log.06f8014f.png b/assets/img/log.06f8014f.png new file mode 100644 index 0000000..6ec509e Binary files /dev/null and b/assets/img/log.06f8014f.png differ diff --git a/assets/img/logo.ed0fcf84.png b/assets/img/logo.ed0fcf84.png new file mode 100644 index 0000000..dbaa5ce Binary files /dev/null and b/assets/img/logo.ed0fcf84.png differ diff --git a/assets/img/mac.16fff2c5.png b/assets/img/mac.16fff2c5.png new file mode 100644 index 0000000..fe65101 Binary files /dev/null and b/assets/img/mac.16fff2c5.png differ diff --git a/assets/img/menu-if.3feef028.png b/assets/img/menu-if.3feef028.png new file mode 100644 index 0000000..7016645 Binary files /dev/null and b/assets/img/menu-if.3feef028.png differ diff --git a/assets/img/menu-local.a118bb2d.jpg b/assets/img/menu-local.a118bb2d.jpg new file mode 100644 index 0000000..5e9ccf0 Binary files /dev/null and b/assets/img/menu-local.a118bb2d.jpg differ diff --git a/assets/img/menu-svg.50f76bea.png b/assets/img/menu-svg.50f76bea.png new file mode 100644 index 0000000..9af2ca7 Binary files /dev/null and b/assets/img/menu-svg.50f76bea.png differ diff --git a/assets/img/messagebox-dark.578f2984.jpg b/assets/img/messagebox-dark.578f2984.jpg new file mode 100644 index 0000000..ef67b98 Binary files /dev/null and b/assets/img/messagebox-dark.578f2984.jpg differ diff --git a/assets/img/messagebox.18d0847d.jpg b/assets/img/messagebox.18d0847d.jpg new file mode 100644 index 0000000..2ac5ad8 Binary files /dev/null and b/assets/img/messagebox.18d0847d.jpg differ diff --git a/assets/img/mixNav-detail.b7d39aef.jpg b/assets/img/mixNav-detail.b7d39aef.jpg new file mode 100644 index 0000000..b1eb2d4 Binary files /dev/null and b/assets/img/mixNav-detail.b7d39aef.jpg differ diff --git a/assets/img/mixNav.295259bf.jpg b/assets/img/mixNav.295259bf.jpg new file mode 100644 index 0000000..b2e9f5b Binary files /dev/null and b/assets/img/mixNav.295259bf.jpg differ diff --git a/assets/img/more.cbf06c6b.jpg b/assets/img/more.cbf06c6b.jpg new file mode 100644 index 0000000..8352a6f Binary files /dev/null and b/assets/img/more.cbf06c6b.jpg differ diff --git a/assets/img/namespace.19870394.jpg b/assets/img/namespace.19870394.jpg new file mode 100644 index 0000000..4db975e Binary files /dev/null and b/assets/img/namespace.19870394.jpg differ diff --git a/assets/img/nginx-config.5d0e66d7.jpg b/assets/img/nginx-config.5d0e66d7.jpg new file mode 100644 index 0000000..a5d6554 Binary files /dev/null and b/assets/img/nginx-config.5d0e66d7.jpg differ diff --git a/assets/img/no-output.48778faf.jpg b/assets/img/no-output.48778faf.jpg new file mode 100644 index 0000000..75c92f2 Binary files /dev/null and b/assets/img/no-output.48778faf.jpg differ diff --git a/assets/img/no1.e0910719.png b/assets/img/no1.e0910719.png new file mode 100644 index 0000000..3dc04ec Binary files /dev/null and b/assets/img/no1.e0910719.png differ diff --git a/assets/img/nodejs.618d72d2.jpg b/assets/img/nodejs.618d72d2.jpg new file mode 100644 index 0000000..4e2c9b5 Binary files /dev/null and b/assets/img/nodejs.618d72d2.jpg differ diff --git a/assets/img/notification-dark.1dafa902.jpg b/assets/img/notification-dark.1dafa902.jpg new file mode 100644 index 0000000..7723ab8 Binary files /dev/null and b/assets/img/notification-dark.1dafa902.jpg differ diff --git a/assets/img/notification.1a368e15.jpg b/assets/img/notification.1a368e15.jpg new file mode 100644 index 0000000..1b46b5e Binary files /dev/null and b/assets/img/notification.1a368e15.jpg differ diff --git a/assets/img/npm1.1ecb4afe.jpg b/assets/img/npm1.1ecb4afe.jpg new file mode 100644 index 0000000..79eab51 Binary files /dev/null and b/assets/img/npm1.1ecb4afe.jpg differ diff --git a/assets/img/npm2.40452cbe.jpg b/assets/img/npm2.40452cbe.jpg new file mode 100644 index 0000000..eac8ddb Binary files /dev/null and b/assets/img/npm2.40452cbe.jpg differ diff --git a/assets/img/npm3.b590833f.jpg b/assets/img/npm3.b590833f.jpg new file mode 100644 index 0000000..62979e6 Binary files /dev/null and b/assets/img/npm3.b590833f.jpg differ diff --git a/assets/img/online-click.3284c99a.png b/assets/img/online-click.3284c99a.png new file mode 100644 index 0000000..754246c Binary files /dev/null and b/assets/img/online-click.3284c99a.png differ diff --git a/assets/img/optimized.470a939d.png b/assets/img/optimized.470a939d.png new file mode 100644 index 0000000..44ecf3b Binary files /dev/null and b/assets/img/optimized.470a939d.png differ diff --git a/assets/img/output.e13d001d.jpg b/assets/img/output.e13d001d.jpg new file mode 100644 index 0000000..cb7a2e4 Binary files /dev/null and b/assets/img/output.e13d001d.jpg differ diff --git a/assets/img/rank.415eac7f.png b/assets/img/rank.415eac7f.png new file mode 100644 index 0000000..f97b49c Binary files /dev/null and b/assets/img/rank.415eac7f.png differ diff --git a/assets/img/rbac.8088af0f.jpg b/assets/img/rbac.8088af0f.jpg new file mode 100644 index 0000000..11740c4 Binary files /dev/null and b/assets/img/rbac.8088af0f.jpg differ diff --git a/assets/img/recommended1.5c31bd3b.jpg b/assets/img/recommended1.5c31bd3b.jpg new file mode 100644 index 0000000..19a9a91 Binary files /dev/null and b/assets/img/recommended1.5c31bd3b.jpg differ diff --git a/assets/img/recommended2.6117add9.jpg b/assets/img/recommended2.6117add9.jpg new file mode 100644 index 0000000..5105f55 Binary files /dev/null and b/assets/img/recommended2.6117add9.jpg differ diff --git a/assets/img/report.74fa047f.jpg b/assets/img/report.74fa047f.jpg new file mode 100644 index 0000000..56811f8 Binary files /dev/null and b/assets/img/report.74fa047f.jpg differ diff --git a/assets/img/roles.e4c75c93.png b/assets/img/roles.e4c75c93.png new file mode 100644 index 0000000..de0ec12 Binary files /dev/null and b/assets/img/roles.e4c75c93.png differ diff --git a/assets/img/same1.ba15508a.jpg b/assets/img/same1.ba15508a.jpg new file mode 100644 index 0000000..08d7f4c Binary files /dev/null and b/assets/img/same1.ba15508a.jpg differ diff --git a/assets/img/same4.b3359637.jpg b/assets/img/same4.b3359637.jpg new file mode 100644 index 0000000..c53212a Binary files /dev/null and b/assets/img/same4.b3359637.jpg differ diff --git a/assets/img/search.237d6f6a.svg b/assets/img/search.237d6f6a.svg new file mode 100644 index 0000000..18ed22a --- /dev/null +++ b/assets/img/search.237d6f6a.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/assets/img/shims-vue1.921d5914.png b/assets/img/shims-vue1.921d5914.png new file mode 100644 index 0000000..3eaa0ff Binary files /dev/null and b/assets/img/shims-vue1.921d5914.png differ diff --git a/assets/img/shims-vue2.c6c1e65f.jpg b/assets/img/shims-vue2.c6c1e65f.jpg new file mode 100644 index 0000000..4891221 Binary files /dev/null and b/assets/img/shims-vue2.c6c1e65f.jpg differ diff --git a/assets/img/shims-vue3.1cafc0ba.jpg b/assets/img/shims-vue3.1cafc0ba.jpg new file mode 100644 index 0000000..6a7feb7 Binary files /dev/null and b/assets/img/shims-vue3.1cafc0ba.jpg differ diff --git a/assets/img/snip30.84c7390f.jpg b/assets/img/snip30.84c7390f.jpg new file mode 100644 index 0000000..b60b1ec Binary files /dev/null and b/assets/img/snip30.84c7390f.jpg differ diff --git a/assets/img/snip32.ba4d62f9.jpg b/assets/img/snip32.ba4d62f9.jpg new file mode 100644 index 0000000..5d9efe4 Binary files /dev/null and b/assets/img/snip32.ba4d62f9.jpg differ diff --git a/assets/img/snip33.c67c4163.jpg b/assets/img/snip33.c67c4163.jpg new file mode 100644 index 0000000..5f35e8e Binary files /dev/null and b/assets/img/snip33.c67c4163.jpg differ diff --git a/assets/img/static1.96239ed7.jpg b/assets/img/static1.96239ed7.jpg new file mode 100644 index 0000000..3c0eb14 Binary files /dev/null and b/assets/img/static1.96239ed7.jpg differ diff --git a/assets/img/static10.20b16533.jpg b/assets/img/static10.20b16533.jpg new file mode 100644 index 0000000..bb5ad53 Binary files /dev/null and b/assets/img/static10.20b16533.jpg differ diff --git a/assets/img/static11.dd0e8564.jpg b/assets/img/static11.dd0e8564.jpg new file mode 100644 index 0000000..3b09583 Binary files /dev/null and b/assets/img/static11.dd0e8564.jpg differ diff --git a/assets/img/static12.4a42038f.jpg b/assets/img/static12.4a42038f.jpg new file mode 100644 index 0000000..797c72f Binary files /dev/null and b/assets/img/static12.4a42038f.jpg differ diff --git a/assets/img/static13.6f21cffb.jpg b/assets/img/static13.6f21cffb.jpg new file mode 100644 index 0000000..370d360 Binary files /dev/null and b/assets/img/static13.6f21cffb.jpg differ diff --git a/assets/img/static15.19eae526.jpg b/assets/img/static15.19eae526.jpg new file mode 100644 index 0000000..3e00ad3 Binary files /dev/null and b/assets/img/static15.19eae526.jpg differ diff --git a/assets/img/static16.3f6d1472.jpg b/assets/img/static16.3f6d1472.jpg new file mode 100644 index 0000000..e1b4102 Binary files /dev/null and b/assets/img/static16.3f6d1472.jpg differ diff --git a/assets/img/static2.18366613.jpg b/assets/img/static2.18366613.jpg new file mode 100644 index 0000000..e7e39ba Binary files /dev/null and b/assets/img/static2.18366613.jpg differ diff --git a/assets/img/static3.51f39fcd.jpg b/assets/img/static3.51f39fcd.jpg new file mode 100644 index 0000000..d21e112 Binary files /dev/null and b/assets/img/static3.51f39fcd.jpg differ diff --git a/assets/img/static7.bc86b8ef.jpg b/assets/img/static7.bc86b8ef.jpg new file mode 100644 index 0000000..7565adc Binary files /dev/null and b/assets/img/static7.bc86b8ef.jpg differ diff --git a/assets/img/static8.6aa2a39c.jpg b/assets/img/static8.6aa2a39c.jpg new file mode 100644 index 0000000..81bd902 Binary files /dev/null and b/assets/img/static8.6aa2a39c.jpg differ diff --git a/assets/img/static9.2f15325a.jpg b/assets/img/static9.2f15325a.jpg new file mode 100644 index 0000000..7db2688 Binary files /dev/null and b/assets/img/static9.2f15325a.jpg differ diff --git a/assets/img/type.bd4e388d.jpg b/assets/img/type.bd4e388d.jpg new file mode 100644 index 0000000..96711fb Binary files /dev/null and b/assets/img/type.bd4e388d.jpg differ diff --git a/assets/img/unexpected.9b72d40f.jpg b/assets/img/unexpected.9b72d40f.jpg new file mode 100644 index 0000000..a9aa3b2 Binary files /dev/null and b/assets/img/unexpected.9b72d40f.jpg differ diff --git a/assets/img/useRenderIcon.afa0232e.png b/assets/img/useRenderIcon.afa0232e.png new file mode 100644 index 0000000..d617bce Binary files /dev/null and b/assets/img/useRenderIcon.afa0232e.png differ diff --git a/assets/img/vertical-detail.f5a5fe13.jpg b/assets/img/vertical-detail.f5a5fe13.jpg new file mode 100644 index 0000000..6548c30 Binary files /dev/null and b/assets/img/vertical-detail.f5a5fe13.jpg differ diff --git a/assets/img/vertical.f0e7280b.jpg b/assets/img/vertical.f0e7280b.jpg new file mode 100644 index 0000000..b5a0a3f Binary files /dev/null and b/assets/img/vertical.f0e7280b.jpg differ diff --git a/assets/img/vite.4e708700.png b/assets/img/vite.4e708700.png new file mode 100644 index 0000000..a9eb9cb Binary files /dev/null and b/assets/img/vite.4e708700.png differ diff --git a/assets/img/vscode-iconify.e92010ca.png b/assets/img/vscode-iconify.e92010ca.png new file mode 100644 index 0000000..d9bc15d Binary files /dev/null and b/assets/img/vscode-iconify.e92010ca.png differ diff --git a/assets/img/vscode-iconify2.a023cc92.png b/assets/img/vscode-iconify2.a023cc92.png new file mode 100644 index 0000000..04825b4 Binary files /dev/null and b/assets/img/vscode-iconify2.a023cc92.png differ diff --git a/assets/img/whole.085428da.jpg b/assets/img/whole.085428da.jpg new file mode 100644 index 0000000..f7c56cc Binary files /dev/null and b/assets/img/whole.085428da.jpg differ diff --git a/assets/img/xrk1.64774ed4.jpg b/assets/img/xrk1.64774ed4.jpg new file mode 100644 index 0000000..349ca3e Binary files /dev/null and b/assets/img/xrk1.64774ed4.jpg differ diff --git a/assets/img/xrk2.c290764b.jpg b/assets/img/xrk2.c290764b.jpg new file mode 100644 index 0000000..2769aee Binary files /dev/null and b/assets/img/xrk2.c290764b.jpg differ diff --git a/assets/js/10.cfa3733d.js b/assets/js/10.cfa3733d.js new file mode 100644 index 0000000..406c24b --- /dev/null +++ b/assets/js/10.cfa3733d.js @@ -0,0 +1 @@ +(window.webpackJsonp=window.webpackJsonp||[]).push([[10],{387:function(t,s,a){t.exports=a.p+"assets/img/i18nAlly.62395d00.jpg"},388:function(t,s,a){t.exports=a.p+"assets/img/i18n.c4b58e17.png"},389:function(t,s,a){t.exports=a.p+"assets/img/i18nVue.648163b2.png"},390:function(t,s,a){t.exports=a.p+"assets/img/i18nRouter.d53a62e8.png"},450:function(t,s,a){"use strict";a.r(s);var n=a(8),e=Object(n.a)({},(function(){var t=this,s=t.$createElement,n=t._self._c||s;return n("ContentSlotsDistributor",{attrs:{"slot-key":t.$parent.slotKey}},[n("p",[t._v("平台内置了国际化，支持自定义国际化、"),n("code",[t._v("element-plus")]),t._v(" 国际化")]),t._v(" "),n("p",[n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin",target:"_blank",rel:"noopener noreferrer"}},[t._v("pure-admin 完整版"),n("OutboundLink")],1),t._v(" 只有国际化版本")]),t._v(" "),n("h2",{attrs:{id:"vscode-插件"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#vscode-插件"}},[t._v("#")]),t._v(" "),n("code",[t._v("vscode")]),t._v(" 插件")]),t._v(" "),n("p",[t._v("在 "),n("code",[t._v("vscode")]),t._v(" 插件商店搜 "),n("code",[t._v("lokalise.i18n-ally")]),t._v(" 进行安装，可以带来更友好的国际化提示")]),t._v(" "),n("p",[n("img",{attrs:{src:a(387),alt:"i18nAlly"}})]),t._v(" "),n("p",[t._v("当然不要忘记把下面的 "),n("code",[t._v("json")]),t._v(" 代码添加到您 "),n("code",[t._v("vscode")]),t._v(" 的 "),n("code",[t._v("settings.json")]),t._v(" 中")]),t._v(" "),n("div",{staticClass:"language-json extra-class"},[n("pre",{pre:!0,attrs:{class:"language-json"}},[n("code",[n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"i18n-ally.localesPaths"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"locales"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"i18n-ally.keystyle"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"nested"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"i18n-ally.sortKeys"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token boolean"}},[t._v("true")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"i18n-ally.namespace"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token boolean"}},[t._v("true")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"i18n-ally.enabledParsers"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("[")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"yaml"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"js"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("]")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"i18n-ally.sourceLanguage"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"en"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"i18n-ally.displayLanguage"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"zh-CN"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"i18n-ally.enabledFrameworks"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("[")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"vue"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("]")]),t._v("\n")])])]),n("h2",{attrs:{id:"注入国际化"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#注入国际化"}},[t._v("#")]),t._v(" 注入国际化")]),t._v(" "),n("p",[t._v("平台使用 "),n("a",{attrs:{href:"https://www.npmjs.com/package/@intlify/unplugin-vue-i18n",target:"_blank",rel:"noopener noreferrer"}},[t._v("@intlify/unplugin-vue-i18n"),n("OutboundLink")],1),t._v(" 这款国际化 "),n("code",[t._v("vite")]),t._v(" 插件配合 "),n("a",{attrs:{href:"https://www.npmjs.com/package/vue-i18n",target:"_blank",rel:"noopener noreferrer"}},[t._v("vue-i18n"),n("OutboundLink")],1),t._v("来实现国际化，国际化文件采用了 "),n("code",[t._v("yaml")]),t._v(" 格式 "),n("a",{attrs:{href:"https://github.com/intlify/bundle-tools/blob/main/packages/vite-plugin-vue-i18n/README.md#include",target:"_blank",rel:"noopener noreferrer"}},[t._v("点击查看更多格式"),n("OutboundLink")],1)]),t._v(" "),n("p",[t._v("中文添加到 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/locales/zh-CN.yaml",target:"_blank",rel:"noopener noreferrer"}},[t._v("zh-CN.yaml"),n("OutboundLink")],1),t._v(" 文件里，英文添加到 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/locales/en.yaml",target:"_blank",rel:"noopener noreferrer"}},[t._v("en.yaml"),n("OutboundLink")],1),t._v(" 文件里，支持嵌套结构，嵌套层级越深性能越低，如下图")]),t._v(" "),n("p",[n("img",{attrs:{src:a(388),alt:"i18n"}})]),t._v(" "),n("h2",{attrs:{id:"基础用法"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#基础用法"}},[t._v("#")]),t._v(" 基础用法")]),t._v(" "),n("h3",{attrs:{id:"vue-文件中使用"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#vue-文件中使用"}},[t._v("#")]),t._v(" "),n("code",[t._v(".vue")]),t._v(" 文件中使用")]),t._v(" "),n("p",[t._v("① 使用 "),n("code",[t._v("vue-i18n")]),t._v(" 中 "),n("code",[t._v("useI18n")]),t._v(" 函数")]),t._v(" "),n("div",{staticClass:"language-Vue extra-class"},[n("pre",{pre:!0,attrs:{class:"language-vue"}},[n("code",[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("<")]),t._v("script")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token attr-name"}},[t._v("setup")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token attr-name"}},[t._v("lang")]),n("span",{pre:!0,attrs:{class:"token attr-value"}},[n("span",{pre:!0,attrs:{class:"token punctuation attr-equals"}},[t._v("=")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')]),t._v("ts"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')])]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(">")])]),n("span",{pre:!0,attrs:{class:"token script"}},[n("span",{pre:!0,attrs:{class:"token language-javascript"}},[t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" useI18n "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"vue-i18n"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" t "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("useI18n")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])]),n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("")])]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("<")]),t._v("template")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(">")])]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("<")]),t._v("p")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(">")])]),t._v('{{ t("buttons.hsLoginOut") }}'),n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("")])]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("")])]),t._v("\n")])])]),n("p",[t._v("② 使用平台提供的 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/plugins/i18n.ts#L37",target:"_blank",rel:"noopener noreferrer"}},[t._v("transformI18n"),n("OutboundLink")],1),t._v(" 函数")]),t._v(" "),n("div",{staticClass:"language-Vue extra-class"},[n("pre",{pre:!0,attrs:{class:"language-vue"}},[n("code",[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("<")]),t._v("script")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token attr-name"}},[t._v("setup")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token attr-name"}},[t._v("lang")]),n("span",{pre:!0,attrs:{class:"token attr-value"}},[n("span",{pre:!0,attrs:{class:"token punctuation attr-equals"}},[t._v("=")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')]),t._v("ts"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')])]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(">")])]),n("span",{pre:!0,attrs:{class:"token script"}},[n("span",{pre:!0,attrs:{class:"token language-javascript"}},[t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" transformI18n "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"@/plugins/i18n"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])]),n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("")])]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("<")]),t._v("template")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(">")])]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("<")]),t._v("p")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(">")])]),t._v('{{ transformI18n("buttons.hsLoginOut") }}'),n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("")])]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("")])]),t._v("\n")])])]),n("h3",{attrs:{id:"ts-文件中使用"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#ts-文件中使用"}},[t._v("#")]),t._v(" "),n("code",[t._v(".ts")]),t._v(" 文件中使用")]),t._v(" "),n("p",[t._v("在 "),n("code",[t._v(".ts")]),t._v(" 文件中推荐使用平台提供的 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/plugins/i18n.ts#L37",target:"_blank",rel:"noopener noreferrer"}},[t._v("transformI18n"),n("OutboundLink")],1),t._v(" 函数，因为 "),n("code",[t._v("useI18n")]),t._v(" 必须在 "),n("code",[t._v("setup")]),t._v(" 中使用，具体原因请看 "),n("a",{attrs:{href:"https://vue-i18n.intlify.dev/guide/advanced/composition.html#basic-usage",target:"_blank",rel:"noopener noreferrer"}},[t._v("vue-i18n 文档"),n("OutboundLink")],1)]),t._v(" "),n("div",{staticClass:"language-ts extra-class"},[n("pre",{pre:!0,attrs:{class:"language-ts"}},[n("code",[n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" transformI18n "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(' "@'),n("span",{pre:!0,attrs:{class:"token regex"}},[n("span",{pre:!0,attrs:{class:"token regex-delimiter"}},[t._v("/")]),n("span",{pre:!0,attrs:{class:"token regex-source language-regex"}},[t._v("plugins")]),n("span",{pre:!0,attrs:{class:"token regex-delimiter"}},[t._v("/")]),n("span",{pre:!0,attrs:{class:"token regex-flags"}},[t._v("i")])]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("transformI18n")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"buttons.hsLoginOut"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])]),n("div",{staticClass:"custom-block tip"},[n("p",{staticClass:"custom-block-title"},[t._v("提示")]),t._v(" "),n("p",[n("code",[t._v("transformI18n")]),t._v(" 会自动读取 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/tree/main/locales",target:"_blank",rel:"noopener noreferrer"}},[t._v("locales"),n("OutboundLink")],1),t._v(" 下的国际化语言，如果匹配到则返回，匹配不到的话就是您传什么就返回什么，这样避免报错。这也是为什么平台路由的 "),n("code",[t._v("title")]),t._v(" 字段支持传 "),n("code",[t._v("国际化")]),t._v(" 和 "),n("code",[t._v("非国际化")]),t._v(" 两种写法的原因")])]),t._v(" "),n("h2",{attrs:{id:"平台提供的-t"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#平台提供的-t"}},[t._v("#")]),t._v(" 平台提供的 "),n("code",[t._v("$t")])]),t._v(" "),n("p",[t._v("这里的 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/plugins/i18n.ts#L61",target:"_blank",rel:"noopener noreferrer"}},[t._v("$t"),n("OutboundLink")],1),t._v(" 是指平台提供的函数，是配合 "),n("code",[t._v("i18n Ally")]),t._v(" 插件在 "),n("code",[t._v("vscode")]),t._v(" 里带来智能提示，无实际意义，只对提示起作用，而非 "),n("code",[t._v("vue-i18n")]),t._v(" 里的")]),t._v(" "),n("h3",{attrs:{id:"vue-文件中使用-2"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#vue-文件中使用-2"}},[t._v("#")]),t._v(" "),n("code",[t._v(".vue")]),t._v(" 文件中使用")]),t._v(" "),n("p",[t._v("对于 "),n("code",[t._v("i18n Ally")]),t._v(" 插件来说要想得到智能提示必须使用带有 "),n("code",[t._v("t")]),t._v(" 的别名而且 "),n("code",[t._v("t")]),t._v(" 永远在最后一位，例如 "),n("code",[t._v("$$t")]),t._v(" 、 "),n("code",[t._v("&t")]),t._v(" 类似格式都是生效的，而 "),n("code",[t._v("$t$")]),t._v(" 、 "),n("code",[t._v("t&")]),t._v(" 不生效")]),t._v(" "),n("div",{staticClass:"language-Vue extra-class"},[n("pre",{pre:!0,attrs:{class:"language-vue"}},[n("code",[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("<")]),t._v("script")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token attr-name"}},[t._v("setup")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token attr-name"}},[t._v("lang")]),n("span",{pre:!0,attrs:{class:"token attr-value"}},[n("span",{pre:!0,attrs:{class:"token punctuation attr-equals"}},[t._v("=")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')]),t._v("ts"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')])]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(">")])]),n("span",{pre:!0,attrs:{class:"token script"}},[n("span",{pre:!0,attrs:{class:"token language-javascript"}},[t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" $t "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"@/plugins/i18n"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])]),n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("")])]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("<")]),t._v("template")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(">")])]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("<")]),t._v("p")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(">")])]),t._v('{{ $t("login.usernameReg") }}'),n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("")])]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("")])]),t._v("\n")])])]),n("p",[t._v("效果如下图")]),t._v(" "),n("p",[n("img",{attrs:{src:a(389),alt:"i18n"}})]),t._v(" "),n("h3",{attrs:{id:"ts-文件中使用-2"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#ts-文件中使用-2"}},[t._v("#")]),t._v(" "),n("code",[t._v(".ts")]),t._v(" 文件中使用")]),t._v(" "),n("div",{staticClass:"language-ts extra-class"},[n("pre",{pre:!0,attrs:{class:"language-ts"}},[n("code",[n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" $t "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"/@/plugins/i18n"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("$t")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"menus.hslogin"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])]),n("p",[t._v("效果如下图")]),t._v(" "),n("p",[n("img",{attrs:{src:a(390),alt:"i18n"}})]),t._v(" "),n("h2",{attrs:{id:"当前的国际化环境"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#当前的国际化环境"}},[t._v("#")]),t._v(" 当前的国际化环境")]),t._v(" "),n("p",[t._v("当前的国际化环境是指当前系统正在使用中文还是英文（"),n("code",[t._v("zh")]),t._v("：中文、"),n("code",[t._v("en")]),t._v("：英文）")]),t._v(" "),n("h3",{attrs:{id:"vue-文件中使用-3"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#vue-文件中使用-3"}},[t._v("#")]),t._v(" "),n("code",[t._v(".vue")]),t._v(" 文件中使用")]),t._v(" "),n("div",{staticClass:"language-Vue extra-class"},[n("pre",{pre:!0,attrs:{class:"language-vue"}},[n("code",[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("<")]),t._v("script")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token attr-name"}},[t._v("setup")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token attr-name"}},[t._v("lang")]),n("span",{pre:!0,attrs:{class:"token attr-value"}},[n("span",{pre:!0,attrs:{class:"token punctuation attr-equals"}},[t._v("=")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')]),t._v("ts"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')])]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(">")])]),n("span",{pre:!0,attrs:{class:"token script"}},[n("span",{pre:!0,attrs:{class:"token language-javascript"}},[t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" useI18n "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"vue-i18n"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" locale "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("useI18n")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v("\nconsole"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("log")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token template-string"}},[n("span",{pre:!0,attrs:{class:"token template-punctuation string"}},[t._v("`")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v("当前系统采用的语言是：")]),n("span",{pre:!0,attrs:{class:"token interpolation"}},[n("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[t._v("${")]),t._v("locale"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),t._v("value"),n("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[t._v("}")])]),n("span",{pre:!0,attrs:{class:"token template-punctuation string"}},[t._v("`")])]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v("\n")])]),n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("")])]),t._v("\n")])])]),n("h3",{attrs:{id:"ts-文件中使用-3"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#ts-文件中使用-3"}},[t._v("#")]),t._v(" "),n("code",[t._v(".ts")]),t._v(" 文件中使用")]),t._v(" "),n("p",[t._v("因为 "),n("code",[t._v("useI18n")]),t._v(" 只能在 "),n("code",[t._v("setup")]),t._v(" 中使用，所以平台将当前的国际化环境在 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/utils/responsive.ts#L12",target:"_blank",rel:"noopener noreferrer"}},[t._v("localStorage"),n("OutboundLink")],1),t._v(" 里存了一份")]),t._v(" "),n("div",{staticClass:"language-ts extra-class"},[n("pre",{pre:!0,attrs:{class:"language-ts"}},[n("code",[n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("type")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" StorageConfigs "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"/#/index"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" storageLocal "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"@pureadmin/utils"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" locale "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v("\n storageLocal"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),n("span",{pre:!0,attrs:{class:"token generic-function"}},[n("span",{pre:!0,attrs:{class:"token function"}},[t._v("getItem")]),n("span",{pre:!0,attrs:{class:"token generic class-name"}},[n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("<")]),t._v("StorageConfigs"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(">")])])]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"responsive-locale"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("?.")]),t._v("locale"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token builtin"}},[t._v("console")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("log")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token template-string"}},[n("span",{pre:!0,attrs:{class:"token template-punctuation string"}},[t._v("`")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v("当前系统采用的语言是：")]),n("span",{pre:!0,attrs:{class:"token interpolation"}},[n("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[t._v("${")]),t._v("locale"),n("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[t._v("}")])]),n("span",{pre:!0,attrs:{class:"token template-punctuation string"}},[t._v("`")])]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])])])}),[],!1,null,null,null);s.default=e.exports}}]); \ No newline at end of file diff --git a/assets/js/11.f5a5eeff.js b/assets/js/11.f5a5eeff.js new file mode 100644 index 0000000..1ca91e7 --- /dev/null +++ b/assets/js/11.f5a5eeff.js @@ -0,0 +1 @@ +(window.webpackJsonp=window.webpackJsonp||[]).push([[11],{391:function(t,a,s){t.exports=s.p+"assets/img/rbac.8088af0f.jpg"},392:function(t,a,s){t.exports=s.p+"assets/img/roles.e4c75c93.png"},393:function(t,a,s){t.exports=s.p+"assets/img/auths.6821040b.png"},452:function(t,a,s){"use strict";s.r(a);var r=s(8),n=Object(r.a)({},(function(){var t=this,a=t.$createElement,r=t._self._c||a;return r("ContentSlotsDistributor",{attrs:{"slot-key":t.$parent.slotKey}},[r("p",[t._v("所谓 "),r("code",[t._v("RBAC")]),t._v("（Role Based Access Control）权限指的是基于角色的访问控制")]),t._v(" "),r("p",[r("img",{attrs:{src:s(391),alt:"rbac"}})]),t._v(" "),r("h2",{attrs:{id:"用户"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#用户"}},[t._v("#")]),t._v(" 用户")]),t._v(" "),r("p",[t._v("平台用 "),r("code",[t._v("mock")]),t._v(" 模拟出两个账号，一个是 "),r("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/mock/login.ts#L13",target:"_blank",rel:"noopener noreferrer"}},[t._v("admin"),r("OutboundLink")],1),t._v("，另一个是 "),r("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/mock/login.ts#L25",target:"_blank",rel:"noopener noreferrer"}},[t._v("common"),r("OutboundLink")],1),t._v("，用户名字段为 "),r("code",[t._v("username")]),t._v(" ，为字符串类型，当然平台将用户名在 "),r("code",[t._v("pinia")]),t._v(" 的 "),r("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/store/modules/user.ts#L16",target:"_blank",rel:"noopener noreferrer"}},[t._v("state"),r("OutboundLink")],1),t._v(" 里存了一份")]),t._v(" "),r("h2",{attrs:{id:"角色"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#角色"}},[t._v("#")]),t._v(" 角色")]),t._v(" "),r("p",[t._v("平台用 "),r("code",[t._v("mock")]),t._v(" 模拟出两个角色，一个是 "),r("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/mock/login.ts#L15",target:"_blank",rel:"noopener noreferrer"}},[t._v("admin"),r("OutboundLink")],1),t._v("，另一个是 "),r("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/mock/login.ts#L27",target:"_blank",rel:"noopener noreferrer"}},[t._v("common"),r("OutboundLink")],1),t._v("，角色存放在 "),r("code",[t._v("roles")]),t._v(" 字段中，为数组类型，可支持多个角色，当然平台将 "),r("code",[t._v("当前登录用户的角色")]),t._v(" 在 "),r("code",[t._v("pinia")]),t._v(" 的 "),r("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/store/modules/user.ts#L19",target:"_blank",rel:"noopener noreferrer"}},[t._v("state"),r("OutboundLink")],1),t._v(" 里也存了一份")]),t._v(" "),r("h2",{attrs:{id:"权限"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#权限"}},[t._v("#")]),t._v(" 权限")]),t._v(" "),r("p",[t._v("整体分为 "),r("a",{attrs:{href:"#%E7%B2%97%E7%B2%92%E5%BA%A6%E6%9D%83%E9%99%90"}},[t._v("粗粒度权限")]),t._v(" 和 "),r("a",{attrs:{href:"#%E7%BB%86%E7%B2%92%E5%BA%A6%E6%9D%83%E9%99%90"}},[t._v("细粒度权限")])]),t._v(" "),r("h3",{attrs:{id:"粗粒度权限"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#粗粒度权限"}},[t._v("#")]),t._v(" 粗粒度权限")]),t._v(" "),r("h4",{attrs:{id:"菜单权限"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#菜单权限"}},[t._v("#")]),t._v(" 菜单权限")]),t._v(" "),r("h5",{attrs:{id:"实现原理、代码"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#实现原理、代码"}},[t._v("#")]),t._v(" 实现原理、代码")]),t._v(" "),r("p",[t._v("页面整体的菜单存放在 "),r("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/store/modules/permission.ts#L13",target:"_blank",rel:"noopener noreferrer"}},[t._v("wholeMenus"),r("OutboundLink")],1),t._v("，所以我们只需要控制 "),r("code",[t._v("wholeMenus")]),t._v(" 就能控制菜单的显示、隐藏。通过 "),r("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/router/utils.ts#L85",target:"_blank",rel:"noopener noreferrer"}},[t._v("filterNoPermissionTree"),r("OutboundLink")],1),t._v(" 函数从菜单中过滤无权限的菜单")]),t._v(" "),r("h5",{attrs:{id:"如何配置"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#如何配置"}},[t._v("#")]),t._v(" 如何配置")]),t._v(" "),r("p",[t._v("只需要通过返回路由的 "),r("code",[t._v("roles")]),t._v(" 配置项，赋予该菜单权限即可，如下图")]),t._v(" "),r("p",[r("img",{attrs:{src:s(392),alt:"roles"}})]),t._v(" "),r("div",{staticClass:"custom-block tip"},[r("p",{staticClass:"custom-block-title"},[t._v("实现细节")]),t._v(" "),r("p",[t._v("将菜单与路由解藕，这样可以更灵活的控制二者，不会造成一方改动必会影响另一方")])]),t._v(" "),r("h4",{attrs:{id:"url-链接权限"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#url-链接权限"}},[t._v("#")]),t._v(" "),r("code",[t._v("url")]),t._v(" 链接权限")]),t._v(" "),r("h5",{attrs:{id:"实现原理、代码-2"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#实现原理、代码-2"}},[t._v("#")]),t._v(" 实现原理、代码")]),t._v(" "),r("p",[t._v("平台在路由的 "),r("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/router/index.ts#L98",target:"_blank",rel:"noopener noreferrer"}},[t._v("beforeEach"),r("OutboundLink")],1),t._v(" 钩子函数中，通过对比当前用户的角色和当前路由中 "),r("code",[t._v("roles")]),t._v(" 字段来判断是否有无权限，无权限跳转 "),r("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/views/error/403.vue",target:"_blank",rel:"noopener noreferrer"}},[t._v("403"),r("OutboundLink")],1),t._v(" 页面")]),t._v(" "),r("h5",{attrs:{id:"如何配置-2"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#如何配置-2"}},[t._v("#")]),t._v(" 如何配置")]),t._v(" "),r("p",[t._v("您不需要做任何配置，只需要像上图一样配置好权限就行，平台会根据有无权限自行判断，如下面视频，当有 "),r("code",[t._v("admin")]),t._v(" 权限时可以看到系统管理目录以及里面的菜单页面并且可以通过 "),r("code",[t._v("url")]),t._v(" 跳转，当然也可以在 "),r("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/tree/main/src/layout/components/search",target:"_blank",rel:"noopener noreferrer"}},[t._v("菜单搜索"),r("OutboundLink")],1),t._v(" 中找到，当无 "),r("code",[t._v("admin")]),t._v(" 权限时反之")]),t._v(" "),r("h4",{attrs:{id:"按钮、组件、类方法权限"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#按钮、组件、类方法权限"}},[t._v("#")]),t._v(" 按钮、组件、类方法权限")]),t._v(" "),r("p",[t._v("针对这三类权限判断，平台提供三种方法 "),r("a",{attrs:{href:"#%E7%BB%84%E4%BB%B6%E6%96%B9%E5%BC%8F%E5%88%A4%E6%96%AD%E6%9D%83%E9%99%90"}},[t._v("组件方式判断权限")]),t._v("、"),r("a",{attrs:{href:"#%E5%87%BD%E6%95%B0%E6%96%B9%E5%BC%8F%E5%88%A4%E6%96%AD%E6%9D%83%E9%99%90"}},[t._v("函数方式判断权限")]),t._v("、"),r("a",{attrs:{href:"#%E6%8C%87%E4%BB%A4%E6%96%B9%E5%BC%8F%E5%88%A4%E6%96%AD%E6%9D%83%E9%99%90"}},[t._v("指令方式判断权限")])]),t._v(" "),r("p",[t._v("在使用这三种方法前，需要通过返回路由的 "),r("code",[t._v("auths")]),t._v(" 配置项，赋予该页面按钮级别权限，如下图")]),t._v(" "),r("p",[r("img",{attrs:{src:s(393),alt:"auths"}})]),t._v(" "),r("h5",{attrs:{id:"组件方式判断权限"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#组件方式判断权限"}},[t._v("#")]),t._v(" 组件方式判断权限")]),t._v(" "),r("ul",[r("li",[t._v("按钮、组件权限可用")])]),t._v(" "),r("h6",{attrs:{id:"实现原理、代码-3"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#实现原理、代码-3"}},[t._v("#")]),t._v(" 实现原理、代码")]),t._v(" "),r("p",[t._v("通过 "),r("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/router/utils.ts#L354",target:"_blank",rel:"noopener noreferrer"}},[t._v("hasAuth"),r("OutboundLink")],1),t._v(" 函数，进行权限组件的封装，使用 "),r("code",[t._v("Vue")]),t._v(" 提供的 "),r("a",{attrs:{href:"https://cn.vuejs.org/guide/extras/rendering-mechanism.html#patch-flags",target:"_blank",rel:"noopener noreferrer"}},[t._v("Fragment"),r("OutboundLink")],1),t._v(" 标签进行包裹，这样可让被包裹的组件无多余标签，减少渲染成本。"),r("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/components/ReAuth/src/auth.tsx",target:"_blank",rel:"noopener noreferrer"}},[t._v("查看具体代码"),r("OutboundLink")],1)]),t._v(" "),r("h6",{attrs:{id:"如何配置-3"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#如何配置-3"}},[t._v("#")]),t._v(" 如何配置")]),t._v(" "),r("p",[t._v("具体参考 "),r("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/views/permission/button/index.vue#L23-L38",target:"_blank",rel:"noopener noreferrer"}},[t._v("views/permission/button/index.vue"),r("OutboundLink")],1)]),t._v(" "),r("div",{staticClass:"language-Vue extra-class"},[r("pre",{pre:!0,attrs:{class:"language-vue"}},[r("code",[r("span",{pre:!0,attrs:{class:"token tag"}},[r("span",{pre:!0,attrs:{class:"token tag"}},[r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("<")]),t._v("Auth")]),t._v(" "),r("span",{pre:!0,attrs:{class:"token attr-name"}},[t._v("value")]),r("span",{pre:!0,attrs:{class:"token attr-value"}},[r("span",{pre:!0,attrs:{class:"token punctuation attr-equals"}},[t._v("=")]),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')]),t._v("btn_add"),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')])]),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(">")])]),t._v("\n "),r("span",{pre:!0,attrs:{class:"token tag"}},[r("span",{pre:!0,attrs:{class:"token tag"}},[r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("<")]),t._v("el-button")]),t._v(" "),r("span",{pre:!0,attrs:{class:"token attr-name"}},[t._v("type")]),r("span",{pre:!0,attrs:{class:"token attr-value"}},[r("span",{pre:!0,attrs:{class:"token punctuation attr-equals"}},[t._v("=")]),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')]),t._v("success"),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')])]),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(">")])]),t._v(" 拥有code：'btn_add' 权限可见 "),r("span",{pre:!0,attrs:{class:"token tag"}},[r("span",{pre:!0,attrs:{class:"token tag"}},[r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("")])]),t._v("\n"),r("span",{pre:!0,attrs:{class:"token tag"}},[r("span",{pre:!0,attrs:{class:"token tag"}},[r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("")])]),t._v("\n")])])]),r("div",{staticClass:"custom-block tip"},[r("p",{staticClass:"custom-block-title"},[t._v("提示")]),t._v(" "),r("p",[t._v("平台已经全局注册 "),r("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/main.ts#L44-L45",target:"_blank",rel:"noopener noreferrer"}},[t._v("Auth"),r("OutboundLink")],1),t._v(" 组件，无需重复注册")])]),t._v(" "),r("h5",{attrs:{id:"函数方式判断权限"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#函数方式判断权限"}},[t._v("#")]),t._v(" 函数方式判断权限")]),t._v(" "),r("ul",[r("li",[t._v("按钮、组件、类方法权限都可用")])]),t._v(" "),r("h6",{attrs:{id:"实现原理、代码-4"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#实现原理、代码-4"}},[t._v("#")]),t._v(" 实现原理、代码")]),t._v(" "),r("p",[t._v("通过 "),r("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/router/utils.ts#L354",target:"_blank",rel:"noopener noreferrer"}},[t._v("hasAuth"),r("OutboundLink")],1),t._v(" 函数判断某些按钮、组件、类方法是否有按钮级别的权限")]),t._v(" "),r("h6",{attrs:{id:"如何配置-4"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#如何配置-4"}},[t._v("#")]),t._v(" 如何配置")]),t._v(" "),r("p",[t._v("具体参考 "),r("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/views/permission/button/index.vue#L40-L56",target:"_blank",rel:"noopener noreferrer"}},[t._v("views/permission/button/index.vue"),r("OutboundLink")],1)]),t._v(" "),r("div",{staticClass:"language-Vue extra-class"},[r("pre",{pre:!0,attrs:{class:"language-vue"}},[r("code",[r("span",{pre:!0,attrs:{class:"token tag"}},[r("span",{pre:!0,attrs:{class:"token tag"}},[r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("<")]),t._v("el-button")]),t._v(" "),r("span",{pre:!0,attrs:{class:"token attr-name"}},[t._v("type")]),r("span",{pre:!0,attrs:{class:"token attr-value"}},[r("span",{pre:!0,attrs:{class:"token punctuation attr-equals"}},[t._v("=")]),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')]),t._v("success"),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')])]),t._v(" "),r("span",{pre:!0,attrs:{class:"token attr-name"}},[t._v("v-if")]),r("span",{pre:!0,attrs:{class:"token attr-value"}},[r("span",{pre:!0,attrs:{class:"token punctuation attr-equals"}},[t._v("=")]),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')]),t._v("hasAuth('btn_add')"),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')])]),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(">")])]),t._v("\n 拥有code：'btn_add' 权限可见\n"),r("span",{pre:!0,attrs:{class:"token tag"}},[r("span",{pre:!0,attrs:{class:"token tag"}},[r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("")])]),t._v("\n")])])]),r("div",{staticClass:"language-ts extra-class"},[r("pre",{pre:!0,attrs:{class:"language-ts"}},[r("code",[r("span",{pre:!0,attrs:{class:"token function"}},[t._v("hasAuth")]),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),r("span",{pre:!0,attrs:{class:"token string"}},[t._v('"btn_add"')]),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),r("span",{pre:!0,attrs:{class:"token operator"}},[t._v("?")]),t._v(" "),r("span",{pre:!0,attrs:{class:"token string"}},[t._v('"显示"')]),t._v(" "),r("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),r("span",{pre:!0,attrs:{class:"token string"}},[t._v('"隐藏"')]),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])]),r("h5",{attrs:{id:"指令方式判断权限"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#指令方式判断权限"}},[t._v("#")]),t._v(" 指令方式判断权限")]),t._v(" "),r("ul",[r("li",[t._v("按钮、组件权限可用。指令方式不能动态修改权限")])]),t._v(" "),r("h6",{attrs:{id:"实现原理、代码-5"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#实现原理、代码-5"}},[t._v("#")]),t._v(" 实现原理、代码")]),t._v(" "),r("p",[t._v("通过 "),r("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/router/utils.ts#L354",target:"_blank",rel:"noopener noreferrer"}},[t._v("hasAuth"),r("OutboundLink")],1),t._v(" 函数，进行权限指令的封装。"),r("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/directives/auth/index.ts",target:"_blank",rel:"noopener noreferrer"}},[t._v("查看具体代码"),r("OutboundLink")],1)]),t._v(" "),r("h6",{attrs:{id:"如何配置-5"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#如何配置-5"}},[t._v("#")]),t._v(" 如何配置")]),t._v(" "),r("p",[t._v("具体参考 "),r("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/views/permission/button/index.vue#L58-L73",target:"_blank",rel:"noopener noreferrer"}},[t._v("views/permission/button/index.vue"),r("OutboundLink")],1)]),t._v(" "),r("div",{staticClass:"language-Vue extra-class"},[r("pre",{pre:!0,attrs:{class:"language-vue"}},[r("code",[r("span",{pre:!0,attrs:{class:"token tag"}},[r("span",{pre:!0,attrs:{class:"token tag"}},[r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("<")]),t._v("el-button")]),t._v(" "),r("span",{pre:!0,attrs:{class:"token attr-name"}},[t._v("type")]),r("span",{pre:!0,attrs:{class:"token attr-value"}},[r("span",{pre:!0,attrs:{class:"token punctuation attr-equals"}},[t._v("=")]),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')]),t._v("success"),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')])]),t._v(" "),r("span",{pre:!0,attrs:{class:"token attr-name"}},[t._v("v-auth")]),r("span",{pre:!0,attrs:{class:"token attr-value"}},[r("span",{pre:!0,attrs:{class:"token punctuation attr-equals"}},[t._v("=")]),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')]),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("'")]),t._v("btn_add'"),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')])]),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(">")])]),t._v("\n 拥有code：'btn_add' 权限可见\n"),r("span",{pre:!0,attrs:{class:"token tag"}},[r("span",{pre:!0,attrs:{class:"token tag"}},[r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("")])]),t._v("\n")])])]),r("h3",{attrs:{id:"细粒度权限"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#细粒度权限"}},[t._v("#")]),t._v(" 细粒度权限")]),t._v(" "),r("h4",{attrs:{id:"数据权限"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#数据权限"}},[t._v("#")]),t._v(" 数据权限")]),t._v(" "),r("p",[t._v("数据权限对页面的要求就非常简单了，比如可以将数据权限的配置功能放在 "),r("code",[t._v("角色管理")]),t._v(" 页面进行配置即可")])])}),[],!1,null,null,null);a.default=n.exports}}]); \ No newline at end of file diff --git a/assets/js/12.8227754c.js b/assets/js/12.8227754c.js new file mode 100644 index 0000000..31bf03e --- /dev/null +++ b/assets/js/12.8227754c.js @@ -0,0 +1 @@ +(window.webpackJsonp=window.webpackJsonp||[]).push([[12],{403:function(e,t,r){e.exports=r.p+"assets/img/buildgood.a05286f4.jpg"},404:function(e,t,r){e.exports=r.p+"assets/img/no-output.48778faf.jpg"},405:function(e,t,r){e.exports=r.p+"assets/img/output.e13d001d.jpg"},456:function(e,t,r){"use strict";r.r(t);var v=r(8),o=Object(v.a)({},(function(){var e=this,t=e.$createElement,v=e._self._c||t;return v("ContentSlotsDistributor",{attrs:{"slot-key":e.$parent.slotKey}},[v("p",[e._v("打包优化关联着网站的稳定与加载速度，在开发中也是非常重要的一项")]),e._v(" "),v("p",[v("img",{attrs:{src:r(403),alt:"buildgood"}})]),e._v(" "),v("h2",{attrs:{id:"vite-自身的构建优化"}},[v("a",{staticClass:"header-anchor",attrs:{href:"#vite-自身的构建优化"}},[e._v("#")]),e._v(" "),v("code",[e._v("vite")]),e._v(" 自身的构建优化")]),e._v(" "),v("p",[e._v("点击查看 "),v("a",{attrs:{href:"https://cn.vitejs.dev/guide/features.html#build-optimizations",target:"_blank",rel:"noopener noreferrer"}},[e._v("build-optimizations"),v("OutboundLink")],1),e._v(" "),v("Badge",{attrs:{text:"vite官方文档"}})],1),e._v(" "),v("h2",{attrs:{id:"css-优化"}},[v("a",{staticClass:"header-anchor",attrs:{href:"#css-优化"}},[e._v("#")]),e._v(" "),v("code",[e._v("css")]),e._v(" 优化")]),e._v(" "),v("p",[e._v("分两步优化")]),e._v(" "),v("h3",{attrs:{id:"​-压缩-css"}},[v("a",{staticClass:"header-anchor",attrs:{href:"#​-压缩-css"}},[e._v("#")]),e._v(" ​ 压缩 "),v("code",[e._v("css")])]),e._v(" "),v("p",[e._v("使用 "),v("RouterLink",{attrs:{to:"/pages/tailwindcss/#cssnano"}},[e._v("cssnano")]),e._v(" 去压缩 "),v("code",[e._v("css")])],1),e._v(" "),v("h3",{attrs:{id:"​-自动添加浏览器前缀"}},[v("a",{staticClass:"header-anchor",attrs:{href:"#​-自动添加浏览器前缀"}},[e._v("#")]),e._v(" ​ 自动添加浏览器前缀")]),e._v(" "),v("p",[e._v("使用 "),v("RouterLink",{attrs:{to:"/pages/tailwindcss/#autoprefixer"}},[e._v("Autoprefixer")]),e._v(" 自动添加浏览器前缀")],1),e._v(" "),v("h2",{attrs:{id:"组件、工具库"}},[v("a",{staticClass:"header-anchor",attrs:{href:"#组件、工具库"}},[e._v("#")]),e._v(" 组件、工具库")]),e._v(" "),v("ul",[v("li",[v("p",[e._v("无论是组件（如 "),v("code",[e._v("element-plus")]),e._v("），还是工具库（如 "),v("code",[e._v("lodash")]),e._v("、"),v("code",[e._v("axios")]),e._v("）我们都应该尽可能的按需引入，使其有良好的  "),v("code",[e._v("tree-shaking")]),e._v(" 效果，这样项目整体打包出来的无用代码就少之又少了")])]),e._v(" "),v("li",[v("p",[e._v("拿 "),v("code",[e._v("lodash")]),e._v(" 举例，"),v("code",[e._v("lodash")]),e._v(" 默认是 "),v("code",[e._v("cjs")]),e._v(" 格式，不支持 "),v("code",[e._v("es6")]),e._v(" 的 "),v("code",[e._v("import")]),e._v(" 语法，那么我们就可以去 "),v("code",[e._v("github")]),e._v(" 或者某些搜索引擎去寻找替代品，最终平台找到了 "),v("code",[e._v("lodash-unified")]),e._v("，它完全兼容 "),v("code",[e._v("lodash")]),e._v(" 的全部语法并且既支持 "),v("code",[e._v("esm")]),e._v(" 又支持 "),v("code",[e._v("cjs")]),e._v("，这使得它无论在浏览器还是 "),v("code",[e._v("node")]),e._v(" 环境中表现都很良好。当然如果遇到那种只支持 "),v("code",[e._v("cjs")]),e._v(" 格式，网上找遍了都找不到兼容 "),v("code",[e._v("esm")]),e._v(" 格式的咋办呢，这时你可以参考 "),v("code",[e._v("lodash-unified")]),e._v("，看看别人是如何转换的 😊")])]),e._v(" "),v("li",[v("p",[v("code",[e._v("vite")]),e._v(" 目前最大的性能瓶颈是大量模块的首页加载，可看 "),v("a",{attrs:{href:"https://github.com/vitejs/vite/issues/1309#issue-777569758",target:"_blank",rel:"noopener noreferrer"}},[e._v("vite-issues"),v("OutboundLink")],1),e._v("，值得期待的是这个 "),v("a",{attrs:{href:"https://github.com/vitejs/vite/pull/10671",target:"_blank",rel:"noopener noreferrer"}},[e._v("pr"),v("OutboundLink")],1),e._v(" 可能会缓解这个麻烦")])])]),e._v(" "),v("h2",{attrs:{id:"压缩-gzip、brotli-格式"}},[v("a",{staticClass:"header-anchor",attrs:{href:"#压缩-gzip、brotli-格式"}},[e._v("#")]),e._v(" 压缩 "),v("code",[e._v("gzip")]),e._v("、"),v("code",[e._v("brotli")]),e._v(" 格式")]),e._v(" "),v("p",[e._v("使用 "),v("a",{attrs:{href:"https://github.com/vbenjs/vite-plugin-compression",target:"_blank",rel:"noopener noreferrer"}},[e._v("vite-plugin-compression"),v("OutboundLink")],1),e._v(" 对平台进行 "),v("code",[e._v("gzip")]),e._v(" 或者 "),v("code",[e._v("brotli")]),e._v(" 压缩，"),v("code",[e._v("nginx")]),e._v(" 对这两种压缩模式都支持，压缩后部署到 "),v("code",[e._v("nginx")]),e._v(" 将极大提高网页加载速度")]),e._v(" "),v("h3",{attrs:{id:"如何开启压缩"}},[v("a",{staticClass:"header-anchor",attrs:{href:"#如何开启压缩"}},[e._v("#")]),e._v(" 如何开启压缩")]),e._v(" "),v("p",[e._v("来到 "),v("code",[e._v(".env.production")]),e._v(" 文件，设置 "),v("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/.env.production#L13",target:"_blank",rel:"noopener noreferrer"}},[e._v("VITE_COMPRESSION"),v("OutboundLink")],1),e._v(" 即可。设置总体分为下面两种 "),v("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/build/compress.ts",target:"_blank",rel:"noopener noreferrer"}},[e._v("具体实现代码"),v("OutboundLink")],1)]),e._v(" "),v("h4",{attrs:{id:"两种总体设置"}},[v("a",{staticClass:"header-anchor",attrs:{href:"#两种总体设置"}},[e._v("#")]),e._v(" 两种总体设置")]),e._v(" "),v("ol",[v("li",[e._v("压缩时不删除原始文件的配置")]),e._v(" "),v("li",[e._v("压缩时删除原始文件的配置")])]),e._v(" "),v("h5",{attrs:{id:"压缩时不删除原始文件的配置"}},[v("a",{staticClass:"header-anchor",attrs:{href:"#压缩时不删除原始文件的配置"}},[e._v("#")]),e._v(" 压缩时不删除原始文件的配置")]),e._v(" "),v("div",{staticClass:"language-.env.production extra-class"},[v("pre",{pre:!0,attrs:{class:"language-text"}},[v("code",[e._v('开启 gzip 压缩\nVITE_COMPRESSION = "gzip"\n\n开启 brotli 压缩\nVITE_COMPRESSION = "brotli"\n\n# 同时开启 gzip 与 brotli 压缩\nVITE_COMPRESSION = "both"\n\n# 不开启压缩，默认\nVITE_COMPRESSION = "none"\n')])])]),v("h5",{attrs:{id:"压缩时删除原始文件的配置"}},[v("a",{staticClass:"header-anchor",attrs:{href:"#压缩时删除原始文件的配置"}},[e._v("#")]),e._v(" 压缩时删除原始文件的配置")]),e._v(" "),v("div",{staticClass:"language-.env.production extra-class"},[v("pre",{pre:!0,attrs:{class:"language-text"}},[v("code",[e._v('开启 gzip 压缩\nVITE_COMPRESSION = "gzip-clear"\n\n开启 brotli 压缩\nVITE_COMPRESSION = "brotli-clear"\n\n# 同时开启 gzip 与 brotli 压缩\nVITE_COMPRESSION = "both-clear"\n\n# 不开启压缩，默认\nVITE_COMPRESSION = "none"\n')])])]),v("h2",{attrs:{id:"采用-cdn-模式替换本地依赖"}},[v("a",{staticClass:"header-anchor",attrs:{href:"#采用-cdn-模式替换本地依赖"}},[e._v("#")]),e._v(" 采用 "),v("code",[e._v("cdn")]),e._v(" 模式替换本地依赖")]),e._v(" "),v("h3",{attrs:{id:"vite-插件"}},[v("a",{staticClass:"header-anchor",attrs:{href:"#vite-插件"}},[e._v("#")]),e._v(" "),v("code",[e._v("vite")]),e._v(" 插件")]),e._v(" "),v("p",[e._v("使用 "),v("a",{attrs:{href:"https://github.com/MMF-FE/vite-plugin-cdn-import/blob/master/README.zh-CN.md",target:"_blank",rel:"noopener noreferrer"}},[e._v("vite-plugin-cdn-import"),v("OutboundLink")],1),e._v(" 插件，在打包时将指定的 "),v("code",[e._v("modules")]),e._v(" 替换成 "),v("code",[e._v("cdn")]),e._v(" 链接，从而减少构建时间，提高生产环境中页面加载速度。")]),e._v(" "),v("h3",{attrs:{id:"cdn-厂商-免费"}},[v("a",{staticClass:"header-anchor",attrs:{href:"#cdn-厂商-免费"}},[e._v("#")]),e._v(" "),v("code",[e._v("cdn")]),e._v(" 厂商（免费）")]),e._v(" "),v("p",[e._v("平台 "),v("code",[e._v("cdn")]),e._v(" 采用的是国内 "),v("a",{attrs:{href:"https://www.bootcdn.cn",target:"_blank",rel:"noopener noreferrer"}},[e._v("bootcdn"),v("OutboundLink")],1),e._v("，主要是稳定并且快，当然您也可以选择 "),v("a",{attrs:{href:"https://unpkg.com",target:"_blank",rel:"noopener noreferrer"}},[e._v("unpkg"),v("OutboundLink")],1),e._v(" 或者 "),v("a",{attrs:{href:"https://www.jsdelivr.com",target:"_blank",rel:"noopener noreferrer"}},[e._v("jsdelivr"),v("OutboundLink")],1),e._v("，这两个 "),v("code",[e._v("cdn")]),e._v(" 是国外的")]),e._v(" "),v("h3",{attrs:{id:"如何启动-cdn-替换"}},[v("a",{staticClass:"header-anchor",attrs:{href:"#如何启动-cdn-替换"}},[e._v("#")]),e._v(" 如何启动 "),v("code",[e._v("cdn")]),e._v(" 替换")]),e._v(" "),v("p",[e._v("来到 "),v("code",[e._v(".env.production")]),e._v(" 文件，将 "),v("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/.env.production#L8",target:"_blank",rel:"noopener noreferrer"}},[e._v("VITE_CDN"),v("OutboundLink")],1),e._v(" 设置成 "),v("code",[e._v("true")]),e._v(" 即可")]),e._v(" "),v("h3",{attrs:{id:"默认启动-cdn-替换的模块有哪些"}},[v("a",{staticClass:"header-anchor",attrs:{href:"#默认启动-cdn-替换的模块有哪些"}},[e._v("#")]),e._v(" 默认启动 "),v("code",[e._v("cdn")]),e._v(" 替换的模块有哪些")]),e._v(" "),v("p",[v("code",[e._v("vue")]),e._v("、"),v("code",[e._v("vue-router")]),e._v("、"),v("code",[e._v("vue-demi")]),e._v("、"),v("code",[e._v("pinia")]),e._v("、"),v("code",[e._v("element-plus")]),e._v("、"),v("code",[e._v("axios")]),e._v("、"),v("code",[e._v("dayjs")]),e._v("、"),v("code",[e._v("echarts")]),e._v(" 具体代码 "),v("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/build/cdn.ts",target:"_blank",rel:"noopener noreferrer"}},[e._v("build/cdn.ts"),v("OutboundLink")],1)]),e._v(" "),v("h2",{attrs:{id:"生产环境删除-console-log"}},[v("a",{staticClass:"header-anchor",attrs:{href:"#生产环境删除-console-log"}},[e._v("#")]),e._v(" 生产环境删除 "),v("code",[e._v("console.log")])]),e._v(" "),v("p",[e._v("使用平台开发的 "),v("a",{attrs:{href:"https://github.com/xiaoxian521/vite-plugin-remove-console",target:"_blank",rel:"noopener noreferrer"}},[e._v("vite-plugin-remove-console"),v("OutboundLink")],1),e._v(" 插件，在打包构建时移除平台中所有的 "),v("code",[e._v("console.log")])]),e._v(" "),v("h2",{attrs:{id:"静态资源分类打包"}},[v("a",{staticClass:"header-anchor",attrs:{href:"#静态资源分类打包"}},[e._v("#")]),e._v(" 静态资源分类打包")]),e._v(" "),v("p",[v("code",[e._v("vite")]),e._v(" 是基于 "),v("code",[e._v("esbuild")]),e._v(" 和 "),v("code",[e._v("rollup")]),e._v(" 构建的，在打包时如果不进行 "),v("code",[e._v("output")]),e._v(" 的配置，打包出来的效果如下图（这也是 "),v("code",[e._v("vite")]),e._v(" 默认打包出来的效果，可以看到所有文件都混在一起）")]),e._v(" "),v("p",[v("img",{attrs:{src:r(404),alt:"no-output"}})]),e._v(" "),v("p",[e._v("下图是我们配置 "),v("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/vite.config.ts#L63-67",target:"_blank",rel:"noopener noreferrer"}},[e._v("output"),v("OutboundLink")],1),e._v(" 后的效果，可以看到文件都进行了分类存放，这也方便我们查找文件")]),e._v(" "),v("p",[v("img",{attrs:{src:r(405),alt:"output"}})]),e._v(" "),v("div",{staticClass:"custom-block tip"},[v("p",{staticClass:"custom-block-title"},[e._v("相关推荐")]),e._v(" "),v("p",[v("a",{attrs:{href:"https://github.com/sanyuan0704/vite-plugin-chunk-split/blob/master/README-CN.md",target:"_blank",rel:"noopener noreferrer"}},[e._v("Vite 代码拆包插件。支持多种拆包策略，可避免手动操作 manualChunks 潜在的循环依赖问题"),v("OutboundLink")],1)])]),e._v(" "),v("h2",{attrs:{id:"svg-压缩"}},[v("a",{staticClass:"header-anchor",attrs:{href:"#svg-压缩"}},[e._v("#")]),e._v(" "),v("code",[e._v("svg")]),e._v(" 压缩")]),e._v(" "),v("p",[e._v("一般下载的 "),v("code",[e._v("svg")]),e._v(" 或者复制的 "),v("code",[e._v("svg")]),e._v(" 代码，里面存在一些无关紧要的元素，可以将其剔除，毫无影响地降低 "),v("code",[e._v("svg")]),e._v(" 大小"),v("br"),e._v("\n平台使用了 "),v("a",{attrs:{href:"https://www.npmjs.com/package/svgo",target:"_blank",rel:"noopener noreferrer"}},[e._v("svgo"),v("OutboundLink")],1),e._v(" 工具对所有 "),v("code",[e._v("svg")]),e._v(" 进行了压缩，您拉取平台代码时所有 "),v("code",[e._v("svg")]),e._v(" 都已经最简了哦。当然您会问自己新加的 "),v("code",[e._v("svg")]),e._v(" 如何精简呢，来到 "),v("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/package.json#L14",target:"_blank",rel:"noopener noreferrer"}},[e._v("main/package.json"),v("OutboundLink")],1),e._v("，可以看到平台默认使用 "),v("code",[e._v("svgo")]),e._v(" 工具对 "),v("code",[e._v("src/assets/svg")]),e._v(" 文件夹里的所有 "),v("code",[e._v("svg")]),e._v(" 进行压缩，这是可以改动的，只需要将 "),v("code",[e._v("-f")]),e._v(" 和 "),v("code",[e._v("-o")]),e._v(" 后的路径改为您需要压缩的 "),v("code",[e._v("svg")]),e._v(" 路径即可。温馨提示：只需要运行 "),v("code",[e._v("pnpm svgo")]),e._v(" 命令对 "),v("code",[e._v("svg")]),e._v(" 文件进行一次压缩即可")]),e._v(" "),v("div",{staticClass:"custom-block tip"},[v("p",{staticClass:"custom-block-title"},[e._v("推荐阅读")]),e._v(" "),v("ul",[v("li",[v("a",{attrs:{href:"https://cn.vuejs.org/guide/best-practices/performance.html",target:"_blank",rel:"noopener noreferrer"}},[e._v("性能优化"),v("OutboundLink")],1),e._v(" "),v("Badge",{attrs:{text:"vue文档"}})],1),e._v(" "),v("li",[v("a",{attrs:{href:"https://router.vuejs.org/zh/guide/advanced/lazy-loading.html#%E4%BD%BF%E7%94%A8-vite",target:"_blank",rel:"noopener noreferrer"}},[e._v("Vite 中组件按组分块打包"),v("OutboundLink")],1),e._v(" "),v("Badge",{attrs:{text:"vue-router文档"}})],1)])])])}),[],!1,null,null,null);t.default=o.exports}}]); \ No newline at end of file diff --git a/assets/js/13.edf0dd27.js b/assets/js/13.edf0dd27.js new file mode 100644 index 0000000..89f4148 --- /dev/null +++ b/assets/js/13.edf0dd27.js @@ -0,0 +1 @@ +(window.webpackJsonp=window.webpackJsonp||[]).push([[13],{286:function(t,e,n){},436:function(t,e,n){"use strict";n(286)},468:function(t,e,n){"use strict";n.r(e);var i={functional:!0,props:{type:{type:String,default:"tip"},text:String,vertical:{type:String,default:"top"}},render:(t,{props:e,slots:n})=>t("span",{class:["badge",e.type],style:{verticalAlign:e.vertical}},e.text||n().default)},p=(n(436),n(8)),l=Object(p.a)(i,void 0,void 0,!1,null,"3f5e71b8",null);e.default=l.exports}}]); \ No newline at end of file diff --git a/assets/js/14.7e6d1c5f.js b/assets/js/14.7e6d1c5f.js new file mode 100644 index 0000000..c674069 --- /dev/null +++ b/assets/js/14.7e6d1c5f.js @@ -0,0 +1 @@ +(window.webpackJsonp=window.webpackJsonp||[]).push([[14],{250:function(t,s,n){},289:function(t,s,n){"use strict";n(250)},438:function(t,s,n){"use strict";n.r(s);const e=["这里什么都没有。","我是谁？我在哪？","这是一个Four-Oh-Four.","看来我们的链接坏掉了~"];var i={methods:{getMsg:()=>e[Math.floor(Math.random()*e.length)]}},o=(n(289),n(8)),a=Object(o.a)(i,(function(){var t=this.$createElement,s=this._self._c||t;return s("div",{staticClass:"theme-container"},[s("div",{staticClass:"theme-vdoing-content"},[s("span",[this._v("404")]),this._v(" "),s("blockquote",[this._v(this._s(this.getMsg()))]),this._v(" "),s("router-link",{attrs:{to:"/"}},[this._v("返回首页")])],1)])}),[],!1,null,"76f36478",null);s.default=a.exports}}]); \ No newline at end of file diff --git a/assets/js/15.28cff7c8.js b/assets/js/15.28cff7c8.js new file mode 100644 index 0000000..63f30c7 --- /dev/null +++ b/assets/js/15.28cff7c8.js @@ -0,0 +1 @@ +(window.webpackJsonp=window.webpackJsonp||[]).push([[15],{347:function(t,s,a){t.exports=a.p+"assets/img/logo.ed0fcf84.png"},348:function(t,s,a){t.exports=a.p+"assets/img/config-logo.3e10c5ac.jpg"},444:function(t,s,a){"use strict";a.r(s);var n=a(8),e=Object(n.a)({},(function(){var t=this,s=t.$createElement,n=t._self._c||s;return n("ContentSlotsDistributor",{attrs:{"slot-key":t.$parent.slotKey}},[n("h2",{attrs:{id:"logo"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#logo"}},[t._v("#")]),t._v(" logo")]),t._v(" "),n("p",[t._v("下图左上角箭头所指处就是平台的 "),n("code",[t._v("logo")])]),t._v(" "),n("p",[n("img",{attrs:{src:a(347),alt:"logo"}})]),t._v(" "),n("p",[t._v("为了保持 "),n("code",[t._v("logo")]),t._v(" 的高保真，平台采用 "),n("code",[t._v("svg")]),t._v(" 作为 "),n("code",[t._v("logo")]),t._v(" 格式。自定义 "),n("code",[t._v("logo")]),t._v(" ，只需修改下图 "),n("code",[t._v("logo.svg")]),t._v(" 文件即可")]),t._v(" "),n("p",[n("img",{attrs:{src:a(348),alt:"config-logo"}})]),t._v(" "),n("p",[t._v("当然也可以自定义 "),n("code",[t._v("logo")]),t._v(" 格式。比如需要 "),n("code",[t._v("png")]),t._v(" 的图片，只需要把上图中 "),n("code",[t._v("logo.svg")]),t._v(" 换成所需的 "),n("code",[t._v("logo.png")]),t._v(" ，然后来到 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/layout/hooks/useNav.ts",target:"_blank",rel:"noopener noreferrer"}},[t._v("layout/hooks/useNav.ts"),n("OutboundLink")],1),t._v(" ，把 "),n("code",[t._v('"/logo.svg"')]),t._v(" 改成 "),n("code",[t._v('"/logo.png"')]),t._v(" 即可")]),t._v(" "),n("h2",{attrs:{id:"环境变量"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#环境变量"}},[t._v("#")]),t._v(" 环境变量")]),t._v(" "),n("h3",{attrs:{id:"配置文件"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#配置文件"}},[t._v("#")]),t._v(" 配置文件")]),t._v(" "),n("p",[t._v("一共 "),n("code",[t._v("四")]),t._v(" 个配置文件，都在平台根目录下，具体如下")]),t._v(" "),n("div",{staticClass:"language- extra-class"},[n("pre",{pre:!0,attrs:{class:"language-text"}},[n("code",[t._v("├── .env # 基础环境变量配置文件（优先级最低）\n├── .env.development # 开发环境变量配置文件\n├── .env.production # 生产环境变量配置文件\n├── .env.staging # 预发布环境变量配置文件\n")])])]),n("h3",{attrs:{id:"具体配置"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#具体配置"}},[t._v("#")]),t._v(" 具体配置")]),t._v(" "),n("p",[t._v("平台内置 "),n("code",[t._v("六")]),t._v(" 个环境变量，具体如下")]),t._v(" "),n("div",{staticClass:"language-sh extra-class"},[n("pre",{pre:!0,attrs:{class:"language-sh"}},[n("code",[n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("# 平台本地运行端口号")]),t._v("\nVITE_PORT "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token number"}},[t._v("8848")]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("# 平台打包路径")]),t._v("\nVITE_PUBLIC_PATH "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" /\n\n"),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v('# 平台路由历史模式（Hash模式传"hash"、HTML5模式传"h5"、Hash模式带base参数传"hash,base参数"、HTML5模式带base参数传"h5,base参数"）')]),t._v("\nVITE_ROUTER_HISTORY "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"hash"')]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("# 是否在打包时使用cdn替换本地库 替换 true 不替换 false")]),t._v("\nVITE_CDN "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token boolean"}},[t._v("false")]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("# 是否启用gzip压缩或brotli压缩（分两种情况，删除原始文件和不删除原始文件）")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("# 压缩时不删除原始文件的配置：gzip、brotli、both（同时开启 gzip 与 brotli 压缩）、none（不开启压缩，默认）")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("# 压缩时删除原始文件的配置：gzip-clear、brotli-clear、both-clear（同时开启 gzip 与 brotli 压缩）、none（不开启压缩，默认）")]),t._v("\nVITE_COMPRESSION "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"none"')]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("# 是否隐藏首页 隐藏 true 不隐藏 false （勿删除，VITE_HIDE_HOME只需在.env文件配置）")]),t._v("\nVITE_HIDE_HOME "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token boolean"}},[t._v("false")]),t._v("\n")])])]),n("h3",{attrs:{id:"基础用法"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#基础用法"}},[t._v("#")]),t._v(" 基础用法")]),t._v(" "),n("p",[n("a",{attrs:{href:"https://cn.vitejs.dev/guide/env-and-mode.html#env-files",target:"_blank",rel:"noopener noreferrer"}},[t._v(".env 文件"),n("OutboundLink")],1),t._v(" "),n("Badge",{attrs:{text:"vite文档"}})],1),t._v(" "),n("div",{staticClass:"language-Ts extra-class"},[n("pre",{pre:!0,attrs:{class:"language-ts"}},[n("code",[n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token constant"}},[t._v("VITE_PUBLIC_PATH")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),t._v("meta"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),t._v("env"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token builtin"}},[t._v("console")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("log")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"当前环境变量VITE_PUBLIC_PATH为："')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token constant"}},[t._v("VITE_PUBLIC_PATH")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v("\n")])])]),n("div",{staticClass:"custom-block tip"},[n("p",{staticClass:"custom-block-title"},[t._v("知识点：如何在 .vue 或 .ts 文件中判断当前是开发环境还是生产环境？")]),t._v(" "),n("p",[t._v("打印 "),n("code",[t._v("process.env.NODE_ENV")]),t._v("，值为 "),n("code",[t._v("development")]),t._v(" 代表是开发环境，值为 "),n("code",[t._v("production")]),t._v(" 代表是生产环境")])]),t._v(" "),n("h3",{attrs:{id:"如何添加自定义配置"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#如何添加自定义配置"}},[t._v("#")]),t._v(" 如何添加自定义配置")]),t._v(" "),n("p",[t._v("比如要在 "),n("code",[t._v(".env.production")]),t._v(" 文件添加自定义配置 "),n("code",[t._v("VITE_HANDSOME = true")]),t._v("，作为一种规范推荐使用 "),n("code",[t._v("VITE_")]),t._v(" 作为自定义配置前缀")]),t._v(" "),n("p",[t._v("① 在 "),n("code",[t._v(".env.production")]),t._v(" 中加入 "),n("code",[t._v("VITE_HANDSOME = true")]),t._v("，具体如下")]),t._v(" "),n("div",{staticClass:"language-sh extra-class"},[n("pre",{pre:!0,attrs:{class:"language-sh"}},[n("code",[n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("# 自定义配置")]),t._v("\nVITE_HANDSOME "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token boolean"}},[t._v("true")]),t._v("\n")])])]),n("p",[t._v("② 加入类型支持，在 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/types/global.d.ts",target:"_blank",rel:"noopener noreferrer"}},[t._v("interface ViteEnv"),n("OutboundLink")],1),t._v(" 里加上 "),n("code",[t._v("VITE_HANDSOME: boolean")]),t._v("，具体如下")]),t._v(" "),n("div",{staticClass:"language-Ts extra-class"},[n("pre",{pre:!0,attrs:{class:"language-ts"}},[n("code",[n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("interface")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token class-name"}},[t._v("ViteEnv")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token constant"}},[t._v("VITE_HANDSOME")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token builtin"}},[t._v("boolean")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v("\n")])])]),n("p",[t._v("③ 设置默认值，在 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/build/index.ts",target:"_blank",rel:"noopener noreferrer"}},[t._v("build/index.ts"),n("OutboundLink")],1),t._v(" 文件的 "),n("code",[t._v("ret")]),t._v(" 变量上加上 "),n("code",[t._v("VITE_HANDSOME: true")]),t._v("，具体如下")]),t._v(" "),n("div",{staticClass:"language-Ts extra-class"},[n("pre",{pre:!0,attrs:{class:"language-ts"}},[n("code",[n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" ret"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" ViteEnv "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token constant"}},[t._v("VITE_HANDSOME")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token boolean"}},[t._v("true")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v("\n")])])]),n("h2",{attrs:{id:"platform-config-json"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#platform-config-json"}},[t._v("#")]),t._v(" "),n("code",[t._v("platform-config.json")])]),t._v(" "),n("p",[n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/public/platform-config.json",target:"_blank",rel:"noopener noreferrer"}},[t._v("platform-config.json"),n("OutboundLink")],1),t._v(" 配置文件在任何环境下修改都可生效")]),t._v(" "),n("div",{staticClass:"language-json extra-class"},[n("pre",{pre:!0,attrs:{class:"language-json"}},[n("code",[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"Version"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"2.0.0"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 平台版本号")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"Title"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"RonnaAdmin"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 平台标题")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"FixedHeader"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token boolean"}},[t._v("true")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 是否固定页头和标签页（true 内容区超出出现纵向滚动条 false 页头、标签页、内容区可纵向滚动）")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"HiddenSideBar"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token boolean"}},[t._v("false")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 隐藏菜单和页头，只显示标签页和内容区")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"MultiTagsCache"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token boolean"}},[t._v("false")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 是否开启持久化标签 （会缓存）")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"KeepAlive"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token boolean"}},[t._v("true")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 是否开启组件缓存（此处不同于路由的 keepAlive，如果此处为 true 表示设置路由的 keepAlive 起效，反之设置 false 屏蔽平台整体的 keepAlive，即使路由设置了keepAlive 也不再起作用）")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"Locale"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"zh"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 默认国际化语言 （zh 中文、en 英文）（会缓存）")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"Layout"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"vertical"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 导航菜单模式 （vertical 左侧菜单模式、horizontal 顶部菜单模式、mix 综合菜单模式）（会缓存）")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"Theme"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"light"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 主题模式（会缓存）")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"DarkMode"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token boolean"}},[t._v("false")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 是否开启暗黑模式 （会缓存）")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"OverallStyle"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"light"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 整体风格（浅色：light、深色：dark、自动：system）（会缓存）更多详情看 https://github.com/ronnaces/ronna-admin/commit/dd783136229da9e291b518df93227111f4216ad0#commitcomment-137027417")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"Grey"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token boolean"}},[t._v("false")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 灰色模式（会缓存）")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"Weak"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token boolean"}},[t._v("false")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 色弱模式（会缓存）")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"HideTabs"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token boolean"}},[t._v("false")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 是否隐藏标签页（会缓存）")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"HideFooter"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token boolean"}},[t._v("false")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 是否隐藏页脚（会缓存）")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"SidebarStatus"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token boolean"}},[t._v("true")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// vertical左侧菜单模式模式下侧边栏状态（true 展开、false 收起）（会缓存）")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"EpThemeColor"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"#409EFF"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 主题色（会缓存）")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"ShowLogo"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token boolean"}},[t._v("true")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 是否显示logo（会缓存）")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"ShowModel"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"smart"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 标签页风格（smart 灵动模式、card 卡片模式）（会缓存）")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"MenuArrowIconNoTransition"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token boolean"}},[t._v("false")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 菜单展开、收起图标是否开启动画，如遇菜单展开、收起卡顿设置成 true 即可（默认 false，开启动画）")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"CachingAsyncRoutes"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token boolean"}},[t._v("false")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 是否开启动态路由缓存本地的全局配置，默认 false")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"TooltipEffect"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"light"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 可配置平台主体所有 el-tooltip 的 effect 属性，默认 light，不会影响业务代码")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"ResponsiveStorageNameSpace"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"responsive-"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 本地响应式存储的命名空间")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"MenuSearchHistory"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token number"}},[t._v("6")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 菜单搜索历史的最大条目")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v("\n")])])]),n("div",{staticClass:"custom-block tip"},[n("p",{staticClass:"custom-block-title"},[t._v("提示")]),t._v(" "),n("p",[t._v("开发、生产环境修改都可生效，上面 "),n("code",[t._v("platform-config.json")]),t._v(" 文件标记 "),n("code",[t._v("会缓存")]),t._v(" 即配置会缓存在本地浏览器，应先清空浏览器缓存才能生效")])]),t._v(" "),n("h3",{attrs:{id:"基础用法-2"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#基础用法-2"}},[t._v("#")]),t._v(" 基础用法")]),t._v(" "),n("p",[t._v("平台将 "),n("code",[t._v("platform-config.json")]),t._v(" 中所有配置都已经注册到 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/config/index.ts#L31",target:"_blank",rel:"noopener noreferrer"}},[t._v("$config"),n("OutboundLink")],1),t._v(" 这个全局属性对象上，应用内所有组件实例都可访问 "),n("a",{attrs:{href:"https://cn.vuejs.org/api/application.html#app-config-globalproperties",target:"_blank",rel:"noopener noreferrer"}},[t._v("globalproperties"),n("OutboundLink")],1)]),t._v(" "),n("h4",{attrs:{id:"vue-文件中使用-setup-语法"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#vue-文件中使用-setup-语法"}},[t._v("#")]),t._v(" "),n("code",[t._v(".vue")]),t._v(" 文件中使用（"),n("code",[t._v("setup")]),t._v(" 语法）")]),t._v(" "),n("div",{staticClass:"language-Vue extra-class"},[n("pre",{pre:!0,attrs:{class:"language-vue"}},[n("code",[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("<")]),t._v("script")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token attr-name"}},[t._v("setup")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token attr-name"}},[t._v("lang")]),n("span",{pre:!0,attrs:{class:"token attr-value"}},[n("span",{pre:!0,attrs:{class:"token punctuation attr-equals"}},[t._v("=")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')]),t._v("ts"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')])]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(">")])]),n("span",{pre:!0,attrs:{class:"token script"}},[n("span",{pre:!0,attrs:{class:"token language-javascript"}},[t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" getCurrentInstance "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"vue"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" Version "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("getCurrentInstance")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),t._v("appContext"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),t._v("config"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),t._v("globalProperties"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),t._v("$config"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\nconsole"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("log")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"Version："')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" Version"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v("\n")])]),n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("")])]),t._v("\n")])])]),n("h4",{attrs:{id:"vue-文件中使用-非-setup-语法"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#vue-文件中使用-非-setup-语法"}},[t._v("#")]),t._v(" "),n("code",[t._v(".vue")]),t._v(" 文件中使用（非 "),n("code",[t._v("setup")]),t._v(" 语法）")]),t._v(" "),n("div",{staticClass:"language-Vue extra-class"},[n("pre",{pre:!0,attrs:{class:"language-vue"}},[n("code",[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("<")]),t._v("script")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token attr-name"}},[t._v("lang")]),n("span",{pre:!0,attrs:{class:"token attr-value"}},[n("span",{pre:!0,attrs:{class:"token punctuation attr-equals"}},[t._v("=")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')]),t._v("ts"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')])]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(">")])]),n("span",{pre:!0,attrs:{class:"token script"}},[n("span",{pre:!0,attrs:{class:"token language-javascript"}},[t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("export")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("default")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("defineComponent")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token literal-property property"}},[t._v("computed")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("currentConfig")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("return")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("this")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),t._v("$config"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("?.")]),t._v("Version"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])]),n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token tag"}},[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("")])]),t._v("\n")])])]),n("h4",{attrs:{id:"ts-或-vue-中使用"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#ts-或-vue-中使用"}},[t._v("#")]),t._v(" "),n("code",[t._v(".ts")]),t._v(" 或 "),n("code",[t._v(".vue")]),t._v(" 中使用")]),t._v(" "),n("p",[t._v("具体实现代码位置 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/config/index.ts#L11",target:"_blank",rel:"noopener noreferrer"}},[t._v("config/index.ts"),n("OutboundLink")],1)]),t._v(" "),n("div",{staticClass:"language-Ts extra-class"},[n("pre",{pre:!0,attrs:{class:"language-ts"}},[n("code",[n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" getConfig "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"@/config"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token builtin"}},[t._v("console")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("log")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"Version："')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("getConfig")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("?.")]),t._v("Version"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v("\n")])])]),n("h3",{attrs:{id:"如何添加自定义配置-2"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#如何添加自定义配置-2"}},[t._v("#")]),t._v(" 如何添加自定义配置")]),t._v(" "),n("p",[t._v("比如要添加的自定义配置为 "),n("code",[t._v("Handsome: true")])]),t._v(" "),n("p",[t._v("① 在 "),n("code",[t._v("platform-config.json")]),t._v(" 中加入 "),n("code",[t._v("Handsome: true")]),t._v("，具体如下")]),t._v(" "),n("div",{staticClass:"language-json extra-class"},[n("pre",{pre:!0,attrs:{class:"language-json"}},[n("code",[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"Handsome"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token boolean"}},[t._v("true")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 自定义配置")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v("\n")])])]),n("p",[t._v("② 加入类型支持，在 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/types/global.d.ts#L84",target:"_blank",rel:"noopener noreferrer"}},[t._v("interface PlatformConfigs"),n("OutboundLink")],1),t._v(" 里加上 "),n("code",[t._v("Handsome?: boolean")]),t._v("，具体如下")]),t._v(" "),n("div",{staticClass:"language-Ts extra-class"},[n("pre",{pre:!0,attrs:{class:"language-ts"}},[n("code",[n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("interface")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token class-name"}},[t._v("PlatformConfigs")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n Handsome"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("?")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token builtin"}},[t._v("boolean")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 根据实际类型编写")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v("\n")])])]),n("h2",{attrs:{id:"package-json"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#package-json"}},[t._v("#")]),t._v(" "),n("code",[t._v("package.json")])]),t._v(" "),n("p",[n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/package.json#L6-24",target:"_blank",rel:"noopener noreferrer"}},[t._v("package.json"),n("OutboundLink")],1),t._v(" 文件中的 "),n("code",[t._v("scripts")]),t._v(" 配置中存放平台的各种命令，具体如下")]),t._v(" "),n("div",{staticClass:"language-json extra-class"},[n("pre",{pre:!0,attrs:{class:"language-json"}},[n("code",[n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"scripts"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"dev"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"NODE_OPTIONS=--max-old-space-size=4096 vite"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 启动平台")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"serve"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"pnpm dev"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 启动平台（有人喜欢dev、有人喜欢serve）")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"build"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"rimraf dist && NODE_OPTIONS=--max-old-space-size=8192 vite build"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 打包平台（rimraf 包的作用：以包的形式包装rm -rf命令，用来删除文件和文件夹的，不管文件夹是否为空，都可删除）")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"build:staging"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"rimraf dist && vite build --mode staging"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 打包平台（预发布环境）")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"report"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"rimraf dist && vite build"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 打包平台并生产平台包文件大小图形化分析")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"preview"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"vite preview"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 预览平台，需先打包（无需安装live-server等工具，vite自带预览功能）")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"preview:build"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"pnpm build && vite preview"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 打包并预览平台（无需安装live-server等工具，vite自带预览功能）")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"typecheck"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"tsc --noEmit && vue-tsc --noEmit --skipLibCheck"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 使用vue-tsc工具对指定的.ts、.tsx、.vue文件进行类型校验")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"svgo"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"svgo -f . -r"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 压缩当前目录下的所有SVG文件，更多详情看 https://github.com/ronnaces/ronna-admin/commit/a114dbb4652d6316853d75ff127180fc07d07d2b#commitcomment-136451628")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"cloc"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"NODE_OPTIONS=--max-old-space-size=4096 cloc . --exclude-dir=node_modules --exclude-lang=YAML"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 平台文件、语言分析")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"clean:cache"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"rimraf .eslintcache && rimraf node_modules && pnpm install"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 删除node_modules、清空eslint缓存并重新安装平台依赖")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"lint:eslint"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"eslint --cache --max-warnings 0 \\"{src,mock,build}/**/*.{vue,js,ts,tsx}\\" --fix"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// eslint修复")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"lint:prettier"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"prettier --write \\"src/**/*.{js,ts,json,tsx,css,scss,vue,html,md}\\""')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// prettier格式化")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"lint:stylelint"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"stylelint --cache --fix \\"**/*.{html,vue,css,scss}\\" --cache --cache-location node_modules/.cache/stylelint/"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// stylelint格式化修复")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"lint"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"pnpm lint:eslint && pnpm lint:prettier && pnpm lint:stylelint"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 平台整体lint格式化并修复")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"prepare"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"husky"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 自动生成husky（https://typicode.github.io/husky/#/）")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token property"}},[t._v('"preinstall"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"npx only-allow pnpm"')]),t._v(" "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 只允许运行pnpm命令，如果您换成yarn、npm需要把这行删除（https://pnpm.io/zh/only-allow-pnpm）")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v("\n")])])])])}),[],!1,null,null,null);s.default=e.exports}}]); \ No newline at end of file diff --git a/assets/js/16.3994d8a1.js b/assets/js/16.3994d8a1.js new file mode 100644 index 0000000..5fc38cc --- /dev/null +++ b/assets/js/16.3994d8a1.js @@ -0,0 +1 @@ +(window.webpackJsonp=window.webpackJsonp||[]).push([[16],{284:function(t,v,_){},434:function(t,v,_){"use strict";_(284)},465:function(t,v,_){"use strict";_.r(v);_(434);var d=_(8),e=Object(d.a)({},(function(){var t=this,v=t.$createElement,_=t._self._c||v;return _("ContentSlotsDistributor",{attrs:{"slot-key":t.$parent.slotKey}},[_("p",[t._v("非常感谢您选择了 "),_("code",[t._v("ronna-admin")]),t._v("。作者每天都在维护它，在保证其稳定的同时将 "),_("code",[t._v("95%")]),t._v(" 的依赖包保持最新。所以您不用因为升级依赖包而头疼，因为我们会把坑都踩了。当某些依赖包（如"),_("code",[t._v("vue")]),t._v("、"),_("code",[t._v("vite")]),t._v("、"),_("code",[t._v("element-plus")]),t._v("等）发布版本不久后，我们会跟进升级，让您在快速迭代的前端中时刻享受着最新依赖包带来的便利！")]),t._v(" "),_("p",[t._v("在代码、文档全部永久免费的基础上，我们还引入了更优质的可选服务，以满足您的各种需求！")]),t._v(" "),_("img",{attrs:{src:t.$withBase("/img/support/wx.png"),width:"180px",height:"180px"}}),t._v(" "),_("p",[t._v("从 "),_("code",[t._v("2018")]),t._v(" 年开始搞开源，一直到 "),_("code",[t._v("2024")]),t._v(" 年一直维护 "),_("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin",target:"_blank",rel:"noopener noreferrer"}},[t._v("ronna-admin"),_("OutboundLink")],1),t._v(" 组织中所有项目，把热爱一直持续下去，将开源真正当作一项事业来做，为用户提供更好的解决方案和服务，求各位老板的支持呀 ❤️！")]),t._v(" "),_("h2",{attrs:{id:"项目重构、项目升级"}},[_("a",{staticClass:"header-anchor",attrs:{href:"#项目重构、项目升级"}},[t._v("#")]),t._v(" 项目重构、项目升级")]),t._v(" "),_("p",[t._v("价格：根据重构、升级难度进行合理定价"),_("br"),t._v("\n服务内容：旧版 "),_("code",[t._v("ronna-admin")]),t._v(" 升级最新版（通常需要一天包升级到位）、"),_("code",[t._v("vue2")]),t._v(" 项目升级 "),_("code",[t._v("vue3")]),t._v("、自己项目某些依赖包想升级最新或升级时遇到瓶颈等"),_("br"),t._v("\n如何获得服务：加最上方作者微信备注 "),_("code",[t._v("重构升级")]),t._v(" 即可")]),t._v(" "),_("h2",{attrs:{id:"技术指导、远程服务、面试指导、自定义服务"}},[_("a",{staticClass:"header-anchor",attrs:{href:"#技术指导、远程服务、面试指导、自定义服务"}},[t._v("#")]),t._v(" 技术指导、远程服务、面试指导、自定义服务")]),t._v(" "),_("p",[t._v("价格：根据问题难度进行合理定价，按次收费"),_("br"),t._v("\n服务内容：各种前端问题解答、修复等。如果您还有别的需求尽管提，都会合理定价，包您满意"),_("br"),t._v("\n如何获得服务：加最上方作者微信备注 "),_("code",[t._v("技术指导")]),t._v(" 即可")]),t._v(" "),_("h2",{attrs:{id:"页面定制开发-软件开发、项目外包"}},[_("a",{staticClass:"header-anchor",attrs:{href:"#页面定制开发-软件开发、项目外包"}},[t._v("#")]),t._v(" 页面定制开发（软件开发、项目外包）")]),t._v(" "),_("p",[t._v("价格：根据页面数量、每页难度、开发周期进行合理定价"),_("br"),t._v("\n服务内容：软件开发过程中保证 "),_("code",[t._v("页面高还原度")]),t._v("、"),_("code",[t._v("代码高质量")]),t._v("、"),_("code",[t._v("全方位多次测试")]),t._v(" 。软件交付完毕后，不论您的软件工程量是大是小，我们都会提供 "),_("code",[t._v("一年免费技术支持")]),t._v("（免费小修、小改等），绝不辜负您选择了我们！"),_("br"),t._v("\n如何获得服务：加最上方作者微信备注 "),_("code",[t._v("软件开发")]),t._v(" 即可")]),t._v(" "),_("table",[_("thead",[_("tr",[_("th",[_("strong",[t._v("开发范围")])]),t._v(" "),_("th",[_("strong",[t._v("范围种类")])])])]),t._v(" "),_("tbody",[_("tr",[_("td",[t._v("网站")]),t._v(" "),_("td",[t._v("后台系统、可视化大屏、企业宣传页、活动推广页等各种只要能在浏览器查看的都能开发")])]),t._v(" "),_("tr",[_("td",[_("code",[t._v("h5")]),t._v("页面")]),t._v(" "),_("td",[t._v("移动端网站、广告推广、电子商务等")])]),t._v(" "),_("tr",[_("td",[t._v("小程序")]),t._v(" "),_("td",[t._v("微信、支付宝、抖音、快手、京东小程序等")])]),t._v(" "),_("tr",[_("td",[t._v("移动应用程序")]),t._v(" "),_("td",[t._v("可安装到安卓"),_("code",[t._v("Android")]),t._v("和苹果"),_("code",[t._v("iOS")]),t._v("系统的手机"),_("code",[t._v("App")]),t._v("软件")])]),t._v(" "),_("tr",[_("td",[t._v("桌面应用程序")]),t._v(" "),_("td",[t._v("可安装到桌面操作系统（如"),_("code",[t._v("Windows")]),t._v("、"),_("code",[t._v("MacOS")]),t._v("、"),_("code",[t._v("Linux")]),t._v("）上的软件，可直接在电脑上运行")])])])]),t._v(" "),_("h2",{attrs:{id:"企业赞助"}},[_("a",{staticClass:"header-anchor",attrs:{href:"#企业赞助"}},[t._v("#")]),t._v(" 企业赞助")]),t._v(" "),_("p",[t._v("成为赞助商即可获得以下服务")]),t._v(" "),_("ol",[_("li",[t._v("将贵公司 "),_("code",[t._v("LOGO")]),t._v(" 同时展示在 "),_("a",{attrs:{href:"https://admin.ronnaces.com/",target:"_blank",rel:"noopener noreferrer"}},[t._v("ronna-admin 预览官网"),_("OutboundLink")],1),t._v(" 、"),_("a",{attrs:{href:"https://ronnaces.github.io/ronna-admin-doc/",target:"_blank",rel:"noopener noreferrer"}},[t._v("ronna-admin 文档官网"),_("OutboundLink")],1),t._v(" 以及 "),_("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/README.md",target:"_blank",rel:"noopener noreferrer"}},[t._v("GitHub 仓库 README"),_("OutboundLink")],1),t._v(" 页面的明显位置。")])]),t._v(" "),_("p",[_("code",[t._v("ronna-admin")]),t._v(" 文档官网 "),_("code",[t._v("日均约3万")]),t._v(" 浏览量，更多详情请加最上方微信备注 "),_("code",[t._v("企业赞助")]),t._v(" 进行详聊。")]),t._v(" "),_("h2",{attrs:{id:"个人赞助"}},[_("a",{staticClass:"header-anchor",attrs:{href:"#个人赞助"}},[t._v("#")]),t._v(" 个人赞助")]),t._v(" "),_("p",[_("a",{attrs:{href:"https://github.com/ronnaces",target:"_blank",rel:"noopener noreferrer"}},[t._v("ronnaces"),_("OutboundLink")],1),t._v(" 组织一直坚持代码、文档教程全部永久免费开源，如果 "),_("code",[t._v("ronna-admin")]),t._v(" 帮助到了您，可以选择任意金额扫下方二维码进行赞助。赞助金额大于 "),_("code",[t._v("10")]),t._v(" 元时，可在赞助时备注您的 "),_("code",[t._v("Github")]),t._v(" 或 "),_("code",[t._v("github")]),t._v(" 或某个博客地址，我们会将其加入下方赞助名单中。您的赞助也会推动我们开发更多优质免费代码、补充更多优质免费文档")]),t._v(" "),_("table",[_("thead",[_("tr",[_("th",{staticStyle:{"text-align":"center"}},[t._v("微信赞赏")]),t._v(" "),_("th",{staticStyle:{"text-align":"center"}},[t._v("微信")]),t._v(" "),_("th",{staticStyle:{"text-align":"center"}},[t._v("支付宝")])])]),t._v(" "),_("tbody",[_("tr",[_("td",{staticStyle:{"text-align":"center"}},[_("img",{attrs:{src:t.$withBase("/img/support/wechat.png"),alt:"赞赏码",width:"180"}})]),t._v(" "),_("td",{staticStyle:{"text-align":"center"}},[_("img",{attrs:{src:t.$withBase("/img/support/wechatpay.png"),alt:"Wechat QRcode",width:"180"}})]),t._v(" "),_("td",{staticStyle:{"text-align":"center"}},[_("img",{attrs:{src:t.$withBase("/img/support/alipay.png"),alt:"Alipay QRcode",width:"180"}})])])])]),t._v(" "),_("h3",{attrs:{id:"赞助名单"}},[_("a",{staticClass:"header-anchor",attrs:{href:"#赞助名单"}},[t._v("#")]),t._v(" 赞助名单")]),t._v(" "),_("p",[t._v("非常感谢您们的赞助！"),_("br"),t._v("\n如果链接备注错了的话 😳，请加我微信联系哈"),_("br"),t._v("\n下面的昵称备注是我根据能获得的最大信息量推测的，称呼的不对，别见怪哈 😊"),_("br"),t._v("\n最后就是兄弟们进群只需按照上面备注的价格哈，不用多转！！！备注的价格，已经足够把贴心服务做好了哈 ❤️")]),t._v(" "),_("table",[_("thead",[_("tr",[_("th",[_("strong",[t._v("赞助人")])]),t._v(" "),_("th",[_("strong",[t._v("金额")])]),t._v(" "),_("th",[_("strong",[t._v("赞助人备注")])]),t._v(" "),_("th",[_("strong",[t._v("作者的回复")])])])]),t._v(" "),_("tbody",[_("tr",[_("td",[t._v("*Alate")]),t._v(" "),_("td"),t._v(" "),_("td",[t._v("感谢你这样的开源人贡献~辛苦了！中国开源不容易。也希望你可以找到盈利模式可以健康持续的运营下去哈~嗯 加油！另外注意身体健康！适当运动。注意久坐就溜达下哈。尽量早睡哈~健康第一~不耽误你了~")]),t._v(" "),_("td",[t._v("短短几句， 我竟不知如何回答了，非常感谢你们，还有那些默默支持的，非常感谢！")])]),t._v(" "),_("tr",[_("td",[t._v("*呼车")]),t._v(" "),_("td",[_("code",[t._v("300")])]),t._v(" "),_("td",[t._v("花点小钱，省点时间")]),t._v(" "),_("td",[t._v("感谢信任，谢谢我豪爽的大哥 ❤️")])]),t._v(" "),_("tr",[_("td",[t._v("MUCv")]),t._v(" "),_("td",[_("code",[t._v("298")])]),t._v(" "),_("td",[t._v("大佬你好，我是去年毕业的应届生，刚入行程序员不到一年，我是学 C++ 的，刚才公司摸鱼无意间在 B 站看到了大佬的视频，看了视频评论区，然后点开看了下 github 和 ronna-admin 文档，很受感动，虽然我不问项目和前端问题，但就想要买个大佬的服务支持下大佬，在国内这样的开源环境下，坚持在做对的事情")]),t._v(" "),_("td",[t._v("非常感谢哥们的支持，称呼我作者就行哈，嘿嘿。坚持在做热爱的事情，坚持在做对的事情，一起加油！ ✊ ❤️")])]),t._v(" "),_("tr",[_("td",[t._v("**jcx")]),t._v(" "),_("td",[_("code",[t._v("200")])]),t._v(" "),_("td",[t._v("全职开源不易，多的"),_("code",[t._v("200")]),t._v("是个人赞助，愿不忘初心，加油！")]),t._v(" "),_("td",[t._v("不忘初心！！！非常感谢哥们 ❤️")])]),t._v(" "),_("tr",[_("td",[t._v("**jb")]),t._v(" "),_("td",[_("code",[t._v("188")])]),t._v(" "),_("td",[t._v("希望不忘初心，始终开源下去 👏")]),t._v(" "),_("td",[t._v("好的，大哥。多的不说了哈，一起看实际行动 ❤️")])]),t._v(" "),_("tr",[_("td",[t._v("**豪c")]),t._v(" "),_("td",[_("code",[t._v("188")])]),t._v(" "),_("td",[t._v("加油")]),t._v(" "),_("td",[t._v("一起加油，豪哥 ✊ ❤️")])]),t._v(" "),_("tr",[_("td",[t._v("*贝a")]),t._v(" "),_("td",[_("code",[t._v("100")])]),t._v(" "),_("td"),t._v(" "),_("td")]),t._v(" "),_("tr",[_("td",[t._v("Jung")]),t._v(" "),_("td",[_("code",[t._v("100")])]),t._v(" "),_("td",[t._v("好东西要支持，能力范围之内，不要伤了作者一片至诚的心，哈哈哈哈哈")]),t._v(" "),_("td",[t._v("嘿嘿，非常感谢哥们支持哈 ❤️")])]),t._v(" "),_("tr",[_("td",[t._v("S*hb")]),t._v(" "),_("td",[_("code",[t._v("100")])]),t._v(" "),_("td",[t._v("开源不易，加油")]),t._v(" "),_("td",[t._v("非常感谢哥们，一起加油 ✊")])]),t._v(" "),_("tr",[_("td",[t._v("*凡x")]),t._v(" "),_("td",[_("code",[t._v("99")])]),t._v(" "),_("td",[t._v("加油加油")]),t._v(" "),_("td",[t._v("非常感谢哥们，一起加油 ✊")])]),t._v(" "),_("tr",[_("td",[t._v("*刚q")]),t._v(" "),_("td",[_("code",[t._v("66.66")])]),t._v(" "),_("td",[t._v("精简版终于更新到"),_("code",[t._v("5")]),t._v("版本了，来支持下")]),t._v(" "),_("td",[t._v("非常感谢哥们。"),_("code",[t._v("emm")]),t._v("，深夜还不睡觉，我怀疑你一直盯着我呢，哈哈")])]),t._v(" "),_("tr",[_("td",[t._v("*不a*")]),t._v(" "),_("td",[_("code",[t._v("66.60")])]),t._v(" "),_("td",[t._v("多谢指导")]),t._v(" "),_("td",[t._v("客气啦 😉")])]),t._v(" "),_("tr",[_("td",[t._v("*lang*")]),t._v(" "),_("td",[_("code",[t._v("30")])]),t._v(" "),_("td"),t._v(" "),_("td")]),t._v(" "),_("tr",[_("td",[t._v("*华c")]),t._v(" "),_("td",[_("code",[t._v("23")])]),t._v(" "),_("td"),t._v(" "),_("td")]),t._v(" "),_("tr",[_("td",[t._v("*蓝h")]),t._v(" "),_("td",[_("code",[t._v("20")])]),t._v(" "),_("td",[t._v("欢庆精简版同步发布")]),t._v(" "),_("td",[t._v("嘿嘿，终于发布咯")])]),t._v(" "),_("tr",[_("td",[t._v("f*dj")]),t._v(" "),_("td",[_("code",[t._v("15")])]),t._v(" "),_("td"),t._v(" "),_("td")]),t._v(" "),_("tr",[_("td",[t._v("*羽k")]),t._v(" "),_("td",[_("code",[t._v("12")])]),t._v(" "),_("td",[_("code",[t._v("ronna-admin")])]),t._v(" "),_("td",[t._v("媒体查询+视窗单位")])]),t._v(" "),_("tr",[_("td",[t._v("**明q")]),t._v(" "),_("td",[_("code",[t._v("10")])]),t._v(" "),_("td"),t._v(" "),_("td")])])]),t._v(" "),_("p",[t._v("赞助金额高达 "),_("code",[t._v("100")]),t._v(" 时，请加最上方微信，交个朋友 🤝")]),t._v(" "),_("img",{attrs:{src:t.$withBase("/img/polite.jpg"),width:"200px",height:"220px"}})])}),[],!1,null,"2fa38447",null);v.default=e.exports}}]); \ No newline at end of file diff --git a/assets/js/17.a79684d7.js b/assets/js/17.a79684d7.js new file mode 100644 index 0000000..9de2144 --- /dev/null +++ b/assets/js/17.a79684d7.js @@ -0,0 +1 @@ +(window.webpackJsonp=window.webpackJsonp||[]).push([[17],{285:function(t,e,s){},435:function(t,e,s){"use strict";s(285)},467:function(t,e,s){"use strict";s.r(e);s(435);var n=s(8),a=Object(n.a)({},(function(){var t=this,e=t.$createElement,s=t._self._c||e;return s("ContentSlotsDistributor",{attrs:{"slot-key":t.$parent.slotKey}},[s("p",{attrs:{align:"center"}},[s("a",{staticClass:"become-sponsor",attrs:{href:"/pages/1b12ed/"}},[t._v("支持这个项目")])]),t._v(" "),s("h2",{attrs:{id:"⚡-反馈与交流"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#⚡-反馈与交流"}},[t._v("#")]),t._v(" ⚡ 反馈与交流")]),t._v(" "),s("p",[t._v("在使用过程中有任何问题和想法，请给我提 "),s("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/issues",target:"_blank",rel:"noopener noreferrer"}},[t._v("Issue"),s("OutboundLink")],1),t._v("。\n你也可以在Issue查看别人提的问题和给出解决方案。")]),t._v(" "),s("p",[t._v("或者加入我们的交流群：")]),t._v(" "),s("table",[s("tbody",[s("tr",[s("td",{attrs:{align:"center",valign:"middle"}},[s("img",{staticClass:"no-zoom",staticStyle:{width:"300px",margin:"10px"},attrs:{src:t.$withBase("/img/qrcode/QQ.png"),alt:"群号: 891207826"}})])])])])])}),[],!1,null,null,null);e.default=a.exports}}]); \ No newline at end of file diff --git a/assets/js/18.3402aebc.js b/assets/js/18.3402aebc.js new file mode 100644 index 0000000..c83dcd7 --- /dev/null +++ b/assets/js/18.3402aebc.js @@ -0,0 +1 @@ +(window.webpackJsonp=window.webpackJsonp||[]).push([[18],{335:function(a,t,e){a.exports=e.p+"assets/img/nodejs.618d72d2.jpg"},440:function(a,t,e){"use strict";e.r(t);var s=e(8),r=Object(s.a)({},(function(){var a=this,t=a.$createElement,s=a._self._c||t;return s("ContentSlotsDistributor",{attrs:{"slot-key":a.$parent.slotKey}},[s("h2",{attrs:{id:"开发环境"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#开发环境"}},[a._v("#")]),a._v(" 开发环境")]),a._v(" "),s("p",[a._v("从 "),s("code",[a._v("ronna-admin v2.0.0")]),a._v(" 版本后，规定 "),s("code",[a._v("node")]),a._v(" 版本应不小于 "),s("code",[a._v("18.18.0")]),a._v(" （推荐优先安装长期维护"),s("code",[a._v("LTS")]),a._v("版，如下图），"),s("code",[a._v("pnpm")]),a._v(" 版本应不小于 "),s("code",[a._v("8.6.10")])]),a._v(" "),s("p",[s("a",{attrs:{href:"https://nodejs.org/en",target:"_blank",rel:"noopener noreferrer"}},[a._v("nodejs 官网"),s("OutboundLink")],1),a._v(" 当然也可以安装 "),s("a",{attrs:{href:"https://raw.githubusercontent.com/ronnaces/ronna-admin/main/.nvmrc",target:"_blank",rel:"noopener noreferrer"}},[a._v(".nvmrc"),s("OutboundLink")],1),a._v(" 推荐的 "),s("code",[a._v("node")]),a._v(" 版本")]),a._v(" "),s("p",[s("img",{attrs:{src:e(335),alt:"nodejs"}})]),a._v(" "),s("p",[a._v("如果您还没安装 "),s("code",[a._v("pnpm")]),a._v("，请执行下面命令进行安装（"),s("code",[a._v("mac")]),a._v(" 用户遇到安装报错请在命令前加上 "),s("code",[a._v("sudo")]),a._v("）")]),a._v(" "),s("div",{staticClass:"language- extra-class"},[s("pre",{pre:!0,attrs:{class:"language-text"}},[s("code",[a._v("npm install -g pnpm\n")])])]),s("p",[a._v("如果您需要安装多个 "),s("code",[a._v("node")]),a._v(" 版本环境，请参考 "),s("RouterLink",{attrs:{to:"/pages/FAQ/#平台要求-node-版本应不小于-18-18-0-、pnpm-版本应不小于-8-6-10-但是实际开发有的项目需要比这些低的版本怎么解决呢"}},[a._v("Node.js 版本管理工具")])],1),a._v(" "),s("p",[a._v("如果您觉得安装平台依赖慢，请参考 "),s("RouterLink",{attrs:{to:"/pages/FAQ/#安装依赖慢-如何解决"}},[a._v("npmmirror")])],1),a._v(" "),s("h2",{attrs:{id:"ide"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#ide"}},[a._v("#")]),a._v(" "),s("code",[a._v("IDE")])]),a._v(" "),s("p",[a._v("如果您使用的 "),s("code",[a._v("IDE")]),a._v(" 是 "),s("a",{attrs:{href:"https://code.visualstudio.com/",target:"_blank",rel:"noopener noreferrer"}},[a._v("vscode"),s("OutboundLink")],1),a._v(" （推荐），"),s("RouterLink",{attrs:{to:"/pages/vscode/#extensions-json"}},[a._v("请点击这里并安装推荐的插件")]),a._v("，可提高开发效率")],1),a._v(" "),s("h2",{attrs:{id:"拉取代码"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#拉取代码"}},[a._v("#")]),a._v(" 拉取代码")]),a._v(" "),s("h3",{attrs:{id:"从-github-上拉取"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#从-github-上拉取"}},[a._v("#")]),a._v(" 从 "),s("code",[a._v("GitHub")]),a._v(" 上拉取")]),a._v(" "),s("h4",{attrs:{id:"完整版前端代码"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#完整版前端代码"}},[a._v("#")]),a._v(" 完整版前端代码")]),a._v(" "),s("div",{staticClass:"language- extra-class"},[s("pre",{pre:!0,attrs:{class:"language-text"}},[s("code",[a._v("git clone https://github.com/ronnaces/ronna-admin.git\n")])])]),s("h2",{attrs:{id:"本地开发"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#本地开发"}},[a._v("#")]),a._v(" 本地开发")]),a._v(" "),s("h4",{attrs:{id:"安装依赖"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#安装依赖"}},[a._v("#")]),a._v(" 安装依赖")]),a._v(" "),s("div",{staticClass:"language- extra-class"},[s("pre",{pre:!0,attrs:{class:"language-text"}},[s("code",[a._v("pnpm install\n")])])]),s("h4",{attrs:{id:"启动平台"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#启动平台"}},[a._v("#")]),a._v(" 启动平台")]),a._v(" "),s("div",{staticClass:"language- extra-class"},[s("pre",{pre:!0,attrs:{class:"language-text"}},[s("code",[a._v("pnpm dev\n")])])]),s("h4",{attrs:{id:"项目打包"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#项目打包"}},[a._v("#")]),a._v(" 项目打包")]),a._v(" "),s("div",{staticClass:"language- extra-class"},[s("pre",{pre:!0,attrs:{class:"language-text"}},[s("code",[a._v("pnpm build\n")])])]),s("h4",{attrs:{id:"安装一个包"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#安装一个包"}},[a._v("#")]),a._v(" 安装一个包")]),a._v(" "),s("div",{staticClass:"language- extra-class"},[s("pre",{pre:!0,attrs:{class:"language-text"}},[s("code",[a._v("pnpm add 包名\n")])])]),s("h4",{attrs:{id:"卸载一个包"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#卸载一个包"}},[a._v("#")]),a._v(" 卸载一个包")]),a._v(" "),s("div",{staticClass:"language- extra-class"},[s("pre",{pre:!0,attrs:{class:"language-text"}},[s("code",[a._v("pnpm remove 包名\n")])])])])}),[],!1,null,null,null);t.default=r.exports}}]); \ No newline at end of file diff --git a/assets/js/19.ca4884db.js b/assets/js/19.ca4884db.js new file mode 100644 index 0000000..4b74131 --- /dev/null +++ b/assets/js/19.ca4884db.js @@ -0,0 +1 @@ +(window.webpackJsonp=window.webpackJsonp||[]).push([[19],{363:function(t,s,a){t.exports=a.p+"assets/img/type.bd4e388d.jpg"},446:function(t,s,a){"use strict";a.r(s);var n=a(8),r=Object(n.a)({},(function(){var t=this,s=t.$createElement,n=t._self._c||s;return n("ContentSlotsDistributor",{attrs:{"slot-key":t.$parent.slotKey}},[n("h2",{attrs:{id:"mock"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#mock"}},[t._v("#")]),t._v(" Mock")]),t._v(" "),n("p",[t._v("平台使用 "),n("a",{attrs:{href:"https://github.com/condorheroblog/vite-plugin-fake-server",target:"_blank",rel:"noopener noreferrer"}},[t._v("vite-plugin-fake-server"),n("OutboundLink")],1),t._v(" 插件并集成了 "),n("a",{attrs:{href:"https://www.npmjs.com/package/@faker-js/faker",target:"_blank",rel:"noopener noreferrer"}},[t._v("@faker-js/faker"),n("OutboundLink")],1),t._v("，支持常用的 "),n("code",[t._v("post")]),t._v("、"),n("code",[t._v("get")]),t._v(" 请求方式，仅用于本地开发，生产环境请务必删除 "),n("code",[t._v("mock")])]),t._v(" "),n("h3",{attrs:{id:"基础用法"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#基础用法"}},[t._v("#")]),t._v(" 基础用法")]),t._v(" "),n("p",[t._v("① 来到 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/tree/main/mock",target:"_blank",rel:"noopener noreferrer"}},[t._v("mock"),n("OutboundLink")],1),t._v(" 文件存放目录，比如添加 "),n("code",[t._v("login")]),t._v(" 接口，采用 "),n("code",[t._v("post")]),t._v(" 请求，参考下面代码。")]),t._v(" "),n("details",{staticClass:"custom-block details"},[n("summary",[t._v("点击查看")]),t._v(" "),n("div",{staticClass:"language-ts extra-class"},[n("pre",{pre:!0,attrs:{class:"language-ts"}},[n("code",[n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" MockMethod "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"vite-plugin-mock"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("export")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("default")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("[")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n url"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"/login"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n method"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"post"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token function-variable function"}},[t._v("response")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" body "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=>")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("return")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n success"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token boolean"}},[t._v("true")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n data"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("]")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("as")]),t._v(" MockMethod"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("[")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("]")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])])]),t._v(" "),n("p",[t._v("② 上面我们添加了 "),n("code",[t._v("login")]),t._v(" 接口，接着来到 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/tree/main/src/api",target:"_blank",rel:"noopener noreferrer"}},[t._v("api"),n("OutboundLink")],1),t._v(" 目录，比如添加 "),n("code",[t._v("user.ts")]),t._v(" 文件，参考下面代码")]),t._v(" "),n("details",{staticClass:"custom-block details"},[n("summary",[t._v("点击查看")]),t._v(" "),n("div",{staticClass:"language-ts extra-class"},[n("pre",{pre:!0,attrs:{class:"language-ts"}},[n("code",[n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" http "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"@/utils/http"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 这里定义返回值类型，使接口拥有良好的类型推导")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("export")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("type")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token class-name"}},[t._v("UserResult")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("/** 是否请求成功 */")]),t._v("\n success"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token builtin"}},[t._v("boolean")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n data"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("/** 用户名 */")]),t._v("\n username"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token builtin"}},[t._v("string")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("/** 当前登陆用户的角色 */")]),t._v("\n roles"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token builtin"}},[t._v("Array")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("<")]),n("span",{pre:!0,attrs:{class:"token builtin"}},[t._v("string")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(">")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("/** `token` */")]),t._v("\n accessToken"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token builtin"}},[t._v("string")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("/** 用于调用刷新`accessToken`的接口时所需的`token` */")]),t._v("\n refreshToken"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token builtin"}},[t._v("string")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("/** `accessToken`的过期时间（格式'xxxx/xx/xx xx:xx:xx'） */")]),t._v("\n expires"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" Date"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("/** 登录接口 */")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("export")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function-variable function"}},[t._v("getLogin")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("data"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("?")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" object"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=>")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("return")]),t._v(" http"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),n("span",{pre:!0,attrs:{class:"token generic-function"}},[n("span",{pre:!0,attrs:{class:"token function"}},[t._v("request")]),n("span",{pre:!0,attrs:{class:"token generic class-name"}},[n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("<")]),t._v("UserResult"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(">")])])]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"post"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"/login"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" data "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])])]),t._v(" "),n("p",[t._v("③ 上面导出了 "),n("code",[t._v("getLogin")]),t._v(" 接口，接下来我们来到需要使用这个接口的地方导入，参考下面代码")]),t._v(" "),n("details",{staticClass:"custom-block details"},[n("summary",[t._v("点击查看")]),t._v(" "),n("div",{staticClass:"language-ts extra-class"},[n("pre",{pre:!0,attrs:{class:"language-ts"}},[n("code",[n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("<")]),t._v("script setup lang"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"ts"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(">")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" getLogin "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"@/api/user"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("async")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("function")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("onLogin")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("let")]),t._v(" result "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("await")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("getLogin")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" username"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"admin"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" password"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"admin123"')]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("if")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("result"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),t._v("success"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token builtin"}},[t._v("console")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("log")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("result"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),t._v("data"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("<")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("/")]),t._v("script"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(">")]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("<")]),t._v("template"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(">")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("<")]),t._v("el"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("-")]),t._v("button "),n("span",{pre:!0,attrs:{class:"token decorator"}},[n("span",{pre:!0,attrs:{class:"token at operator"}},[t._v("@")]),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("click")])]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"onLogin"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(">")]),t._v("点击登录"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("<")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("/")]),t._v("el"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("-")]),t._v("button"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(">")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("<")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("/")]),t._v("template"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(">")]),t._v("\n")])])])]),t._v(" "),n("p",[t._v("您可以注意到我们在上面 "),n("code",[t._v("②")]),t._v(" 步骤中定义了接口返回值类型 "),n("code",[t._v("UserResult")]),t._v("，在使用时就会获得良好的类型推导，如下图")]),t._v(" "),n("p",[n("img",{attrs:{src:a(363),alt:"type"}})]),t._v(" "),n("h3",{attrs:{id:"如何快速删除-mock"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#如何快速删除-mock"}},[t._v("#")]),t._v(" 如何快速删除 "),n("code",[t._v("mock")])]),t._v(" "),n("p",[t._v("来到 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/build/plugins.ts#L6",target:"_blank",rel:"noopener noreferrer"}},[t._v("build/plugins.ts"),n("OutboundLink")],1),t._v(" 文件，将 "),n("code",[t._v('import { viteMockServe } from "vite-plugin-mock";')]),t._v(" 注释，最后把 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/build/plugins.ts#L43-52",target:"_blank",rel:"noopener noreferrer"}},[t._v("这里选中"),n("OutboundLink")],1),t._v(" 的都注释即可")]),t._v(" "),n("h2",{attrs:{id:"axios"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#axios"}},[t._v("#")]),t._v(" Axios")]),t._v(" "),n("h4",{attrs:{id:"中文文档"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#中文文档"}},[t._v("#")]),t._v(" 中文文档")]),t._v(" "),n("p",[n("a",{attrs:{href:"https://www.axios-http.cn/",target:"_blank",rel:"noopener noreferrer"}},[t._v("点击查看中文文档"),n("OutboundLink")],1)]),t._v(" "),n("h4",{attrs:{id:"基本请求方式"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#基本请求方式"}},[t._v("#")]),t._v(" 基本请求方式")]),t._v(" "),n("p",[t._v("平台封装了 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/tree/main/src/utils/http",target:"_blank",rel:"noopener noreferrer"}},[t._v("axios"),n("OutboundLink")],1),t._v("，支持的请求方式请看 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/utils/http/types.d.ts#L14",target:"_blank",rel:"noopener noreferrer"}},[t._v("具体参考"),n("OutboundLink")],1),t._v("，下面举例常用的四种请求方式")]),t._v(" "),n("h5",{attrs:{id:"get-请求"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#get-请求"}},[t._v("#")]),t._v(" "),n("code",[t._v("get")]),t._v(" 请求")]),t._v(" "),n("details",{staticClass:"custom-block details"},[n("summary",[t._v("点击查看")]),t._v(" "),n("div",{staticClass:"language-ts extra-class"},[n("pre",{pre:!0,attrs:{class:"language-ts"}},[n("code",[n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" http "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"@/utils/http"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// params传参")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("export")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function-variable function"}},[t._v("textRequest")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("params"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("?")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" object"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=>")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("return")]),t._v(" http"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("request")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"get"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"/xxx"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" params "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// url拼接传参")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("export")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function-variable function"}},[t._v("textRequest")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("params"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("?")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" object"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=>")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("return")]),t._v(" http"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("request")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"get"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"/xxx?message="')]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("+")]),t._v(" params"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])])]),t._v(" "),n("h5",{attrs:{id:"post-请求"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#post-请求"}},[t._v("#")]),t._v(" "),n("code",[t._v("post")]),t._v(" 请求")]),t._v(" "),n("details",{staticClass:"custom-block details"},[n("summary",[t._v("点击查看")]),t._v(" "),n("div",{staticClass:"language-ts extra-class"},[n("pre",{pre:!0,attrs:{class:"language-ts"}},[n("code",[n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" http "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"@/utils/http"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// params传参")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("export")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function-variable function"}},[t._v("textRequest")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("params"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("?")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" object"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=>")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("return")]),t._v(" http"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("request")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"post"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"/xxx"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" params "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// data传参")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("export")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function-variable function"}},[t._v("textRequest")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("data"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("?")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" object"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=>")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("return")]),t._v(" http"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("request")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"post"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"/xxx"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" data "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])])]),t._v(" "),n("h5",{attrs:{id:"delete-请求"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#delete-请求"}},[t._v("#")]),t._v(" "),n("code",[t._v("delete")]),t._v(" 请求")]),t._v(" "),n("details",{staticClass:"custom-block details"},[n("summary",[t._v("点击查看")]),t._v(" "),n("div",{staticClass:"language-ts extra-class"},[n("pre",{pre:!0,attrs:{class:"language-ts"}},[n("code",[n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" http "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"@/utils/http"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// params传参")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("export")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function-variable function"}},[t._v("textRequest")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("params"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("?")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" object"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=>")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("return")]),t._v(" http"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("request")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"delete"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"/xxx"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" params "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// data传参")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("export")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function-variable function"}},[t._v("textRequest")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("data"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("?")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" object"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=>")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("return")]),t._v(" http"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("request")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"delete"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"/xxx"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" data "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])])]),t._v(" "),n("h5",{attrs:{id:"put-请求"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#put-请求"}},[t._v("#")]),t._v(" "),n("code",[t._v("put")]),t._v(" 请求")]),t._v(" "),n("details",{staticClass:"custom-block details"},[n("summary",[t._v("点击查看")]),t._v(" "),n("div",{staticClass:"language-ts extra-class"},[n("pre",{pre:!0,attrs:{class:"language-ts"}},[n("code",[n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" http "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"@/utils/http"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// params传参")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("export")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function-variable function"}},[t._v("textRequest")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("params"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("?")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" object"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=>")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("return")]),t._v(" http"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("request")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"put"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"/xxx"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" params "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// data传参")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("export")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function-variable function"}},[t._v("textRequest")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("data"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("?")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" object"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=>")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("return")]),t._v(" http"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("request")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"put"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"/xxx"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" data "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])])]),t._v(" "),n("h5",{attrs:{id:"http-request-传参解析"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#http-request-传参解析"}},[t._v("#")]),t._v(" "),n("code",[t._v("http.request")]),t._v(" 传参解析")]),t._v(" "),n("p",[n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/utils/http/index.ts#L149",target:"_blank",rel:"noopener noreferrer"}},[t._v("http.request 源码"),n("OutboundLink")],1),t._v("，参数解析如下")]),t._v(" "),n("table",[n("thead",[n("tr",[n("th",[n("strong",[t._v("参数属性")])]),t._v(" "),n("th",[n("strong",[t._v("说明")])]),t._v(" "),n("th",[n("strong",[t._v("类型")])])])]),t._v(" "),n("tbody",[n("tr",[n("td",[n("code",[t._v("method")])]),t._v(" "),n("td",[t._v("请求方式")]),t._v(" "),n("td",[n("code",[t._v("RequestMethods")])])]),t._v(" "),n("tr",[n("td",[n("code",[t._v("url")])]),t._v(" "),n("td",[t._v("请求地址")]),t._v(" "),n("td",[n("code",[t._v("string")])])]),t._v(" "),n("tr",[n("td",[n("code",[t._v("param")])]),t._v(" "),n("td",[t._v("请求参数")]),t._v(" "),n("td",[n("code",[t._v("AxiosRequestConfig")])])]),t._v(" "),n("tr",[n("td",[n("code",[t._v("axiosConfig")])]),t._v(" "),n("td",[t._v("自定义"),n("code",[t._v("axios")]),t._v("配置")]),t._v(" "),n("td",[n("code",[t._v("PureHttpRequestConfig")])])])])]),t._v(" "),n("div",{staticClass:"custom-block tip"},[n("p",{staticClass:"custom-block-title"},[t._v("提示")]),t._v(" "),n("p",[t._v("当然平台不仅提供了 "),n("code",[t._v("http.request")]),t._v(" 方法让您发送请求，还提供两种额外的请求方式 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/utils/http/index.ts#L176",target:"_blank",rel:"noopener noreferrer"}},[t._v("http.post"),n("OutboundLink")],1),t._v("、"),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/utils/http/index.ts#L185",target:"_blank",rel:"noopener noreferrer"}},[t._v("http.get"),n("OutboundLink")],1),t._v("，当然这两种也是基于 "),n("code",[t._v("http.request")]),t._v(" 封装的，也会走请求拦截和响应拦截，如果您需要脱离平台封装的请求，可以直接使用 "),n("code",[t._v("axios")]),t._v("，类似参考 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/views/welcome/index.vue#L66",target:"_blank",rel:"noopener noreferrer"}},[t._v("src/views/welcome/index.vue"),n("OutboundLink")],1)])]),t._v(" "),n("h4",{attrs:{id:"如何与后台联调"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#如何与后台联调"}},[t._v("#")]),t._v(" 如何与后台联调")]),t._v(" "),n("h5",{attrs:{id:"跨域与解决办法"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#跨域与解决办法"}},[t._v("#")]),t._v(" 跨域与解决办法")]),t._v(" "),n("h6",{attrs:{id:"什么是跨域"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#什么是跨域"}},[t._v("#")]),t._v(" 什么是跨域")]),t._v(" "),n("p",[t._v("跨域本质是浏览器基于同源策略的一种安全手段。同源策略（Sameoriginpolicy），是一种约定，它是浏览器最核心也最基本的安全功能。当协议（protocol）、主机（host）、端口（port）其中一项不相同的时候就会产生跨域。跨域只产生在浏览器，这也是为什么您用 "),n("code",[t._v("postman")]),t._v(" 请求接口时不会有跨域问题的原因")]),t._v(" "),n("h6",{attrs:{id:"解决办法"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#解决办法"}},[t._v("#")]),t._v(" 解决办法")]),t._v(" "),n("p",[t._v("① 本地开发的话，我们来到 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/vite.config.ts#L46",target:"_blank",rel:"noopener noreferrer"}},[t._v("vite.config.ts"),n("OutboundLink")],1),t._v("，参考下面代码配置本地跨域代理即可")]),t._v(" "),n("div",{staticClass:"language-ts extra-class"},[n("pre",{pre:!0,attrs:{class:"language-ts"}},[n("code",[t._v("proxy"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token string-property property"}},[t._v('"/api"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 这里填写后端地址")]),t._v("\n target"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"http://127.0.0.1:3000"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n changeOrigin"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token boolean"}},[t._v("true")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token function-variable function"}},[t._v("rewrite")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" path "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=>")]),t._v(" path"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("replace")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token regex"}},[n("span",{pre:!0,attrs:{class:"token regex-delimiter"}},[t._v("/")]),n("span",{pre:!0,attrs:{class:"token regex-source language-regex"}},[t._v("^\\/api")]),n("span",{pre:!0,attrs:{class:"token regex-delimiter"}},[t._v("/")])]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('""')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v("\n")])])]),n("p",[t._v("② 配置好上面的跨域代理后，来到 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/tree/main/src/api",target:"_blank",rel:"noopener noreferrer"}},[t._v("src/api"),n("OutboundLink")],1),t._v(" 目录，这里我们先新建一个 "),n("code",[t._v("utils.ts")]),t._v(" 文件用来配置环境，参考下面代码")]),t._v(" "),n("p",[t._v("注意：这里又分两种写法")]),t._v(" "),n("p",[t._v("第一种（也是最常用的一种，满足大多数场景，首选这种写法哦）：比如后端使用 "),n("code",[t._v("spring cloud")]),t._v(" 微服务架构，不同服务可能会部署在不同机器上，这时候前端必定产生跨域，推荐部署前端项目首选 "),n("a",{attrs:{href:"https://www.nginx.com/resources/wiki/",target:"_blank",rel:"noopener noreferrer"}},[t._v("nginx"),n("OutboundLink")],1),t._v("，可以利用 "),n("code",[t._v("nginx")]),t._v(" 的代理转发功能来解决跨域问题")]),t._v(" "),n("p",[t._v("utils.ts")]),t._v(" "),n("div",{staticClass:"language-ts extra-class"},[n("pre",{pre:!0,attrs:{class:"language-ts"}},[n("code",[n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("export")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function-variable function"}},[t._v("baseUrlApi")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("url"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token builtin"}},[t._v("string")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=>")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token template-string"}},[n("span",{pre:!0,attrs:{class:"token template-punctuation string"}},[t._v("`")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v("/api/")]),n("span",{pre:!0,attrs:{class:"token interpolation"}},[n("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[t._v("${")]),t._v("url"),n("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[t._v("}")])]),n("span",{pre:!0,attrs:{class:"token template-punctuation string"}},[t._v("`")])]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])]),n("p",[t._v("第二种：前端打包直接丢给后端，放到后端项目里一起部署，协议、主机、端口都相同了，就没有跨域问题")]),t._v(" "),n("p",[t._v("utils.ts")]),t._v(" "),n("div",{staticClass:"language-ts extra-class"},[n("pre",{pre:!0,attrs:{class:"language-ts"}},[n("code",[n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("export")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function-variable function"}},[t._v("baseUrlApi")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("url"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token builtin"}},[t._v("string")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=>")]),t._v("\n process"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),t._v("env"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),n("span",{pre:!0,attrs:{class:"token constant"}},[t._v("NODE_ENV")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("===")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"development"')]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("?")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token template-string"}},[n("span",{pre:!0,attrs:{class:"token template-punctuation string"}},[t._v("`")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v("/api/")]),n("span",{pre:!0,attrs:{class:"token interpolation"}},[n("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[t._v("${")]),t._v("url"),n("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[t._v("}")])]),n("span",{pre:!0,attrs:{class:"token template-punctuation string"}},[t._v("`")])]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token template-string"}},[n("span",{pre:!0,attrs:{class:"token template-punctuation string"}},[t._v("`")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v("http://127.0.0.1:3000/")]),n("span",{pre:!0,attrs:{class:"token interpolation"}},[n("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[t._v("${")]),t._v("url"),n("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[t._v("}")])]),n("span",{pre:!0,attrs:{class:"token template-punctuation string"}},[t._v("`")])]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])]),n("p",[t._v("③ 写完上面的 "),n("code",[t._v("utils.ts")]),t._v(" 后，继续在 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/tree/main/src/api",target:"_blank",rel:"noopener noreferrer"}},[t._v("src/api"),n("OutboundLink")],1),t._v(" 目录，我们再建一个 "),n("code",[t._v("user.ts")]),t._v(" 文件，导出这个接口，供页面调用，参考下面代码")]),t._v(" "),n("p",[t._v("user.ts")]),t._v(" "),n("div",{staticClass:"language-ts extra-class"},[n("pre",{pre:!0,attrs:{class:"language-ts"}},[n("code",[n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" http "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"@/utils/http"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" baseUrlApi "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"./utils"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("/** 登录 */")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("export")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function-variable function"}},[t._v("getLogin")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("data"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("?")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" object"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=>")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("return")]),t._v(" http"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),n("span",{pre:!0,attrs:{class:"token generic-function"}},[n("span",{pre:!0,attrs:{class:"token function"}},[t._v("request")]),n("span",{pre:!0,attrs:{class:"token generic class-name"}},[n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("<")]),n("span",{pre:!0,attrs:{class:"token builtin"}},[t._v("any")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(">")])])]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"post"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("baseUrlApi")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"login"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" data "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])]),n("p",[t._v("④ 上面都完成后，我们在需要调用该接口的地方调用即可，参考 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/store/modules/user.ts#L33",target:"_blank",rel:"noopener noreferrer"}},[t._v("src/store/modules/user.ts"),n("OutboundLink")],1)]),t._v(" "),n("h5",{attrs:{id:"多个后端地址如何联调"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#多个后端地址如何联调"}},[t._v("#")]),t._v(" 多个后端地址如何联调")]),t._v(" "),n("p",[t._v("大致步骤和上面差不多，这里我们就简单写一下，具体对比上面的就行")]),t._v(" "),n("p",[t._v("① 在 "),n("code",[t._v("vite.config.ts")]),t._v(" 写入下面代码")]),t._v(" "),n("div",{staticClass:"language-ts extra-class"},[n("pre",{pre:!0,attrs:{class:"language-ts"}},[n("code",[t._v("proxy"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 第一个代理后端地址")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token string-property property"}},[t._v('"/api"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n target"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"http://127.0.0.1:3000"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n changeOrigin"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token boolean"}},[t._v("true")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token function-variable function"}},[t._v("rewrite")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" path "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=>")]),t._v(" path"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("replace")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token regex"}},[n("span",{pre:!0,attrs:{class:"token regex-delimiter"}},[t._v("/")]),n("span",{pre:!0,attrs:{class:"token regex-source language-regex"}},[t._v("^\\/api")]),n("span",{pre:!0,attrs:{class:"token regex-delimiter"}},[t._v("/")])]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('""')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 第二个代理后端地址")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token string-property property"}},[t._v('"/otherApi"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n target"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"http://127.0.0.1:3290"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n changeOrigin"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token boolean"}},[t._v("true")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token function-variable function"}},[t._v("rewrite")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" path "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=>")]),t._v(" path"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("replace")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token regex"}},[n("span",{pre:!0,attrs:{class:"token regex-delimiter"}},[t._v("/")]),n("span",{pre:!0,attrs:{class:"token regex-source language-regex"}},[t._v("^\\/otherApi")]),n("span",{pre:!0,attrs:{class:"token regex-delimiter"}},[t._v("/")])]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('""')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// websocket地址（知识点：wss只能在https安全协议下使用）")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v('// "/wsApi": {')]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v('// target: "ws://localhost:3000",')]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// ws: true,")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// },")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// ...依此类推，有几个后端地址就写几个后端地址")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v("\n")])])]),n("p",[t._v("② 在 "),n("code",[t._v("utils.ts")]),t._v(" 里我们采用第一种写法，参考下面代码")]),t._v(" "),n("p",[t._v("utils.ts")]),t._v(" "),n("div",{staticClass:"language-ts extra-class"},[n("pre",{pre:!0,attrs:{class:"language-ts"}},[n("code",[n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 第一个代理后端地址")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("export")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function-variable function"}},[t._v("baseUrlApi")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("url"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token builtin"}},[t._v("string")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=>")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token template-string"}},[n("span",{pre:!0,attrs:{class:"token template-punctuation string"}},[t._v("`")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v("/api/")]),n("span",{pre:!0,attrs:{class:"token interpolation"}},[n("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[t._v("${")]),t._v("url"),n("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[t._v("}")])]),n("span",{pre:!0,attrs:{class:"token template-punctuation string"}},[t._v("`")])]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 第二个代理后端地址")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("export")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function-variable function"}},[t._v("baseUrlOtherApi")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("url"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token builtin"}},[t._v("string")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=>")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token template-string"}},[n("span",{pre:!0,attrs:{class:"token template-punctuation string"}},[t._v("`")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v("/otherApi/")]),n("span",{pre:!0,attrs:{class:"token interpolation"}},[n("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[t._v("${")]),t._v("url"),n("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[t._v("}")])]),n("span",{pre:!0,attrs:{class:"token template-punctuation string"}},[t._v("`")])]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])]),n("p",[t._v("③ 第一个代理后端地址上面建的是 "),n("code",[t._v("user.ts")]),t._v(" 文件，那么第二个代理后端地址我们就建个 "),n("code",[t._v("other.ts")]),t._v(" 文件吧，参考下面代码")]),t._v(" "),n("p",[t._v("other.ts")]),t._v(" "),n("div",{staticClass:"language-ts extra-class"},[n("pre",{pre:!0,attrs:{class:"language-ts"}},[n("code",[n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" http "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"@/utils/http"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" baseUrlOtherApi "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"./utils"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("/** 该接口采用 http://127.0.0.1:3290 后端地址 */")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("export")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function-variable function"}},[t._v("getOther")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("data"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("?")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" object"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=>")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("return")]),t._v(" http"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),n("span",{pre:!0,attrs:{class:"token generic-function"}},[n("span",{pre:!0,attrs:{class:"token function"}},[t._v("request")]),n("span",{pre:!0,attrs:{class:"token generic class-name"}},[n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("<")]),n("span",{pre:!0,attrs:{class:"token builtin"}},[t._v("any")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(">")])])]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"get"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("baseUrlOtherApi")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"other"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" data "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])]),n("p",[t._v("最后，需要在哪里调用，引入使用即可")]),t._v(" "),n("h4",{attrs:{id:"如何声明接口返回值类型"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#如何声明接口返回值类型"}},[t._v("#")]),t._v(" 如何声明接口返回值类型")]),t._v(" "),n("p",[t._v("可以看到上面的写法 "),n("code",[t._v("http.request")]),t._v(" 后面跟的都是 "),n("code",[t._v("any")]),t._v("，这很不友好，参考下面友好类型写法即可")]),t._v(" "),n("div",{staticClass:"language-ts extra-class"},[n("pre",{pre:!0,attrs:{class:"language-ts"}},[n("code",[n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" http "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"@/utils/http"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" baseUrlApi "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"./utils"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 定义 login 接口返回值类型为 UserResult")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("export")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("type")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token class-name"}},[t._v("UserResult")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("/** 是否请求成功 */")]),t._v("\n success"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token builtin"}},[t._v("boolean")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n data"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("/** 用户名 */")]),t._v("\n username"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token builtin"}},[t._v("string")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("/** 当前登陆用户的角色 */")]),t._v("\n roles"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token builtin"}},[t._v("Array")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("<")]),n("span",{pre:!0,attrs:{class:"token builtin"}},[t._v("string")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(">")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("/** `token` */")]),t._v("\n accessToken"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token builtin"}},[t._v("string")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("/** 用于调用刷新`accessToken`的接口时所需的`token` */")]),t._v("\n refreshToken"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token builtin"}},[t._v("string")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("/** `accessToken`的过期时间（格式'xxxx/xx/xx xx:xx:xx'） */")]),t._v("\n expires"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" Date"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("/** 登录 */")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("export")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function-variable function"}},[t._v("getLogin")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("data"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("?")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" object"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=>")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("return")]),t._v(" http"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),n("span",{pre:!0,attrs:{class:"token generic-function"}},[n("span",{pre:!0,attrs:{class:"token function"}},[t._v("request")]),n("span",{pre:!0,attrs:{class:"token generic class-name"}},[n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("<")]),t._v("UserResult"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(">")])])]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"post"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("baseUrlApi")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"login"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" data "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])]),n("h4",{attrs:{id:"平台封装的请求可以设置额外的-axios-配置吗"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#平台封装的请求可以设置额外的-axios-配置吗"}},[t._v("#")]),t._v(" 平台封装的请求可以设置额外的 axios 配置吗")]),t._v(" "),n("p",[t._v("当然可以。"),n("a",{attrs:{href:"#http-request-%E4%BC%A0%E5%8F%82%E8%A7%A3%E6%9E%90"}},[t._v("点击查看这里")]),t._v("，可以看到自定义 "),n("code",[t._v("axios")]),t._v(" 配置中 "),n("code",[t._v("axiosConfig")]),t._v(" 作为最后一个参数")]),t._v(" "),n("div",{staticClass:"language-ts extra-class"},[n("pre",{pre:!0,attrs:{class:"language-ts"}},[n("code",[n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" http "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"@/utils/http"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("import")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" baseUrlApi "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("from")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"./utils"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n\n"),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("export")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token function-variable function"}},[t._v("testRequest")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("data"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("?")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" object"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=>")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("return")]),t._v(" http"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),n("span",{pre:!0,attrs:{class:"token generic-function"}},[n("span",{pre:!0,attrs:{class:"token function"}},[t._v("request")]),n("span",{pre:!0,attrs:{class:"token generic class-name"}},[n("span",{pre:!0,attrs:{class:"token operator"}},[t._v("<")]),n("span",{pre:!0,attrs:{class:"token builtin"}},[t._v("any")]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(">")])])]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"post"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token function"}},[t._v("baseUrlApi")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"login"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" data "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// 自定义的axios配置在下面对象填写即可")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n headers"),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token string-property property"}},[t._v('"Content-Type"')]),n("span",{pre:!0,attrs:{class:"token operator"}},[t._v(":")]),t._v(" "),n("span",{pre:!0,attrs:{class:"token string"}},[t._v('"application/x-www-form-urlencoded"')]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v("\n "),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),n("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])]),n("h4",{attrs:{id:"jwt-token-内置无感刷新-token-解决方案"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#jwt-token-内置无感刷新-token-解决方案"}},[t._v("#")]),t._v(" "),n("code",[t._v("JWT Token")]),t._v("（内置无感刷新 "),n("code",[t._v("token")]),t._v(" 解决方案）")]),t._v(" "),n("p",[t._v("实现原理：后端返回两个 "),n("code",[t._v("token")]),t._v("（一个用来请求，一个用来刷新）和过期时间，前端将其进行本地存储，每当接口请求时，把本地存储的过期时间与本地当前时间对比，如果 "),n("code",[t._v("token")]),t._v(" 过期就把当前请求暂存，然后去请求刷新 "),n("code",[t._v("token")]),t._v(" 接口，获取到新 "),n("code",[t._v("token")]),t._v(" 后，再 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/utils/http/index.ts#L51",target:"_blank",rel:"noopener noreferrer"}},[t._v("触发"),n("OutboundLink")],1),t._v(" 暂存的请求")]),t._v(" "),n("h5",{attrs:{id:"信息存储"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#信息存储"}},[t._v("#")]),t._v(" 信息存储")]),t._v(" "),n("p",[t._v("具体看 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/utils/auth.ts",target:"_blank",rel:"noopener noreferrer"}},[t._v("src/utils/auth"),n("OutboundLink")],1),t._v(" 文件，里面有很详细的备注")]),t._v(" "),n("h5",{attrs:{id:"细节处理"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#细节处理"}},[t._v("#")]),t._v(" 细节处理")]),t._v(" "),n("p",[t._v("① 不需要携带 "),n("code",[t._v("token")]),t._v(" 的接口我们设置了 "),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/utils/http/index.ts#L76",target:"_blank",rel:"noopener noreferrer"}},[t._v("请求白名单"),n("OutboundLink")],1)]),t._v(" "),n("p",[t._v("② 当 "),n("code",[t._v("token")]),t._v(" 过期后，平台会暂存请求，直到拿到新 "),n("code",[t._v("token")]),t._v(" 才会请求，避免了当页面有多个请求会重复刷新 "),n("code",[t._v("token")]),t._v(" 的问题。核心代码有三处："),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/utils/http/index.ts#L51",target:"_blank",rel:"noopener noreferrer"}},[t._v("一"),n("OutboundLink")],1),t._v("、"),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/utils/http/index.ts#L93",target:"_blank",rel:"noopener noreferrer"}},[t._v("二"),n("OutboundLink")],1),t._v("、"),n("a",{attrs:{href:"https://github.com/ronnaces/ronna-admin/blob/main/src/utils/http/index.ts#L100",target:"_blank",rel:"noopener noreferrer"}},[t._v("三"),n("OutboundLink")],1)]),t._v(" "),n("div",{staticClass:"custom-block tip"},[n("p",{staticClass:"custom-block-title"},[t._v("生产环境 Mock 可以和真实接口共存吗？")]),t._v(" "),n("p",[t._v("当然可以共存，不过可能会遇到 "),n("code",[t._v("Mock")]),t._v(" 干扰真实接口的问题。如果您在开发环境接口没问题，但是到生产环境出问题了，在排除后端问题前提下可以尝试 "),n("a",{attrs:{href:"#%E5%A6%82%E4%BD%95%E5%BF%AB%E9%80%9F%E5%88%A0%E9%99%A4-mock"}},[t._v("删除 Mock")])])])])}),[],!1,null,null,null);s.default=r.exports}}]); \ No newline at end of file diff --git a/assets/js/2.6e3f0335.js b/assets/js/2.6e3f0335.js new file mode 100644 index 0000000..09bbdf6 --- /dev/null +++ b/assets/js/2.6e3f0335.js @@ -0,0 +1,14 @@ +(window.webpackJsonp=window.webpackJsonp||[]).push([[2],{251:function(t,e,n){},252:function(t,e,n){},253:function(t,e,n){},254:function(t,e,n){},255:function(t,e,n){},256:function(t,e,n){},257:function(t,e,n){},258:function(t,e,n){},259:function(t,e,n){"use strict";var r=TypeError;t.exports=function(t,e){if(t + * Copyright OpenJS Foundation and other contributors + * Released under MIT license + * Based on Underscore.js 1.8.3 + * Copyright Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors + */(function(){var i="Expected a function",o="__lodash_placeholder__",s=[["ary",128],["bind",1],["bindKey",2],["curry",8],["curryRight",16],["flip",512],["partial",32],["partialRight",64],["rearg",256]],a="[object Arguments]",u="[object Array]",l="[object Boolean]",c="[object Date]",h="[object Error]",f="[object Function]",p="[object GeneratorFunction]",d="[object Map]",g="[object Number]",v="[object Object]",m="[object RegExp]",y="[object Set]",_="[object String]",b="[object Symbol]",w="[object WeakMap]",k="[object ArrayBuffer]",x="[object DataView]",P="[object Float32Array]",C="[object Float64Array]",T="[object Int8Array]",S="[object Int16Array]",L="[object Int32Array]",A="[object Uint8Array]",E="[object Uint16Array]",B="[object Uint32Array]",O=/\b__p \+= '';/g,M=/\b(__p \+=) '' \+/g,I=/(__e\(.*?\)|\b__t\)) \+\n'';/g,D=/&(?:amp|lt|gt|quot|#39);/g,$=/[&<>"']/g,j=RegExp(D.source),Y=RegExp($.source),X=/<%-([\s\S]+?)%>/g,N=/<%([\s\S]+?)%>/g,z=/<%=([\s\S]+?)%>/g,R=/\.|\[(?:[^[\]]*|(["'])(?:(?!\1)[^\\]|\\.)*?\1)\]/,U=/^\w*$/,H=/[^.[\]]+|\[(?:(-?\d+(?:\.\d+)?)|(["'])((?:(?!\2)[^\\]|\\.)*?)\2)\]|(?=(?:\.|\[\])(?:\.|\[\]|$))/g,F=/[\\^$.*+?()[\]{}|]/g,W=RegExp(F.source),q=/^\s+/,G=/\s/,K=/\{(?:\n\/\* \[wrapped with .+\] \*\/)?\n?/,Q=/\{\n\/\* \[wrapped with (.+)\] \*/,J=/,? & /,Z=/[^\x00-\x2f\x3a-\x40\x5b-\x60\x7b-\x7f]+/g,V=/[()=,{}\[\]\/\s]/,tt=/\\(\\)?/g,et=/\$\{([^\\}]*(?:\\.[^\\}]*)*)\}/g,nt=/\w*$/,rt=/^[-+]0x[0-9a-f]+$/i,it=/^0b[01]+$/i,ot=/^\[object .+?Constructor\]$/,st=/^0o[0-7]+$/i,at=/^(?:0|[1-9]\d*)$/,ut=/[\xc0-\xd6\xd8-\xf6\xf8-\xff\u0100-\u017f]/g,lt=/($^)/,ct=/['\n\r\u2028\u2029\\]/g,ht="\\u0300-\\u036f\\ufe20-\\ufe2f\\u20d0-\\u20ff",ft="\\xac\\xb1\\xd7\\xf7\\x00-\\x2f\\x3a-\\x40\\x5b-\\x60\\x7b-\\xbf\\u2000-\\u206f \\t\\x0b\\f\\xa0\\ufeff\\n\\r\\u2028\\u2029\\u1680\\u180e\\u2000\\u2001\\u2002\\u2003\\u2004\\u2005\\u2006\\u2007\\u2008\\u2009\\u200a\\u202f\\u205f\\u3000",pt="[\\ud800-\\udfff]",dt="["+ft+"]",gt="["+ht+"]",vt="\\d+",mt="[\\u2700-\\u27bf]",yt="[a-z\\xdf-\\xf6\\xf8-\\xff]",_t="[^\\ud800-\\udfff"+ft+vt+"\\u2700-\\u27bfa-z\\xdf-\\xf6\\xf8-\\xffA-Z\\xc0-\\xd6\\xd8-\\xde]",bt="\\ud83c[\\udffb-\\udfff]",wt="[^\\ud800-\\udfff]",kt="(?:\\ud83c[\\udde6-\\uddff]){2}",xt="[\\ud800-\\udbff][\\udc00-\\udfff]",Pt="[A-Z\\xc0-\\xd6\\xd8-\\xde]",Ct="(?:"+yt+"|"+_t+")",Tt="(?:"+Pt+"|"+_t+")",St="(?:"+gt+"|"+bt+")"+"?",Lt="[\\ufe0e\\ufe0f]?"+St+("(?:\\u200d(?:"+[wt,kt,xt].join("|")+")[\\ufe0e\\ufe0f]?"+St+")*"),At="(?:"+[mt,kt,xt].join("|")+")"+Lt,Et="(?:"+[wt+gt+"?",gt,kt,xt,pt].join("|")+")",Bt=RegExp("['’]","g"),Ot=RegExp(gt,"g"),Mt=RegExp(bt+"(?="+bt+")|"+Et+Lt,"g"),It=RegExp([Pt+"?"+yt+"+(?:['’](?:d|ll|m|re|s|t|ve))?(?="+[dt,Pt,"$"].join("|")+")",Tt+"+(?:['’](?:D|LL|M|RE|S|T|VE))?(?="+[dt,Pt+Ct,"$"].join("|")+")",Pt+"?"+Ct+"+(?:['’](?:d|ll|m|re|s|t|ve))?",Pt+"+(?:['’](?:D|LL|M|RE|S|T|VE))?","\\d*(?:1ST|2ND|3RD|(?![123])\\dTH)(?=\\b|[a-z_])","\\d*(?:1st|2nd|3rd|(?![123])\\dth)(?=\\b|[A-Z_])",vt,At].join("|"),"g"),Dt=RegExp("[\\u200d\\ud800-\\udfff"+ht+"\\ufe0e\\ufe0f]"),$t=/[a-z][A-Z]|[A-Z]{2}[a-z]|[0-9][a-zA-Z]|[a-zA-Z][0-9]|[^a-zA-Z0-9 ]/,jt=["Array","Buffer","DataView","Date","Error","Float32Array","Float64Array","Function","Int8Array","Int16Array","Int32Array","Map","Math","Object","Promise","RegExp","Set","String","Symbol","TypeError","Uint8Array","Uint8ClampedArray","Uint16Array","Uint32Array","WeakMap","_","clearTimeout","isFinite","parseInt","setTimeout"],Yt=-1,Xt={};Xt[P]=Xt[C]=Xt[T]=Xt[S]=Xt[L]=Xt[A]=Xt["[object Uint8ClampedArray]"]=Xt[E]=Xt[B]=!0,Xt[a]=Xt[u]=Xt[k]=Xt[l]=Xt[x]=Xt[c]=Xt[h]=Xt[f]=Xt[d]=Xt[g]=Xt[v]=Xt[m]=Xt[y]=Xt[_]=Xt[w]=!1;var Nt={};Nt[a]=Nt[u]=Nt[k]=Nt[x]=Nt[l]=Nt[c]=Nt[P]=Nt[C]=Nt[T]=Nt[S]=Nt[L]=Nt[d]=Nt[g]=Nt[v]=Nt[m]=Nt[y]=Nt[_]=Nt[b]=Nt[A]=Nt["[object Uint8ClampedArray]"]=Nt[E]=Nt[B]=!0,Nt[h]=Nt[f]=Nt[w]=!1;var zt={"\\":"\\","'":"'","\n":"n","\r":"r","\u2028":"u2028","\u2029":"u2029"},Rt=parseFloat,Ut=parseInt,Ht="object"==typeof global&&global&&global.Object===Object&&global,Ft="object"==typeof self&&self&&self.Object===Object&&self,Wt=Ht||Ft||Function("return this")(),qt=e&&!e.nodeType&&e,Gt=qt&&"object"==typeof t&&t&&!t.nodeType&&t,Kt=Gt&&Gt.exports===qt,Qt=Kt&&Ht.process,Jt=function(){try{var t=Gt&&Gt.require&&Gt.require("util").types;return t||Qt&&Qt.binding&&Qt.binding("util")}catch(t){}}(),Zt=Jt&&Jt.isArrayBuffer,Vt=Jt&&Jt.isDate,te=Jt&&Jt.isMap,ee=Jt&&Jt.isRegExp,ne=Jt&&Jt.isSet,re=Jt&&Jt.isTypedArray;function ie(t,e,n){switch(n.length){case 0:return t.call(e);case 1:return t.call(e,n[0]);case 2:return t.call(e,n[0],n[1]);case 3:return t.call(e,n[0],n[1],n[2])}return t.apply(e,n)}function oe(t,e,n,r){for(var i=-1,o=null==t?0:t.length;++i-1}function he(t,e,n){for(var r=-1,i=null==t?0:t.length;++r-1;);return n}function Ie(t,e){for(var n=t.length;n--&&be(e,t[n],0)>-1;);return n}function De(t,e){for(var n=t.length,r=0;n--;)t[n]===e&&++r;return r}var $e=Ce({"À":"A","Á":"A","Â":"A","Ã":"A","Ä":"A","Å":"A","à":"a","á":"a","â":"a","ã":"a","ä":"a","å":"a","Ç":"C","ç":"c","Ð":"D","ð":"d","È":"E","É":"E","Ê":"E","Ë":"E","è":"e","é":"e","ê":"e","ë":"e","Ì":"I","Í":"I","Î":"I","Ï":"I","ì":"i","í":"i","î":"i","ï":"i","Ñ":"N","ñ":"n","Ò":"O","Ó":"O","Ô":"O","Õ":"O","Ö":"O","Ø":"O","ò":"o","ó":"o","ô":"o","õ":"o","ö":"o","ø":"o","Ù":"U","Ú":"U","Û":"U","Ü":"U","ù":"u","ú":"u","û":"u","ü":"u","Ý":"Y","ý":"y","ÿ":"y","Æ":"Ae","æ":"ae","Þ":"Th","þ":"th","ß":"ss","Ā":"A","Ă":"A","Ą":"A","ā":"a","ă":"a","ą":"a","Ć":"C","Ĉ":"C","Ċ":"C","Č":"C","ć":"c","ĉ":"c","ċ":"c","č":"c","Ď":"D","Đ":"D","ď":"d","đ":"d","Ē":"E","Ĕ":"E","Ė":"E","Ę":"E","Ě":"E","ē":"e","ĕ":"e","ė":"e","ę":"e","ě":"e","Ĝ":"G","Ğ":"G","Ġ":"G","Ģ":"G","ĝ":"g","ğ":"g","ġ":"g","ģ":"g","Ĥ":"H","Ħ":"H","ĥ":"h","ħ":"h","Ĩ":"I","Ī":"I","Ĭ":"I","Į":"I","İ":"I","ĩ":"i","ī":"i","ĭ":"i","į":"i","ı":"i","Ĵ":"J","ĵ":"j","Ķ":"K","ķ":"k","ĸ":"k","Ĺ":"L","Ļ":"L","Ľ":"L","Ŀ":"L","Ł":"L","ĺ":"l","ļ":"l","ľ":"l","ŀ":"l","ł":"l","Ń":"N","Ņ":"N","Ň":"N","Ŋ":"N","ń":"n","ņ":"n","ň":"n","ŋ":"n","Ō":"O","Ŏ":"O","Ő":"O","ō":"o","ŏ":"o","ő":"o","Ŕ":"R","Ŗ":"R","Ř":"R","ŕ":"r","ŗ":"r","ř":"r","Ś":"S","Ŝ":"S","Ş":"S","Š":"S","ś":"s","ŝ":"s","ş":"s","š":"s","Ţ":"T","Ť":"T","Ŧ":"T","ţ":"t","ť":"t","ŧ":"t","Ũ":"U","Ū":"U","Ŭ":"U","Ů":"U","Ű":"U","Ų":"U","ũ":"u","ū":"u","ŭ":"u","ů":"u","ű":"u","ų":"u","Ŵ":"W","ŵ":"w","Ŷ":"Y","ŷ":"y","Ÿ":"Y","Ź":"Z","Ż":"Z","Ž":"Z","ź":"z","ż":"z","ž":"z","IJ":"IJ","ij":"ij","Œ":"Oe","œ":"oe","ʼn":"'n","ſ":"s"}),je=Ce({"&":"&","<":"<",">":">",'"':""","'":"'"});function Ye(t){return"\\"+zt[t]}function Xe(t){return Dt.test(t)}function Ne(t){var e=-1,n=Array(t.size);return t.forEach((function(t,r){n[++e]=[r,t]})),n}function ze(t,e){return function(n){return t(e(n))}}function Re(t,e){for(var n=-1,r=t.length,i=0,s=[];++n",""":'"',"'":"'"});var Ke=function t(e){var n,r=(e=null==e?Wt:Ke.defaults(Wt.Object(),e,Ke.pick(Wt,jt))).Array,G=e.Date,ht=e.Error,ft=e.Function,pt=e.Math,dt=e.Object,gt=e.RegExp,vt=e.String,mt=e.TypeError,yt=r.prototype,_t=ft.prototype,bt=dt.prototype,wt=e["__core-js_shared__"],kt=_t.toString,xt=bt.hasOwnProperty,Pt=0,Ct=(n=/[^.]+$/.exec(wt&&wt.keys&&wt.keys.IE_PROTO||""))?"Symbol(src)_1."+n:"",Tt=bt.toString,St=kt.call(dt),Lt=Wt._,At=gt("^"+kt.call(xt).replace(F,"\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g,"$1.*?")+"$"),Et=Kt?e.Buffer:void 0,Mt=e.Symbol,Dt=e.Uint8Array,zt=Et?Et.allocUnsafe:void 0,Ht=ze(dt.getPrototypeOf,dt),Ft=dt.create,qt=bt.propertyIsEnumerable,Gt=yt.splice,Qt=Mt?Mt.isConcatSpreadable:void 0,Jt=Mt?Mt.iterator:void 0,me=Mt?Mt.toStringTag:void 0,Ce=function(){try{var t=to(dt,"defineProperty");return t({},"",{}),t}catch(t){}}(),Qe=e.clearTimeout!==Wt.clearTimeout&&e.clearTimeout,Je=G&&G.now!==Wt.Date.now&&G.now,Ze=e.setTimeout!==Wt.setTimeout&&e.setTimeout,Ve=pt.ceil,tn=pt.floor,en=dt.getOwnPropertySymbols,nn=Et?Et.isBuffer:void 0,rn=e.isFinite,on=yt.join,sn=ze(dt.keys,dt),an=pt.max,un=pt.min,ln=G.now,cn=e.parseInt,hn=pt.random,fn=yt.reverse,pn=to(e,"DataView"),dn=to(e,"Map"),gn=to(e,"Promise"),vn=to(e,"Set"),mn=to(e,"WeakMap"),yn=to(dt,"create"),_n=mn&&new mn,bn={},wn=Lo(pn),kn=Lo(dn),xn=Lo(gn),Pn=Lo(vn),Cn=Lo(mn),Tn=Mt?Mt.prototype:void 0,Sn=Tn?Tn.valueOf:void 0,Ln=Tn?Tn.toString:void 0;function An(t){if(Fs(t)&&!Is(t)&&!(t instanceof Mn)){if(t instanceof On)return t;if(xt.call(t,"__wrapped__"))return Ao(t)}return new On(t)}var En=function(){function t(){}return function(e){if(!Hs(e))return{};if(Ft)return Ft(e);t.prototype=e;var n=new t;return t.prototype=void 0,n}}();function Bn(){}function On(t,e){this.__wrapped__=t,this.__actions__=[],this.__chain__=!!e,this.__index__=0,this.__values__=void 0}function Mn(t){this.__wrapped__=t,this.__actions__=[],this.__dir__=1,this.__filtered__=!1,this.__iteratees__=[],this.__takeCount__=4294967295,this.__views__=[]}function In(t){var e=-1,n=null==t?0:t.length;for(this.clear();++e=e?t:e)),t}function Jn(t,e,n,r,i,o){var s,u=1&e,h=2&e,w=4&e;if(n&&(s=i?n(t,r,i,o):n(t)),void 0!==s)return s;if(!Hs(t))return t;var O=Is(t);if(O){if(s=function(t){var e=t.length,n=new t.constructor(e);e&&"string"==typeof t[0]&&xt.call(t,"index")&&(n.index=t.index,n.input=t.input);return n}(t),!u)return yi(t,s)}else{var M=ro(t),I=M==f||M==p;if(Ys(t))return fi(t,u);if(M==v||M==a||I&&!i){if(s=h||I?{}:oo(t),!u)return h?function(t,e){return _i(t,no(t),e)}(t,function(t,e){return t&&_i(e,ka(e),t)}(s,t)):function(t,e){return _i(t,eo(t),e)}(t,qn(s,t))}else{if(!Nt[M])return i?t:{};s=function(t,e,n){var r=t.constructor;switch(e){case k:return pi(t);case l:case c:return new r(+t);case x:return function(t,e){var n=e?pi(t.buffer):t.buffer;return new t.constructor(n,t.byteOffset,t.byteLength)}(t,n);case P:case C:case T:case S:case L:case A:case"[object Uint8ClampedArray]":case E:case B:return di(t,n);case d:return new r;case g:case _:return new r(t);case m:return function(t){var e=new t.constructor(t.source,nt.exec(t));return e.lastIndex=t.lastIndex,e}(t);case y:return new r;case b:return i=t,Sn?dt(Sn.call(i)):{}}var i}(t,M,u)}}o||(o=new Yn);var D=o.get(t);if(D)return D;o.set(t,s),Qs(t)?t.forEach((function(r){s.add(Jn(r,e,n,r,t,o))})):Ws(t)&&t.forEach((function(r,i){s.set(i,Jn(r,e,n,i,t,o))}));var $=O?void 0:(w?h?qi:Wi:h?ka:wa)(t);return se($||t,(function(r,i){$&&(r=t[i=r]),Hn(s,i,Jn(r,e,n,i,t,o))})),s}function Zn(t,e,n){var r=n.length;if(null==t)return!r;for(t=dt(t);r--;){var i=n[r],o=e[i],s=t[i];if(void 0===s&&!(i in t)||!o(s))return!1}return!0}function Vn(t,e,n){if("function"!=typeof t)throw new mt(i);return wo((function(){t.apply(void 0,n)}),e)}function tr(t,e,n,r){var i=-1,o=ce,s=!0,a=t.length,u=[],l=e.length;if(!a)return u;n&&(e=fe(e,Ee(n))),r?(o=he,s=!1):e.length>=200&&(o=Oe,s=!1,e=new jn(e));t:for(;++i-1},Dn.prototype.set=function(t,e){var n=this.__data__,r=Fn(n,t);return r<0?(++this.size,n.push([t,e])):n[r][1]=e,this},$n.prototype.clear=function(){this.size=0,this.__data__={hash:new In,map:new(dn||Dn),string:new In}},$n.prototype.delete=function(t){var e=Zi(this,t).delete(t);return this.size-=e?1:0,e},$n.prototype.get=function(t){return Zi(this,t).get(t)},$n.prototype.has=function(t){return Zi(this,t).has(t)},$n.prototype.set=function(t,e){var n=Zi(this,t),r=n.size;return n.set(t,e),this.size+=n.size==r?0:1,this},jn.prototype.add=jn.prototype.push=function(t){return this.__data__.set(t,"__lodash_hash_undefined__"),this},jn.prototype.has=function(t){return this.__data__.has(t)},Yn.prototype.clear=function(){this.__data__=new Dn,this.size=0},Yn.prototype.delete=function(t){var e=this.__data__,n=e.delete(t);return this.size=e.size,n},Yn.prototype.get=function(t){return this.__data__.get(t)},Yn.prototype.has=function(t){return this.__data__.has(t)},Yn.prototype.set=function(t,e){var n=this.__data__;if(n instanceof Dn){var r=n.__data__;if(!dn||r.length<199)return r.push([t,e]),this.size=++n.size,this;n=this.__data__=new $n(r)}return n.set(t,e),this.size=n.size,this};var er=ki(lr),nr=ki(cr,!0);function rr(t,e){var n=!0;return er(t,(function(t,r,i){return n=!!e(t,r,i)})),n}function ir(t,e,n){for(var r=-1,i=t.length;++r0&&n(a)?e>1?sr(a,e-1,n,r,i):pe(i,a):r||(i[i.length]=a)}return i}var ar=xi(),ur=xi(!0);function lr(t,e){return t&&ar(t,e,wa)}function cr(t,e){return t&&ur(t,e,wa)}function hr(t,e){return le(e,(function(e){return zs(t[e])}))}function fr(t,e){for(var n=0,r=(e=ui(e,t)).length;null!=t&&ne}function vr(t,e){return null!=t&&xt.call(t,e)}function mr(t,e){return null!=t&&e in dt(t)}function yr(t,e,n){for(var i=n?he:ce,o=t[0].length,s=t.length,a=s,u=r(s),l=1/0,c=[];a--;){var h=t[a];a&&e&&(h=fe(h,Ee(e))),l=un(h.length,l),u[a]=!n&&(e||o>=120&&h.length>=120)?new jn(a&&h):void 0}h=t[0];var f=-1,p=u[0];t:for(;++f=a)return u;var l=n[r];return u*("desc"==l?-1:1)}}return t.index-e.index}(t,e,n)}))}function Ir(t,e,n){for(var r=-1,i=e.length,o={};++r-1;)a!==t&&Gt.call(a,u,1),Gt.call(t,u,1);return t}function $r(t,e){for(var n=t?e.length:0,r=n-1;n--;){var i=e[n];if(n==r||i!==o){var o=i;ao(i)?Gt.call(t,i,1):ti(t,i)}}return t}function jr(t,e){return t+tn(hn()*(e-t+1))}function Yr(t,e){var n="";if(!t||e<1||e>9007199254740991)return n;do{e%2&&(n+=t),(e=tn(e/2))&&(t+=t)}while(e);return n}function Xr(t,e){return ko(vo(t,e,qa),t+"")}function Nr(t){return Nn(Ea(t))}function zr(t,e){var n=Ea(t);return Co(n,Qn(e,0,n.length))}function Rr(t,e,n,r){if(!Hs(t))return t;for(var i=-1,o=(e=ui(e,t)).length,s=o-1,a=t;null!=a&&++io?0:o+e),(n=n>o?o:n)<0&&(n+=o),o=e>n?0:n-e>>>0,e>>>=0;for(var s=r(o);++i>>1,s=t[o];null!==s&&!Zs(s)&&(n?s<=e:s=200){var l=e?null:Yi(t);if(l)return Ue(l);s=!1,i=Oe,u=new jn}else u=e?[]:a;t:for(;++r=r?t:Wr(t,e,n)}var hi=Qe||function(t){return Wt.clearTimeout(t)};function fi(t,e){if(e)return t.slice();var n=t.length,r=zt?zt(n):new t.constructor(n);return t.copy(r),r}function pi(t){var e=new t.constructor(t.byteLength);return new Dt(e).set(new Dt(t)),e}function di(t,e){var n=e?pi(t.buffer):t.buffer;return new t.constructor(n,t.byteOffset,t.length)}function gi(t,e){if(t!==e){var n=void 0!==t,r=null===t,i=t==t,o=Zs(t),s=void 0!==e,a=null===e,u=e==e,l=Zs(e);if(!a&&!l&&!o&&t>e||o&&s&&u&&!a&&!l||r&&s&&u||!n&&u||!i)return 1;if(!r&&!o&&!l&&t1?n[i-1]:void 0,s=i>2?n[2]:void 0;for(o=t.length>3&&"function"==typeof o?(i--,o):void 0,s&&uo(n[0],n[1],s)&&(o=i<3?void 0:o,i=1),e=dt(e);++r-1?i[o?e[s]:s]:void 0}}function Li(t){return Fi((function(e){var n=e.length,r=n,o=On.prototype.thru;for(t&&e.reverse();r--;){var s=e[r];if("function"!=typeof s)throw new mt(i);if(o&&!a&&"wrapper"==Ki(s))var a=new On([],!0)}for(r=a?r:n;++r1&&_.reverse(),h&&la))return!1;var l=o.get(t),c=o.get(e);if(l&&c)return l==e&&c==t;var h=-1,f=!0,p=2&n?new jn:void 0;for(o.set(t,e),o.set(e,t);++h-1&&t%1==0&&t1?"& ":"")+e[r],e=e.join(n>2?", ":" "),t.replace(K,"{\n/* [wrapped with "+e+"] */\n")}(r,function(t,e){return se(s,(function(n){var r="_."+n[0];e&n[1]&&!ce(t,r)&&t.push(r)})),t.sort()}(function(t){var e=t.match(Q);return e?e[1].split(J):[]}(r),n)))}function Po(t){var e=0,n=0;return function(){var r=ln(),i=16-(r-n);if(n=r,i>0){if(++e>=800)return arguments[0]}else e=0;return t.apply(void 0,arguments)}}function Co(t,e){var n=-1,r=t.length,i=r-1;for(e=void 0===e?r:e;++n1?t[e-1]:void 0;return n="function"==typeof n?(t.pop(),n):void 0,Ko(t,n)}));function ns(t){var e=An(t);return e.__chain__=!0,e}function rs(t,e){return e(t)}var is=Fi((function(t){var e=t.length,n=e?t[0]:0,r=this.__wrapped__,i=function(e){return Kn(e,t)};return!(e>1||this.__actions__.length)&&r instanceof Mn&&ao(n)?((r=r.slice(n,+n+(e?1:0))).__actions__.push({func:rs,args:[i],thisArg:void 0}),new On(r,this.__chain__).thru((function(t){return e&&!t.length&&t.push(void 0),t}))):this.thru(i)}));var os=bi((function(t,e,n){xt.call(t,n)?++t[n]:Gn(t,n,1)}));var ss=Si(Mo),as=Si(Io);function us(t,e){return(Is(t)?se:er)(t,Ji(e,3))}function ls(t,e){return(Is(t)?ae:nr)(t,Ji(e,3))}var cs=bi((function(t,e,n){xt.call(t,n)?t[n].push(e):Gn(t,n,[e])}));var hs=Xr((function(t,e,n){var i=-1,o="function"==typeof e,s=$s(t)?r(t.length):[];return er(t,(function(t){s[++i]=o?ie(e,t,n):_r(t,e,n)})),s})),fs=bi((function(t,e,n){Gn(t,n,e)}));function ps(t,e){return(Is(t)?fe:Lr)(t,Ji(e,3))}var ds=bi((function(t,e,n){t[n?0:1].push(e)}),(function(){return[[],[]]}));var gs=Xr((function(t,e){if(null==t)return[];var n=e.length;return n>1&&uo(t,e[0],e[1])?e=[]:n>2&&uo(e[0],e[1],e[2])&&(e=[e[0]]),Mr(t,sr(e,1),[])})),vs=Je||function(){return Wt.Date.now()};function ms(t,e,n){return e=n?void 0:e,Ni(t,128,void 0,void 0,void 0,void 0,e=t&&null==e?t.length:e)}function ys(t,e){var n;if("function"!=typeof e)throw new mt(i);return t=ia(t),function(){return--t>0&&(n=e.apply(this,arguments)),t<=1&&(e=void 0),n}}var _s=Xr((function(t,e,n){var r=1;if(n.length){var i=Re(n,Qi(_s));r|=32}return Ni(t,r,e,n,i)})),bs=Xr((function(t,e,n){var r=3;if(n.length){var i=Re(n,Qi(bs));r|=32}return Ni(e,r,t,n,i)}));function ws(t,e,n){var r,o,s,a,u,l,c=0,h=!1,f=!1,p=!0;if("function"!=typeof t)throw new mt(i);function d(e){var n=r,i=o;return r=o=void 0,c=e,a=t.apply(i,n)}function g(t){return c=t,u=wo(m,e),h?d(t):a}function v(t){var n=t-l;return void 0===l||n>=e||n<0||f&&t-c>=s}function m(){var t=vs();if(v(t))return y(t);u=wo(m,function(t){var n=e-(t-l);return f?un(n,s-(t-c)):n}(t))}function y(t){return u=void 0,p&&r?d(t):(r=o=void 0,a)}function _(){var t=vs(),n=v(t);if(r=arguments,o=this,l=t,n){if(void 0===u)return g(l);if(f)return hi(u),u=wo(m,e),d(l)}return void 0===u&&(u=wo(m,e)),a}return e=sa(e)||0,Hs(n)&&(h=!!n.leading,s=(f="maxWait"in n)?an(sa(n.maxWait)||0,e):s,p="trailing"in n?!!n.trailing:p),_.cancel=function(){void 0!==u&&hi(u),c=0,r=l=o=u=void 0},_.flush=function(){return void 0===u?a:y(vs())},_}var ks=Xr((function(t,e){return Vn(t,1,e)})),xs=Xr((function(t,e,n){return Vn(t,sa(e)||0,n)}));function Ps(t,e){if("function"!=typeof t||null!=e&&"function"!=typeof e)throw new mt(i);var n=function(){var r=arguments,i=e?e.apply(this,r):r[0],o=n.cache;if(o.has(i))return o.get(i);var s=t.apply(this,r);return n.cache=o.set(i,s)||o,s};return n.cache=new(Ps.Cache||$n),n}function Cs(t){if("function"!=typeof t)throw new mt(i);return function(){var e=arguments;switch(e.length){case 0:return!t.call(this);case 1:return!t.call(this,e[0]);case 2:return!t.call(this,e[0],e[1]);case 3:return!t.call(this,e[0],e[1],e[2])}return!t.apply(this,e)}}Ps.Cache=$n;var Ts=li((function(t,e){var n=(e=1==e.length&&Is(e[0])?fe(e[0],Ee(Ji())):fe(sr(e,1),Ee(Ji()))).length;return Xr((function(r){for(var i=-1,o=un(r.length,n);++i=e})),Ms=br(function(){return arguments}())?br:function(t){return Fs(t)&&xt.call(t,"callee")&&!qt.call(t,"callee")},Is=r.isArray,Ds=Zt?Ee(Zt):function(t){return Fs(t)&&dr(t)==k};function $s(t){return null!=t&&Us(t.length)&&!zs(t)}function js(t){return Fs(t)&&$s(t)}var Ys=nn||su,Xs=Vt?Ee(Vt):function(t){return Fs(t)&&dr(t)==c};function Ns(t){if(!Fs(t))return!1;var e=dr(t);return e==h||"[object DOMException]"==e||"string"==typeof t.message&&"string"==typeof t.name&&!Gs(t)}function zs(t){if(!Hs(t))return!1;var e=dr(t);return e==f||e==p||"[object AsyncFunction]"==e||"[object Proxy]"==e}function Rs(t){return"number"==typeof t&&t==ia(t)}function Us(t){return"number"==typeof t&&t>-1&&t%1==0&&t<=9007199254740991}function Hs(t){var e=typeof t;return null!=t&&("object"==e||"function"==e)}function Fs(t){return null!=t&&"object"==typeof t}var Ws=te?Ee(te):function(t){return Fs(t)&&ro(t)==d};function qs(t){return"number"==typeof t||Fs(t)&&dr(t)==g}function Gs(t){if(!Fs(t)||dr(t)!=v)return!1;var e=Ht(t);if(null===e)return!0;var n=xt.call(e,"constructor")&&e.constructor;return"function"==typeof n&&n instanceof n&&kt.call(n)==St}var Ks=ee?Ee(ee):function(t){return Fs(t)&&dr(t)==m};var Qs=ne?Ee(ne):function(t){return Fs(t)&&ro(t)==y};function Js(t){return"string"==typeof t||!Is(t)&&Fs(t)&&dr(t)==_}function Zs(t){return"symbol"==typeof t||Fs(t)&&dr(t)==b}var Vs=re?Ee(re):function(t){return Fs(t)&&Us(t.length)&&!!Xt[dr(t)]};var ta=Di(Sr),ea=Di((function(t,e){return t<=e}));function na(t){if(!t)return[];if($s(t))return Js(t)?We(t):yi(t);if(Jt&&t[Jt])return function(t){for(var e,n=[];!(e=t.next()).done;)n.push(e.value);return n}(t[Jt]());var e=ro(t);return(e==d?Ne:e==y?Ue:Ea)(t)}function ra(t){return t?(t=sa(t))===1/0||t===-1/0?17976931348623157e292*(t<0?-1:1):t==t?t:0:0===t?t:0}function ia(t){var e=ra(t),n=e%1;return e==e?n?e-n:e:0}function oa(t){return t?Qn(ia(t),0,4294967295):0}function sa(t){if("number"==typeof t)return t;if(Zs(t))return NaN;if(Hs(t)){var e="function"==typeof t.valueOf?t.valueOf():t;t=Hs(e)?e+"":e}if("string"!=typeof t)return 0===t?t:+t;t=Ae(t);var n=it.test(t);return n||st.test(t)?Ut(t.slice(2),n?2:8):rt.test(t)?NaN:+t}function aa(t){return _i(t,ka(t))}function ua(t){return null==t?"":Zr(t)}var la=wi((function(t,e){if(fo(e)||$s(e))_i(e,wa(e),t);else for(var n in e)xt.call(e,n)&&Hn(t,n,e[n])})),ca=wi((function(t,e){_i(e,ka(e),t)})),ha=wi((function(t,e,n,r){_i(e,ka(e),t,r)})),fa=wi((function(t,e,n,r){_i(e,wa(e),t,r)})),pa=Fi(Kn);var da=Xr((function(t,e){t=dt(t);var n=-1,r=e.length,i=r>2?e[2]:void 0;for(i&&uo(e[0],e[1],i)&&(r=1);++n1),e})),_i(t,qi(t),n),r&&(n=Jn(n,7,Ui));for(var i=e.length;i--;)ti(n,e[i]);return n}));var Ta=Fi((function(t,e){return null==t?{}:function(t,e){return Ir(t,e,(function(e,n){return ma(t,n)}))}(t,e)}));function Sa(t,e){if(null==t)return{};var n=fe(qi(t),(function(t){return[t]}));return e=Ji(e),Ir(t,n,(function(t,n){return e(t,n[0])}))}var La=Xi(wa),Aa=Xi(ka);function Ea(t){return null==t?[]:Be(t,wa(t))}var Ba=Ci((function(t,e,n){return e=e.toLowerCase(),t+(n?Oa(e):e)}));function Oa(t){return Na(ua(t).toLowerCase())}function Ma(t){return(t=ua(t))&&t.replace(ut,$e).replace(Ot,"")}var Ia=Ci((function(t,e,n){return t+(n?"-":"")+e.toLowerCase()})),Da=Ci((function(t,e,n){return t+(n?" ":"")+e.toLowerCase()})),$a=Pi("toLowerCase");var ja=Ci((function(t,e,n){return t+(n?"_":"")+e.toLowerCase()}));var Ya=Ci((function(t,e,n){return t+(n?" ":"")+Na(e)}));var Xa=Ci((function(t,e,n){return t+(n?" ":"")+e.toUpperCase()})),Na=Pi("toUpperCase");function za(t,e,n){return t=ua(t),void 0===(e=n?void 0:e)?function(t){return $t.test(t)}(t)?function(t){return t.match(It)||[]}(t):function(t){return t.match(Z)||[]}(t):t.match(e)||[]}var Ra=Xr((function(t,e){try{return ie(t,void 0,e)}catch(t){return Ns(t)?t:new ht(t)}})),Ua=Fi((function(t,e){return se(e,(function(e){e=So(e),Gn(t,e,_s(t[e],t))})),t}));function Ha(t){return function(){return t}}var Fa=Li(),Wa=Li(!0);function qa(t){return t}function Ga(t){return Pr("function"==typeof t?t:Jn(t,1))}var Ka=Xr((function(t,e){return function(n){return _r(n,t,e)}})),Qa=Xr((function(t,e){return function(n){return _r(t,n,e)}}));function Ja(t,e,n){var r=wa(e),i=hr(e,r);null!=n||Hs(e)&&(i.length||!r.length)||(n=e,e=t,t=this,i=hr(e,wa(e)));var o=!(Hs(n)&&"chain"in n&&!n.chain),s=zs(t);return se(i,(function(n){var r=e[n];t[n]=r,s&&(t.prototype[n]=function(){var e=this.__chain__;if(o||e){var n=t(this.__wrapped__),i=n.__actions__=yi(this.__actions__);return i.push({func:r,args:arguments,thisArg:t}),n.__chain__=e,n}return r.apply(t,pe([this.value()],arguments))})})),t}function Za(){}var Va=Oi(fe),tu=Oi(ue),eu=Oi(ve);function nu(t){return lo(t)?Pe(So(t)):function(t){return function(e){return fr(e,t)}}(t)}var ru=Ii(),iu=Ii(!0);function ou(){return[]}function su(){return!1}var au=Bi((function(t,e){return t+e}),0),uu=ji("ceil"),lu=Bi((function(t,e){return t/e}),1),cu=ji("floor");var hu,fu=Bi((function(t,e){return t*e}),1),pu=ji("round"),du=Bi((function(t,e){return t-e}),0);return An.after=function(t,e){if("function"!=typeof e)throw new mt(i);return t=ia(t),function(){if(--t<1)return e.apply(this,arguments)}},An.ary=ms,An.assign=la,An.assignIn=ca,An.assignInWith=ha,An.assignWith=fa,An.at=pa,An.before=ys,An.bind=_s,An.bindAll=Ua,An.bindKey=bs,An.castArray=function(){if(!arguments.length)return[];var t=arguments[0];return Is(t)?t:[t]},An.chain=ns,An.chunk=function(t,e,n){e=(n?uo(t,e,n):void 0===e)?1:an(ia(e),0);var i=null==t?0:t.length;if(!i||e<1)return[];for(var o=0,s=0,a=r(Ve(i/e));oi?0:i+n),(r=void 0===r||r>i?i:ia(r))<0&&(r+=i),r=n>r?0:oa(r);n>>0)?(t=ua(t))&&("string"==typeof e||null!=e&&!Ks(e))&&!(e=Zr(e))&&Xe(t)?ci(We(t),0,n):t.split(e,n):[]},An.spread=function(t,e){if("function"!=typeof t)throw new mt(i);return e=null==e?0:an(ia(e),0),Xr((function(n){var r=n[e],i=ci(n,0,e);return r&&pe(i,r),ie(t,this,i)}))},An.tail=function(t){var e=null==t?0:t.length;return e?Wr(t,1,e):[]},An.take=function(t,e,n){return t&&t.length?Wr(t,0,(e=n||void 0===e?1:ia(e))<0?0:e):[]},An.takeRight=function(t,e,n){var r=null==t?0:t.length;return r?Wr(t,(e=r-(e=n||void 0===e?1:ia(e)))<0?0:e,r):[]},An.takeRightWhile=function(t,e){return t&&t.length?ni(t,Ji(e,3),!1,!0):[]},An.takeWhile=function(t,e){return t&&t.length?ni(t,Ji(e,3)):[]},An.tap=function(t,e){return e(t),t},An.throttle=function(t,e,n){var r=!0,o=!0;if("function"!=typeof t)throw new mt(i);return Hs(n)&&(r="leading"in n?!!n.leading:r,o="trailing"in n?!!n.trailing:o),ws(t,e,{leading:r,maxWait:e,trailing:o})},An.thru=rs,An.toArray=na,An.toPairs=La,An.toPairsIn=Aa,An.toPath=function(t){return Is(t)?fe(t,So):Zs(t)?[t]:yi(To(ua(t)))},An.toPlainObject=aa,An.transform=function(t,e,n){var r=Is(t),i=r||Ys(t)||Vs(t);if(e=Ji(e,4),null==n){var o=t&&t.constructor;n=i?r?new o:[]:Hs(t)&&zs(o)?En(Ht(t)):{}}return(i?se:lr)(t,(function(t,r,i){return e(n,t,r,i)})),n},An.unary=function(t){return ms(t,1)},An.union=Fo,An.unionBy=Wo,An.unionWith=qo,An.uniq=function(t){return t&&t.length?Vr(t):[]},An.uniqBy=function(t,e){return t&&t.length?Vr(t,Ji(e,2)):[]},An.uniqWith=function(t,e){return e="function"==typeof e?e:void 0,t&&t.length?Vr(t,void 0,e):[]},An.unset=function(t,e){return null==t||ti(t,e)},An.unzip=Go,An.unzipWith=Ko,An.update=function(t,e,n){return null==t?t:ei(t,e,ai(n))},An.updateWith=function(t,e,n,r){return r="function"==typeof r?r:void 0,null==t?t:ei(t,e,ai(n),r)},An.values=Ea,An.valuesIn=function(t){return null==t?[]:Be(t,ka(t))},An.without=Qo,An.words=za,An.wrap=function(t,e){return Ss(ai(e),t)},An.xor=Jo,An.xorBy=Zo,An.xorWith=Vo,An.zip=ts,An.zipObject=function(t,e){return oi(t||[],e||[],Hn)},An.zipObjectDeep=function(t,e){return oi(t||[],e||[],Rr)},An.zipWith=es,An.entries=La,An.entriesIn=Aa,An.extend=ca,An.extendWith=ha,Ja(An,An),An.add=au,An.attempt=Ra,An.camelCase=Ba,An.capitalize=Oa,An.ceil=uu,An.clamp=function(t,e,n){return void 0===n&&(n=e,e=void 0),void 0!==n&&(n=(n=sa(n))==n?n:0),void 0!==e&&(e=(e=sa(e))==e?e:0),Qn(sa(t),e,n)},An.clone=function(t){return Jn(t,4)},An.cloneDeep=function(t){return Jn(t,5)},An.cloneDeepWith=function(t,e){return Jn(t,5,e="function"==typeof e?e:void 0)},An.cloneWith=function(t,e){return Jn(t,4,e="function"==typeof e?e:void 0)},An.conformsTo=function(t,e){return null==e||Zn(t,e,wa(e))},An.deburr=Ma,An.defaultTo=function(t,e){return null==t||t!=t?e:t},An.divide=lu,An.endsWith=function(t,e,n){t=ua(t),e=Zr(e);var r=t.length,i=n=void 0===n?r:Qn(ia(n),0,r);return(n-=e.length)>=0&&t.slice(n,i)==e},An.eq=Es,An.escape=function(t){return(t=ua(t))&&Y.test(t)?t.replace($,je):t},An.escapeRegExp=function(t){return(t=ua(t))&&W.test(t)?t.replace(F,"\\$&"):t},An.every=function(t,e,n){var r=Is(t)?ue:rr;return n&&uo(t,e,n)&&(e=void 0),r(t,Ji(e,3))},An.find=ss,An.findIndex=Mo,An.findKey=function(t,e){return ye(t,Ji(e,3),lr)},An.findLast=as,An.findLastIndex=Io,An.findLastKey=function(t,e){return ye(t,Ji(e,3),cr)},An.floor=cu,An.forEach=us,An.forEachRight=ls,An.forIn=function(t,e){return null==t?t:ar(t,Ji(e,3),ka)},An.forInRight=function(t,e){return null==t?t:ur(t,Ji(e,3),ka)},An.forOwn=function(t,e){return t&&lr(t,Ji(e,3))},An.forOwnRight=function(t,e){return t&&cr(t,Ji(e,3))},An.get=va,An.gt=Bs,An.gte=Os,An.has=function(t,e){return null!=t&&io(t,e,vr)},An.hasIn=ma,An.head=$o,An.identity=qa,An.includes=function(t,e,n,r){t=$s(t)?t:Ea(t),n=n&&!r?ia(n):0;var i=t.length;return n<0&&(n=an(i+n,0)),Js(t)?n<=i&&t.indexOf(e,n)>-1:!!i&&be(t,e,n)>-1},An.indexOf=function(t,e,n){var r=null==t?0:t.length;if(!r)return-1;var i=null==n?0:ia(n);return i<0&&(i=an(r+i,0)),be(t,e,i)},An.inRange=function(t,e,n){return e=ra(e),void 0===n?(n=e,e=0):n=ra(n),function(t,e,n){return t>=un(e,n)&&t=-9007199254740991&&t<=9007199254740991},An.isSet=Qs,An.isString=Js,An.isSymbol=Zs,An.isTypedArray=Vs,An.isUndefined=function(t){return void 0===t},An.isWeakMap=function(t){return Fs(t)&&ro(t)==w},An.isWeakSet=function(t){return Fs(t)&&"[object WeakSet]"==dr(t)},An.join=function(t,e){return null==t?"":on.call(t,e)},An.kebabCase=Ia,An.last=No,An.lastIndexOf=function(t,e,n){var r=null==t?0:t.length;if(!r)return-1;var i=r;return void 0!==n&&(i=(i=ia(n))<0?an(r+i,0):un(i,r-1)),e==e?function(t,e,n){for(var r=n+1;r--;)if(t[r]===e)return r;return r}(t,e,i):_e(t,ke,i,!0)},An.lowerCase=Da,An.lowerFirst=$a,An.lt=ta,An.lte=ea,An.max=function(t){return t&&t.length?ir(t,qa,gr):void 0},An.maxBy=function(t,e){return t&&t.length?ir(t,Ji(e,2),gr):void 0},An.mean=function(t){return xe(t,qa)},An.meanBy=function(t,e){return xe(t,Ji(e,2))},An.min=function(t){return t&&t.length?ir(t,qa,Sr):void 0},An.minBy=function(t,e){return t&&t.length?ir(t,Ji(e,2),Sr):void 0},An.stubArray=ou,An.stubFalse=su,An.stubObject=function(){return{}},An.stubString=function(){return""},An.stubTrue=function(){return!0},An.multiply=fu,An.nth=function(t,e){return t&&t.length?Or(t,ia(e)):void 0},An.noConflict=function(){return Wt._===this&&(Wt._=Lt),this},An.noop=Za,An.now=vs,An.pad=function(t,e,n){t=ua(t);var r=(e=ia(e))?Fe(t):0;if(!e||r>=e)return t;var i=(e-r)/2;return Mi(tn(i),n)+t+Mi(Ve(i),n)},An.padEnd=function(t,e,n){t=ua(t);var r=(e=ia(e))?Fe(t):0;return e&&re){var r=t;t=e,e=r}if(n||t%1||e%1){var i=hn();return un(t+i*(e-t+Rt("1e-"+((i+"").length-1))),e)}return jr(t,e)},An.reduce=function(t,e,n){var r=Is(t)?de:Te,i=arguments.length<3;return r(t,Ji(e,4),n,i,er)},An.reduceRight=function(t,e,n){var r=Is(t)?ge:Te,i=arguments.length<3;return r(t,Ji(e,4),n,i,nr)},An.repeat=function(t,e,n){return e=(n?uo(t,e,n):void 0===e)?1:ia(e),Yr(ua(t),e)},An.replace=function(){var t=arguments,e=ua(t[0]);return t.length<3?e:e.replace(t[1],t[2])},An.result=function(t,e,n){var r=-1,i=(e=ui(e,t)).length;for(i||(i=1,t=void 0);++r9007199254740991)return[];var n=4294967295,r=un(t,4294967295);t-=4294967295;for(var i=Le(r,e=Ji(e));++n=o)return t;var a=n-Fe(r);if(a<1)return r;var u=s?ci(s,0,a).join(""):t.slice(0,a);if(void 0===i)return u+r;if(s&&(a+=u.length-a),Ks(i)){if(t.slice(a).search(i)){var l,c=u;for(i.global||(i=gt(i.source,ua(nt.exec(i))+"g")),i.lastIndex=0;l=i.exec(c);)var h=l.index;u=u.slice(0,void 0===h?a:h)}}else if(t.indexOf(Zr(i),a)!=a){var f=u.lastIndexOf(i);f>-1&&(u=u.slice(0,f))}return u+r},An.unescape=function(t){return(t=ua(t))&&j.test(t)?t.replace(D,Ge):t},An.uniqueId=function(t){var e=++Pt;return ua(t)+e},An.upperCase=Xa,An.upperFirst=Na,An.each=us,An.eachRight=ls,An.first=$o,Ja(An,(hu={},lr(An,(function(t,e){xt.call(An.prototype,e)||(hu[e]=t)})),hu),{chain:!1}),An.VERSION="4.17.21",se(["bind","bindKey","curry","curryRight","partial","partialRight"],(function(t){An[t].placeholder=An})),se(["drop","take"],(function(t,e){Mn.prototype[t]=function(n){n=void 0===n?1:an(ia(n),0);var r=this.__filtered__&&!e?new Mn(this):this.clone();return r.__filtered__?r.__takeCount__=un(n,r.__takeCount__):r.__views__.push({size:un(n,4294967295),type:t+(r.__dir__<0?"Right":"")}),r},Mn.prototype[t+"Right"]=function(e){return this.reverse()[t](e).reverse()}})),se(["filter","map","takeWhile"],(function(t,e){var n=e+1,r=1==n||3==n;Mn.prototype[t]=function(t){var e=this.clone();return e.__iteratees__.push({iteratee:Ji(t,3),type:n}),e.__filtered__=e.__filtered__||r,e}})),se(["head","last"],(function(t,e){var n="take"+(e?"Right":"");Mn.prototype[t]=function(){return this[n](1).value()[0]}})),se(["initial","tail"],(function(t,e){var n="drop"+(e?"":"Right");Mn.prototype[t]=function(){return this.__filtered__?new Mn(this):this[n](1)}})),Mn.prototype.compact=function(){return this.filter(qa)},Mn.prototype.find=function(t){return this.filter(t).head()},Mn.prototype.findLast=function(t){return this.reverse().find(t)},Mn.prototype.invokeMap=Xr((function(t,e){return"function"==typeof t?new Mn(this):this.map((function(n){return _r(n,t,e)}))})),Mn.prototype.reject=function(t){return this.filter(Cs(Ji(t)))},Mn.prototype.slice=function(t,e){t=ia(t);var n=this;return n.__filtered__&&(t>0||e<0)?new Mn(n):(t<0?n=n.takeRight(-t):t&&(n=n.drop(t)),void 0!==e&&(n=(e=ia(e))<0?n.dropRight(-e):n.take(e-t)),n)},Mn.prototype.takeRightWhile=function(t){return this.reverse().takeWhile(t).reverse()},Mn.prototype.toArray=function(){return this.take(4294967295)},lr(Mn.prototype,(function(t,e){var n=/^(?:filter|find|map|reject)|While$/.test(e),r=/^(?:head|last)$/.test(e),i=An[r?"take"+("last"==e?"Right":""):e],o=r||/^find/.test(e);i&&(An.prototype[e]=function(){var e=this.__wrapped__,s=r?[1]:arguments,a=e instanceof Mn,u=s[0],l=a||Is(e),c=function(t){var e=i.apply(An,pe([t],s));return r&&h?e[0]:e};l&&n&&"function"==typeof u&&1!=u.length&&(a=l=!1);var h=this.__chain__,f=!!this.__actions__.length,p=o&&!h,d=a&&!f;if(!o&&l){e=d?e:new Mn(this);var g=t.apply(e,s);return g.__actions__.push({func:rs,args:[c],thisArg:void 0}),new On(g,h)}return p&&d?t.apply(this,s):(g=this.thru(c),p?r?g.value()[0]:g.value():g)})})),se(["pop","push","shift","sort","splice","unshift"],(function(t){var e=yt[t],n=/^(?:push|sort|unshift)$/.test(t)?"tap":"thru",r=/^(?:pop|shift)$/.test(t);An.prototype[t]=function(){var t=arguments;if(r&&!this.__chain__){var i=this.value();return e.apply(Is(i)?i:[],t)}return this[n]((function(n){return e.apply(Is(n)?n:[],t)}))}})),lr(Mn.prototype,(function(t,e){var n=An[e];if(n){var r=n.name+"";xt.call(bn,r)||(bn[r]=[]),bn[r].push({name:e,func:n})}})),bn[Ai(void 0,2).name]=[{name:"wrapper",func:void 0}],Mn.prototype.clone=function(){var t=new Mn(this.__wrapped__);return t.__actions__=yi(this.__actions__),t.__dir__=this.__dir__,t.__filtered__=this.__filtered__,t.__iteratees__=yi(this.__iteratees__),t.__takeCount__=this.__takeCount__,t.__views__=yi(this.__views__),t},Mn.prototype.reverse=function(){if(this.__filtered__){var t=new Mn(this);t.__dir__=-1,t.__filtered__=!0}else(t=this.clone()).__dir__*=-1;return t},Mn.prototype.value=function(){var t=this.__wrapped__.value(),e=this.__dir__,n=Is(t),r=e<0,i=n?t.length:0,o=function(t,e,n){var r=-1,i=n.length;for(;++r=this.__values__.length;return{done:t,value:t?void 0:this.__values__[this.__index__++]}},An.prototype.plant=function(t){for(var e,n=this;n instanceof Bn;){var r=Ao(n);r.__index__=0,r.__values__=void 0,e?i.__wrapped__=r:e=r;var i=r;n=n.__wrapped__}return i.__wrapped__=t,e},An.prototype.reverse=function(){var t=this.__wrapped__;if(t instanceof Mn){var e=t;return this.__actions__.length&&(e=new Mn(this)),(e=e.reverse()).__actions__.push({func:rs,args:[Ho],thisArg:void 0}),new On(e,this.__chain__)}return this.thru(Ho)},An.prototype.toJSON=An.prototype.valueOf=An.prototype.value=function(){return ri(this.__wrapped__,this.__actions__)},An.prototype.first=An.prototype.head,Jt&&(An.prototype[Jt]=function(){return this}),An}();Wt._=Ke,void 0===(r=function(){return Ke}.call(e,n,e,t))||(t.exports=r)}).call(this)}).call(this,n(50)(t))},261:function(t,e,n){},262:function(t,e,n){},263:function(t,e,n){},264:function(t,e,n){},265:function(t,e,n){},266:function(t,e,n){},267:function(t,e){t.exports=function(t){return null==t}},268:function(t,e,n){},269:function(t,e,n){},270:function(t,e,n){},271:function(t,e,n){},272:function(t,e,n){},273:function(t,e,n){},274:function(t,e,n){},275:function(t,e,n){},276:function(t,e,n){},277:function(t,e,n){},278:function(t,e,n){},279:function(t,e,n){},280:function(t,e,n){},281:function(t,e,n){},282:function(t,e,n){},283:function(t,e,n){},287:function(t,e,n){"use strict";n.r(e);var r=n(11),i={name:"SidebarGroup",props:["item","open","collapsable","depth"],components:{DropdownTransition:n(288).a},beforeCreate(){this.$options.components.SidebarLinks=n(287).default},methods:{isActive:r.f}},o=(n(328),n(8)),s=Object(o.a)(i,(function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("section",{staticClass:"sidebar-group",class:[{collapsable:t.collapsable,"is-sub-group":0!==t.depth},"depth-"+t.depth]},[t.item.path?n("router-link",{staticClass:"sidebar-heading clickable",class:{open:t.open,active:t.isActive(t.$route,t.item.path)},attrs:{to:t.item.path},nativeOn:{click:function(e){return t.$emit("toggle")}}},[n("span",[t._v(t._s(t.item.title))]),t._v(" "),t.collapsable?n("span",{staticClass:"arrow",class:t.open?"down":"right"}):t._e()]):n("p",{staticClass:"sidebar-heading",class:{open:t.open},on:{click:function(e){return t.$emit("toggle")}}},[n("span",[t._v(t._s(t.item.title))]),t._v(" "),t.collapsable?n("span",{staticClass:"arrow",class:t.open?"down":"right"}):t._e()]),t._v(" "),n("DropdownTransition",[t.open||!t.collapsable?n("SidebarLinks",{staticClass:"sidebar-group-items",attrs:{items:t.item.children,"sidebar-depth":t.item.sidebarDepth,"initial-open-group-index":t.item.initialOpenGroupIndex,depth:t.depth+1}}):t._e()],1)],1)}),[],!1,null,null,null).exports;function a(t,e,n,r){return t("router-link",{props:{to:e,activeClass:"",exactActiveClass:""},class:{active:r,"sidebar-link":!0}},n)}function u(t,e,n,i,o,s=1){return!e||s>o?null:t("ul",{class:"sidebar-sub-headers"},e.map(e=>{const l=Object(r.f)(i,n+"#"+e.slug);return t("li",{class:"sidebar-sub-header level"+e.level},[a(t,n+"#"+e.slug,e.title,l),u(t,e.children,n,i,o,s+1)])}))}var l={functional:!0,props:["item","sidebarDepth"],render(t,{parent:{$page:e,$site:n,$route:i,$themeConfig:o,$themeLocaleConfig:s},props:{item:l,sidebarDepth:c}}){const h=Object(r.f)(i,l.path),f="auto"===l.type?h||l.children.some(t=>Object(r.f)(i,l.basePath+"#"+t.slug)):h,p="external"===l.type?function(t,e,n){return t("a",{attrs:{href:e,target:"_blank",rel:"noopener noreferrer"},class:{"sidebar-link":!0}},[n,t("OutboundLink")])}(t,l.path,l.title||l.path):a(t,l.path,l.title||l.path,f),d=[e.frontmatter.sidebarDepth,c,s.sidebarDepth,o.sidebarDepth,1].find(t=>void 0!==t),g=s.displayAllHeaders||o.displayAllHeaders;if("auto"===l.type)return[p,u(t,l.children,l.basePath,i,d)];if((f||g)&&l.headers&&!r.e.test(l.path)){return[p,u(t,Object(r.d)(l.headers),l.path,i,d)]}return p}};n(329);function c(t,e){return"group"===e.type&&e.children.some(e=>"group"===e.type?c(t,e):"page"===e.type&&Object(r.f)(t,e.path))}var h={name:"SidebarLinks",components:{SidebarGroup:s,SidebarLink:Object(o.a)(l,void 0,void 0,!1,null,null,null).exports},props:["items","depth","sidebarDepth","initialOpenGroupIndex"],data(){return{openGroupIndex:this.initialOpenGroupIndex||0}},created(){this.refreshIndex()},watch:{$route(){this.refreshIndex()}},methods:{refreshIndex(){const t=function(t,e){for(let n=0;n-1&&(this.openGroupIndex=t)},toggleGroup(t){this.openGroupIndex=t===this.openGroupIndex?-1:t},isActive(t){return Object(r.f)(this.$route,t.regularPath)}}},f=Object(o.a)(h,(function(){var t=this,e=t.$createElement,n=t._self._c||e;return t.items.length?n("ul",{staticClass:"sidebar-links"},t._l(t.items,(function(e,r){return n("li",{key:r},["group"===e.type?n("SidebarGroup",{attrs:{item:e,open:r===t.openGroupIndex,collapsable:e.collapsable||e.collapsible,depth:t.depth},on:{toggle:function(e){return t.toggleGroup(r)}}}):n("SidebarLink",{attrs:{sidebarDepth:t.sidebarDepth,item:e}})],1)})),0):t._e()}),[],!1,null,null,null);e.default=f.exports},288:function(t,e,n){"use strict";var r={name:"DropdownTransition",methods:{setHeight(t){t.style.height=t.scrollHeight+"px"},unsetHeight(t){t.style.height=""}}},i=(n(314),n(8)),o=Object(i.a)(r,(function(){var t=this.$createElement;return(this._self._c||t)("transition",{attrs:{name:"dropdown"},on:{enter:this.setHeight,"after-enter":this.unsetHeight,"before-leave":this.setHeight}},[this._t("default")],2)}),[],!1,null,null,null);e.a=o.exports},290:function(t,e,n){"use strict";n(251)},291:function(t,e,n){"use strict";n(252)},292:function(t,e,n){"use strict";n(253)},293:function(t,e,n){"use strict";n(254)},294:function(t,e,n){"use strict";n(255)},295:function(t,e,n){"use strict";n(256)},296:function(t,e,n){"use strict";n(257)},297:function(t,e,n){"use strict";n(258)},298:function(t,e,n){"use strict";var r=n(95),i=n(2),o=n(97),s=n(259),a=URLSearchParams,u=a.prototype,l=i(u.append),c=i(u.delete),h=i(u.forEach),f=i([].push),p=new a("a=1&a=2&b=3");p.delete("a",1),p.delete("b",void 0),p+""!="a=2"&&r(u,"delete",(function(t){var e=arguments.length,n=e<2?void 0:arguments[1];if(e&&void 0===n)return c(this,t);var r=[];h(this,(function(t,e){f(r,{key:e,value:t})})),s(e,1);for(var i,a=o(t),u=o(n),p=0,d=0,g=!1,v=r.length;p1?arguments[1]:void 0)}}),o("findLastIndex")},303:function(t,e,n){"use strict";var r=n(304),i=n(48),o=n(31),s=n(32),a=function(t){var e=1===t;return function(n,a,u){for(var l,c=o(n),h=i(c),f=s(h),p=r(a,u);f-- >0;)if(p(l=h[f],f,c))switch(t){case 0:return l;case 1:return f}return e?-1:void 0}};t.exports={findLast:a(0),findLastIndex:a(1)}},304:function(t,e,n){"use strict";var r=n(305),i=n(29),o=n(26),s=r(r.bind);t.exports=function(t,e){return i(t),void 0===e?t:o?s(t,e):function(){return t.apply(e,arguments)}}},305:function(t,e,n){"use strict";var r=n(18),i=n(2);t.exports=function(t){if("Function"===r(t))return i(t)}},306:function(t,e,n){"use strict";var r=n(30),i=n(307),o=n(17).f,s=r("unscopables"),a=Array.prototype;void 0===a[s]&&o(a,s,{configurable:!0,value:i(null)}),t.exports=function(t){a[s][t]=!0}},307:function(t,e,n){"use strict";var r,i=n(47),o=n(308),s=n(96),a=n(49),u=n(310),l=n(98),c=n(101),h=c("IE_PROTO"),f=function(){},p=function(t){return" + + diff --git a/iconfont/iconfont.css b/iconfont/iconfont.css new file mode 100644 index 0000000..e88e105 --- /dev/null +++ b/iconfont/iconfont.css @@ -0,0 +1,59 @@ +@font-face { + font-family: "iconfont"; /* Project id 3114978 */ + src: url('iconfont.woff2?t=1667224389760') format('woff2'), + url('iconfont.woff?t=1667224389760') format('woff'), + url('iconfont.ttf?t=1667224389760') format('truetype'); +} + +.iconfont { + font-family: "iconfont" !important; + font-size: 16px; + font-style: normal; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.icon-xiangxiajiantou:before { + content: "\e65e"; +} + +.icon-xiangzuojiantou:before { + content: "\e660"; +} + +.icon-dagouyouquan:before { + content: "\e630"; +} + +.icon-gantanhao:before { + content: "\e710"; +} + +.icon-info:before { + content: "\e675"; +} + +.icon-cuowu:before { + content: "\e7fa"; +} + +.icon-loading:before { + content: "\e61d"; +} + +.icon-shijian:before { + content: "\e687"; +} + +.icon-award:before { + content: "\e7df"; +} + +.icon-view:before { + content: "\e633"; +} + +.icon-book:before { + content: "\e67c"; +} + diff --git a/iconfont/iconfont.js b/iconfont/iconfont.js new file mode 100644 index 0000000..a29f1c0 --- /dev/null +++ b/iconfont/iconfont.js @@ -0,0 +1 @@ +window._iconfont_svg_string_3114978='',function(e){var t=(t=document.getElementsByTagName("script"))[t.length-1],a=t.getAttribute("data-injectcss"),t=t.getAttribute("data-disable-injectsvg");if(!t){var o,c,i,n,d,l=function(t,a){a.parentNode.insertBefore(t,a)};if(a&&!e.__iconfont__svg__cssinject__){e.__iconfont__svg__cssinject__=!0;try{document.write("")}catch(t){console&&console.log(t)}}o=function(){var t,a=document.createElement("div");a.innerHTML=e._iconfont_svg_string_3114978,(a=a.getElementsByTagName("svg")[0])&&(a.setAttribute("aria-hidden","true"),a.style.position="absolute",a.style.width=0,a.style.height=0,a.style.overflow="hidden",a=a,(t=document.body).firstChild?l(a,t.firstChild):t.appendChild(a))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(o,0):(c=function(){document.removeEventListener("DOMContentLoaded",c,!1),o()},document.addEventListener("DOMContentLoaded",c,!1)):document.attachEvent&&(i=o,n=e.document,d=!1,h(),n.onreadystatechange=function(){"complete"==n.readyState&&(n.onreadystatechange=null,s())})}function s(){d||(d=!0,i())}function h(){try{n.documentElement.doScroll("left")}catch(t){return void setTimeout(h,50)}s()}}(window); \ No newline at end of file diff --git a/iconfont/iconfont.json b/iconfont/iconfont.json new file mode 100644 index 0000000..69da202 --- /dev/null +++ b/iconfont/iconfont.json @@ -0,0 +1,86 @@ +{ + "id": "3114978", + "name": "my_notes", + "font_family": "iconfont", + "css_prefix_text": "icon-", + "description": "", + "glyphs": [ + { + "icon_id": "630092", + "name": "向下箭头", + "font_class": "xiangxiajiantou", + "unicode": "e65e", + "unicode_decimal": 58974 + }, + { + "icon_id": "630095", + "name": "向左箭头", + "font_class": "xiangzuojiantou", + "unicode": "e660", + "unicode_decimal": 58976 + }, + { + "icon_id": "1166351", + "name": "打勾_有圈", + "font_class": "dagouyouquan", + "unicode": "e630", + "unicode_decimal": 58928 + }, + { + "icon_id": "9974757", + "name": "感叹号", + "font_class": "gantanhao", + "unicode": "e710", + "unicode_decimal": 59152 + }, + { + "icon_id": "11686796", + "name": "info", + "font_class": "info", + "unicode": "e675", + "unicode_decimal": 58997 + }, + { + "icon_id": "12148932", + "name": "错误", + "font_class": "cuowu", + "unicode": "e7fa", + "unicode_decimal": 59386 + }, + { + "icon_id": "722473", + "name": "loading", + "font_class": "loading", + "unicode": "e61d", + "unicode_decimal": 58909 + }, + { + "icon_id": "1196167", + "name": "时间", + "font_class": "shijian", + "unicode": "e687", + "unicode_decimal": 59015 + }, + { + "icon_id": "8952406", + "name": "award", + "font_class": "award", + "unicode": "e7df", + "unicode_decimal": 59359 + }, + { + "icon_id": "15205994", + "name": "view", + "font_class": "view", + "unicode": "e633", + "unicode_decimal": 58931 + }, + { + "icon_id": "1355085", + "name": "book", + "font_class": "book", + "unicode": "e67c", + "unicode_decimal": 59004 + } + ] +} diff --git a/iconfont/iconfont.ttf b/iconfont/iconfont.ttf new file mode 100644 index 0000000..5bfbc58 Binary files /dev/null and b/iconfont/iconfont.ttf differ diff --git a/iconfont/iconfont.woff b/iconfont/iconfont.woff new file mode 100644 index 0000000..4b4b810 Binary files /dev/null and b/iconfont/iconfont.woff differ diff --git a/iconfont/iconfont.woff2 b/iconfont/iconfont.woff2 new file mode 100644 index 0000000..3cc5af1 Binary files /dev/null and b/iconfont/iconfont.woff2 differ diff --git a/img/Apifox-2.png b/img/Apifox-2.png new file mode 100644 index 0000000..bf5f9c3 Binary files /dev/null and b/img/Apifox-2.png differ diff --git a/img/Apifox-860x320.png b/img/Apifox-860x320.png new file mode 100644 index 0000000..a51315c Binary files /dev/null and b/img/Apifox-860x320.png differ diff --git a/img/bg.jpeg b/img/bg.jpeg new file mode 100644 index 0000000..85e53e7 Binary files /dev/null and b/img/bg.jpeg differ diff --git a/img/bg.jpg b/img/bg.jpg new file mode 100644 index 0000000..f093e79 Binary files /dev/null and b/img/bg.jpg differ diff --git a/img/build/after-gzip.jpg b/img/build/after-gzip.jpg new file mode 100644 index 0000000..9782977 Binary files /dev/null and b/img/build/after-gzip.jpg differ diff --git a/img/build/before-gzip.jpg b/img/build/before-gzip.jpg new file mode 100644 index 0000000..69071e9 Binary files /dev/null and b/img/build/before-gzip.jpg differ diff --git a/img/build/check-nginx-config.jpg b/img/build/check-nginx-config.jpg new file mode 100644 index 0000000..d533db7 Binary files /dev/null and b/img/build/check-nginx-config.jpg differ diff --git a/img/build/dist-small.jpg b/img/build/dist-small.jpg new file mode 100644 index 0000000..73b79b8 Binary files /dev/null and b/img/build/dist-small.jpg differ diff --git a/img/build/dist.jpg b/img/build/dist.jpg new file mode 100644 index 0000000..3df7908 Binary files /dev/null and b/img/build/dist.jpg differ diff --git a/img/build/nginx-config.jpg b/img/build/nginx-config.jpg new file mode 100644 index 0000000..a5d6554 Binary files /dev/null and b/img/build/nginx-config.jpg differ diff --git a/img/build/no-output.jpg b/img/build/no-output.jpg new file mode 100644 index 0000000..75c92f2 Binary files /dev/null and b/img/build/no-output.jpg differ diff --git a/img/build/optimize.jpg b/img/build/optimize.jpg new file mode 100644 index 0000000..dd9b3f9 Binary files /dev/null and b/img/build/optimize.jpg differ diff --git a/img/build/output.jpg b/img/build/output.jpg new file mode 100644 index 0000000..cb7a2e4 Binary files /dev/null and b/img/build/output.jpg differ diff --git a/img/docker/1.jpg b/img/docker/1.jpg new file mode 100644 index 0000000..7835636 Binary files /dev/null and b/img/docker/1.jpg differ diff --git a/img/electron/1.jpg b/img/electron/1.jpg new file mode 100644 index 0000000..dbed617 Binary files /dev/null and b/img/electron/1.jpg differ diff --git a/img/electron/2.jpg b/img/electron/2.jpg new file mode 100644 index 0000000..faccbc0 Binary files /dev/null and b/img/electron/2.jpg differ diff --git a/img/electron/3.jpg b/img/electron/3.jpg new file mode 100644 index 0000000..a872d69 Binary files /dev/null and b/img/electron/3.jpg differ diff --git a/img/ep/dialog-dark.jpg b/img/ep/dialog-dark.jpg new file mode 100644 index 0000000..11fdb04 Binary files /dev/null and b/img/ep/dialog-dark.jpg differ diff --git a/img/ep/dialog.jpg b/img/ep/dialog.jpg new file mode 100644 index 0000000..3af7b56 Binary files /dev/null and b/img/ep/dialog.jpg differ diff --git a/img/ep/drawer-dark.jpg b/img/ep/drawer-dark.jpg new file mode 100644 index 0000000..ba7f3c6 Binary files /dev/null and b/img/ep/drawer-dark.jpg differ diff --git a/img/ep/drawer.jpg b/img/ep/drawer.jpg new file mode 100644 index 0000000..0aae517 Binary files /dev/null and b/img/ep/drawer.jpg differ diff --git a/img/ep/ep1.png b/img/ep/ep1.png new file mode 100644 index 0000000..30fb50c Binary files /dev/null and b/img/ep/ep1.png differ diff --git a/img/ep/ep2.png b/img/ep/ep2.png new file mode 100644 index 0000000..04ad122 Binary files /dev/null and b/img/ep/ep2.png differ diff --git a/img/ep/ep3.png b/img/ep/ep3.png new file mode 100644 index 0000000..a88fd95 Binary files /dev/null and b/img/ep/ep3.png differ diff --git a/img/ep/ep4.png b/img/ep/ep4.png new file mode 100644 index 0000000..3e346a3 Binary files /dev/null and b/img/ep/ep4.png differ diff --git a/img/ep/messagebox-dark.jpg b/img/ep/messagebox-dark.jpg new file mode 100644 index 0000000..ef67b98 Binary files /dev/null and b/img/ep/messagebox-dark.jpg differ diff --git a/img/ep/messagebox.jpg b/img/ep/messagebox.jpg new file mode 100644 index 0000000..2ac5ad8 Binary files /dev/null and b/img/ep/messagebox.jpg differ diff --git a/img/ep/notification-dark.jpg b/img/ep/notification-dark.jpg new file mode 100644 index 0000000..7723ab8 Binary files /dev/null and b/img/ep/notification-dark.jpg differ diff --git a/img/ep/notification.jpg b/img/ep/notification.jpg new file mode 100644 index 0000000..1b46b5e Binary files /dev/null and b/img/ep/notification.jpg differ diff --git a/img/favicon.ico b/img/favicon.ico new file mode 100644 index 0000000..6f2e179 Binary files /dev/null and b/img/favicon.ico differ diff --git "a/img/gif/\347\214\2531.gif" "b/img/gif/\347\214\2531.gif" new file mode 100644 index 0000000..e84d8a2 Binary files /dev/null and "b/img/gif/\347\214\2531.gif" differ diff --git "a/img/gif/\347\214\2532.gif" "b/img/gif/\347\214\2532.gif" new file mode 100644 index 0000000..2811459 Binary files /dev/null and "b/img/gif/\347\214\2532.gif" differ diff --git "a/img/gif/\347\214\2533.gif" "b/img/gif/\347\214\2533.gif" new file mode 100644 index 0000000..894372d Binary files /dev/null and "b/img/gif/\347\214\2533.gif" differ diff --git "a/img/gif/\347\214\2534.gif" "b/img/gif/\347\214\2534.gif" new file mode 100644 index 0000000..7b99130 Binary files /dev/null and "b/img/gif/\347\214\2534.gif" differ diff --git a/img/guide/cloc.jpg b/img/guide/cloc.jpg new file mode 100644 index 0000000..0e70213 Binary files /dev/null and b/img/guide/cloc.jpg differ diff --git a/img/guide/config-logo.jpg b/img/guide/config-logo.jpg new file mode 100644 index 0000000..1e45b2e Binary files /dev/null and b/img/guide/config-logo.jpg differ diff --git a/img/guide/error1.png b/img/guide/error1.png new file mode 100644 index 0000000..24836d6 Binary files /dev/null and b/img/guide/error1.png differ diff --git a/img/guide/eslint.jpg b/img/guide/eslint.jpg new file mode 100644 index 0000000..6964caa Binary files /dev/null and b/img/guide/eslint.jpg differ diff --git a/img/guide/eslint1.jpg b/img/guide/eslint1.jpg new file mode 100644 index 0000000..f5b09f5 Binary files /dev/null and b/img/guide/eslint1.jpg differ diff --git a/img/guide/grey.jpg b/img/guide/grey.jpg new file mode 100644 index 0000000..b7f7e51 Binary files /dev/null and b/img/guide/grey.jpg differ diff --git a/img/guide/hotlog.png b/img/guide/hotlog.png new file mode 100644 index 0000000..62ddace Binary files /dev/null and b/img/guide/hotlog.png differ diff --git a/img/guide/i18n.jpg b/img/guide/i18n.jpg new file mode 100644 index 0000000..2991235 Binary files /dev/null and b/img/guide/i18n.jpg differ diff --git a/img/guide/i18n.png b/img/guide/i18n.png new file mode 100644 index 0000000..2e2a48a Binary files /dev/null and b/img/guide/i18n.png differ diff --git a/img/guide/i18nAlly.jpg b/img/guide/i18nAlly.jpg new file mode 100644 index 0000000..c038225 Binary files /dev/null and b/img/guide/i18nAlly.jpg differ diff --git a/img/guide/i18nRouter.png b/img/guide/i18nRouter.png new file mode 100644 index 0000000..118e3df Binary files /dev/null and b/img/guide/i18nRouter.png differ diff --git a/img/guide/i18nVue.png b/img/guide/i18nVue.png new file mode 100644 index 0000000..2c0d82d Binary files /dev/null and b/img/guide/i18nVue.png differ diff --git a/img/guide/iconfont.png b/img/guide/iconfont.png new file mode 100644 index 0000000..aa6ea2c Binary files /dev/null and b/img/guide/iconfont.png differ diff --git a/img/guide/lodash.png b/img/guide/lodash.png new file mode 100644 index 0000000..dd33af7 Binary files /dev/null and b/img/guide/lodash.png differ diff --git a/img/guide/log.png b/img/guide/log.png new file mode 100644 index 0000000..6ec509e Binary files /dev/null and b/img/guide/log.png differ diff --git a/img/guide/logo.png b/img/guide/logo.png new file mode 100644 index 0000000..dbaa5ce Binary files /dev/null and b/img/guide/logo.png differ diff --git a/img/guide/mac.png b/img/guide/mac.png new file mode 100644 index 0000000..fe65101 Binary files /dev/null and b/img/guide/mac.png differ diff --git a/img/guide/namespace.jpg b/img/guide/namespace.jpg new file mode 100644 index 0000000..4db975e Binary files /dev/null and b/img/guide/namespace.jpg differ diff --git a/img/guide/nodejs.jpg b/img/guide/nodejs.jpg new file mode 100644 index 0000000..4e2c9b5 Binary files /dev/null and b/img/guide/nodejs.jpg differ diff --git a/img/guide/npm1.jpg b/img/guide/npm1.jpg new file mode 100644 index 0000000..79eab51 Binary files /dev/null and b/img/guide/npm1.jpg differ diff --git a/img/guide/npm2.jpg b/img/guide/npm2.jpg new file mode 100644 index 0000000..eac8ddb Binary files /dev/null and b/img/guide/npm2.jpg differ diff --git a/img/guide/npm3.jpg b/img/guide/npm3.jpg new file mode 100644 index 0000000..62979e6 Binary files /dev/null and b/img/guide/npm3.jpg differ diff --git a/img/guide/optimized.png b/img/guide/optimized.png new file mode 100644 index 0000000..44ecf3b Binary files /dev/null and b/img/guide/optimized.png differ diff --git a/img/guide/package.jpg b/img/guide/package.jpg new file mode 100644 index 0000000..4730d92 Binary files /dev/null and b/img/guide/package.jpg differ diff --git a/img/guide/pinia.png b/img/guide/pinia.png new file mode 100644 index 0000000..0a4f3b7 Binary files /dev/null and b/img/guide/pinia.png differ diff --git a/img/guide/rank.png b/img/guide/rank.png new file mode 100644 index 0000000..f97b49c Binary files /dev/null and b/img/guide/rank.png differ diff --git a/img/guide/recommended1.jpg b/img/guide/recommended1.jpg new file mode 100644 index 0000000..19a9a91 Binary files /dev/null and b/img/guide/recommended1.jpg differ diff --git a/img/guide/recommended2.jpg b/img/guide/recommended2.jpg new file mode 100644 index 0000000..5105f55 Binary files /dev/null and b/img/guide/recommended2.jpg differ diff --git a/img/guide/report.jpg b/img/guide/report.jpg new file mode 100644 index 0000000..56811f8 Binary files /dev/null and b/img/guide/report.jpg differ diff --git a/img/guide/routePath.png b/img/guide/routePath.png new file mode 100644 index 0000000..8317592 Binary files /dev/null and b/img/guide/routePath.png differ diff --git a/img/guide/sass.png b/img/guide/sass.png new file mode 100644 index 0000000..561c669 Binary files /dev/null and b/img/guide/sass.png differ diff --git a/img/guide/snip.png b/img/guide/snip.png new file mode 100644 index 0000000..b1ca6cf Binary files /dev/null and b/img/guide/snip.png differ diff --git a/img/guide/snip30.jpg b/img/guide/snip30.jpg new file mode 100644 index 0000000..b60b1ec Binary files /dev/null and b/img/guide/snip30.jpg differ diff --git a/img/guide/snip32.jpg b/img/guide/snip32.jpg new file mode 100644 index 0000000..5d9efe4 Binary files /dev/null and b/img/guide/snip32.jpg differ diff --git a/img/guide/snip33.jpg b/img/guide/snip33.jpg new file mode 100644 index 0000000..5f35e8e Binary files /dev/null and b/img/guide/snip33.jpg differ diff --git a/img/guide/theme.jpg b/img/guide/theme.jpg new file mode 100644 index 0000000..5fba50b Binary files /dev/null and b/img/guide/theme.jpg differ diff --git a/img/guide/unexpected.jpg b/img/guide/unexpected.jpg new file mode 100644 index 0000000..a9aa3b2 Binary files /dev/null and b/img/guide/unexpected.jpg differ diff --git a/img/guide/vite.png b/img/guide/vite.png new file mode 100644 index 0000000..a9eb9cb Binary files /dev/null and b/img/guide/vite.png differ diff --git a/img/guide/vscode-tailwindcss.png b/img/guide/vscode-tailwindcss.png new file mode 100644 index 0000000..5794128 Binary files /dev/null and b/img/guide/vscode-tailwindcss.png differ diff --git a/img/guide/vscode.png b/img/guide/vscode.png new file mode 100644 index 0000000..9420261 Binary files /dev/null and b/img/guide/vscode.png differ diff --git a/img/guide/xrk1.jpg b/img/guide/xrk1.jpg new file mode 100644 index 0000000..349ca3e Binary files /dev/null and b/img/guide/xrk1.jpg differ diff --git a/img/guide/xrk2.jpg b/img/guide/xrk2.jpg new file mode 100644 index 0000000..2769aee Binary files /dev/null and b/img/guide/xrk2.jpg differ diff --git a/img/guide/yarn.png b/img/guide/yarn.png new file mode 100644 index 0000000..0221b2c Binary files /dev/null and b/img/guide/yarn.png differ diff --git a/img/http/type.jpg b/img/http/type.jpg new file mode 100644 index 0000000..96711fb Binary files /dev/null and b/img/http/type.jpg differ diff --git a/img/icon/ant-icon.png b/img/icon/ant-icon.png new file mode 100644 index 0000000..fe2ff71 Binary files /dev/null and b/img/icon/ant-icon.png differ diff --git a/img/icon/ant-install.png b/img/icon/ant-install.png new file mode 100644 index 0000000..2eae4dd Binary files /dev/null and b/img/icon/ant-install.png differ diff --git a/img/icon/ant-install2.png b/img/icon/ant-install2.png new file mode 100644 index 0000000..4e53ba9 Binary files /dev/null and b/img/icon/ant-install2.png differ diff --git a/img/icon/ep-icon.png b/img/icon/ep-icon.png new file mode 100644 index 0000000..e49a561 Binary files /dev/null and b/img/icon/ep-icon.png differ diff --git a/img/icon/icon-online.png b/img/icon/icon-online.png new file mode 100644 index 0000000..9cad7e7 Binary files /dev/null and b/img/icon/icon-online.png differ diff --git a/img/icon/iconfont.png b/img/icon/iconfont.png new file mode 100644 index 0000000..e69de29 diff --git a/img/icon/menu-if.png b/img/icon/menu-if.png new file mode 100644 index 0000000..7016645 Binary files /dev/null and b/img/icon/menu-if.png differ diff --git a/img/icon/menu-local.jpg b/img/icon/menu-local.jpg new file mode 100644 index 0000000..5e9ccf0 Binary files /dev/null and b/img/icon/menu-local.jpg differ diff --git a/img/icon/menu-local.png b/img/icon/menu-local.png new file mode 100644 index 0000000..1f8accd Binary files /dev/null and b/img/icon/menu-local.png differ diff --git a/img/icon/menu-svg.png b/img/icon/menu-svg.png new file mode 100644 index 0000000..9af2ca7 Binary files /dev/null and b/img/icon/menu-svg.png differ diff --git a/img/icon/online-click.png b/img/icon/online-click.png new file mode 100644 index 0000000..754246c Binary files /dev/null and b/img/icon/online-click.png differ diff --git a/img/icon/online.jpg b/img/icon/online.jpg new file mode 100644 index 0000000..2f7eb4c Binary files /dev/null and b/img/icon/online.jpg differ diff --git a/img/icon/svg.png b/img/icon/svg.png new file mode 100644 index 0000000..e69de29 diff --git a/img/icon/useRenderIcon.png b/img/icon/useRenderIcon.png new file mode 100644 index 0000000..d617bce Binary files /dev/null and b/img/icon/useRenderIcon.png differ diff --git a/img/icon/vscode-iconify.png b/img/icon/vscode-iconify.png new file mode 100644 index 0000000..d9bc15d Binary files /dev/null and b/img/icon/vscode-iconify.png differ diff --git a/img/icon/vscode-iconify2.png b/img/icon/vscode-iconify2.png new file mode 100644 index 0000000..04825b4 Binary files /dev/null and b/img/icon/vscode-iconify2.png differ diff --git a/img/layout/horizontal-detail.jpg b/img/layout/horizontal-detail.jpg new file mode 100644 index 0000000..10bc318 Binary files /dev/null and b/img/layout/horizontal-detail.jpg differ diff --git a/img/layout/horizontal.jpg b/img/layout/horizontal.jpg new file mode 100644 index 0000000..5f50f49 Binary files /dev/null and b/img/layout/horizontal.jpg differ diff --git a/img/layout/mixNav-detail.jpg b/img/layout/mixNav-detail.jpg new file mode 100644 index 0000000..b1eb2d4 Binary files /dev/null and b/img/layout/mixNav-detail.jpg differ diff --git a/img/layout/mixNav.jpg b/img/layout/mixNav.jpg new file mode 100644 index 0000000..b2e9f5b Binary files /dev/null and b/img/layout/mixNav.jpg differ diff --git a/img/layout/vertical-detail.jpg b/img/layout/vertical-detail.jpg new file mode 100644 index 0000000..6548c30 Binary files /dev/null and b/img/layout/vertical-detail.jpg differ diff --git a/img/layout/vertical.jpg b/img/layout/vertical.jpg new file mode 100644 index 0000000..b5a0a3f Binary files /dev/null and b/img/layout/vertical.jpg differ diff --git a/img/login/no1.jpg b/img/login/no1.jpg new file mode 100644 index 0000000..1c51be3 Binary files /dev/null and b/img/login/no1.jpg differ diff --git a/img/login/no1.png b/img/login/no1.png new file mode 100644 index 0000000..3dc04ec Binary files /dev/null and b/img/login/no1.png differ diff --git a/img/logo.png b/img/logo.png new file mode 100644 index 0000000..22edc0d Binary files /dev/null and b/img/logo.png differ diff --git a/img/more.png b/img/more.png new file mode 100644 index 0000000..830613b Binary files /dev/null and b/img/more.png differ diff --git a/img/other.png b/img/other.png new file mode 100644 index 0000000..87f8098 Binary files /dev/null and b/img/other.png differ diff --git a/img/panda-waving.png b/img/panda-waving.png new file mode 100644 index 0000000..20246c6 Binary files /dev/null and b/img/panda-waving.png differ diff --git "a/img/png/\346\200\235\347\273\264\345\257\274\345\233\276.png" "b/img/png/\346\200\235\347\273\264\345\257\274\345\233\276.png" new file mode 100644 index 0000000..819ef70 Binary files /dev/null and "b/img/png/\346\200\235\347\273\264\345\257\274\345\233\276.png" differ diff --git "a/img/png/\346\225\260\346\215\256\345\272\223.png" "b/img/png/\346\225\260\346\215\256\345\272\223.png" new file mode 100644 index 0000000..4d13c3f Binary files /dev/null and "b/img/png/\346\225\260\346\215\256\345\272\223.png" differ diff --git "a/img/png/\346\225\260\346\215\256\347\273\223\346\236\204.png" "b/img/png/\346\225\260\346\215\256\347\273\223\346\236\204.png" new file mode 100644 index 0000000..1bafe96 Binary files /dev/null and "b/img/png/\346\225\260\346\215\256\347\273\223\346\236\204.png" differ diff --git "a/img/png/\346\234\215\345\212\241\345\231\250.png" "b/img/png/\346\234\215\345\212\241\345\231\250.png" new file mode 100644 index 0000000..4127eb5 Binary files /dev/null and "b/img/png/\346\234\215\345\212\241\345\231\250.png" differ diff --git "a/img/png/\346\234\272\345\231\250\345\255\246\344\271\240.png" "b/img/png/\346\234\272\345\231\250\345\255\246\344\271\240.png" new file mode 100644 index 0000000..081c2b8 Binary files /dev/null and "b/img/png/\346\234\272\345\231\250\345\255\246\344\271\240.png" differ diff --git "a/img/png/\347\256\227\346\263\225.png" "b/img/png/\347\256\227\346\263\225.png" new file mode 100644 index 0000000..92fef3f Binary files /dev/null and "b/img/png/\347\256\227\346\263\225.png" differ diff --git "a/img/png/\347\263\273\347\273\237.png" "b/img/png/\347\263\273\347\273\237.png" new file mode 100644 index 0000000..87f0de0 Binary files /dev/null and "b/img/png/\347\263\273\347\273\237.png" differ diff --git "a/img/png/\347\263\273\347\273\237\345\210\206\346\236\220.png" "b/img/png/\347\263\273\347\273\237\345\210\206\346\236\220.png" new file mode 100644 index 0000000..208e259 Binary files /dev/null and "b/img/png/\347\263\273\347\273\237\345\210\206\346\236\220.png" differ diff --git "a/img/png/\347\274\226\347\250\213.png" "b/img/png/\347\274\226\347\250\213.png" new file mode 100644 index 0000000..a8bca76 Binary files /dev/null and "b/img/png/\347\274\226\347\250\213.png" differ diff --git "a/img/png/\347\275\221\347\273\234\346\212\200\346\234\257.png" "b/img/png/\347\275\221\347\273\234\346\212\200\346\234\257.png" new file mode 100644 index 0000000..f81edb7 Binary files /dev/null and "b/img/png/\347\275\221\347\273\234\346\212\200\346\234\257.png" differ diff --git "a/img/png/\350\256\241\347\256\227\346\234\272\347\275\221\347\273\234.png" "b/img/png/\350\256\241\347\256\227\346\234\272\347\275\221\347\273\234.png" new file mode 100644 index 0000000..63a1819 Binary files /dev/null and "b/img/png/\350\256\241\347\256\227\346\234\272\347\275\221\347\273\234.png" differ diff --git "a/img/png/\350\275\257\344\273\266\345\274\200\345\217\221.png" "b/img/png/\350\275\257\344\273\266\345\274\200\345\217\221.png" new file mode 100644 index 0000000..72c5e85 Binary files /dev/null and "b/img/png/\350\275\257\344\273\266\345\274\200\345\217\221.png" differ diff --git "a/img/png/\351\235\242\345\220\221\345\257\271\350\261\241.png" "b/img/png/\351\235\242\345\220\221\345\257\271\350\261\241.png" new file mode 100644 index 0000000..cd13fa3 Binary files /dev/null and "b/img/png/\351\235\242\345\220\221\345\257\271\350\261\241.png" differ diff --git "a/img/png/\351\241\271\347\233\256\347\256\241\347\220\206.png" "b/img/png/\351\241\271\347\233\256\347\256\241\347\220\206.png" new file mode 100644 index 0000000..0467abd Binary files /dev/null and "b/img/png/\351\241\271\347\233\256\347\256\241\347\220\206.png" differ diff --git a/img/polite.jpg b/img/polite.jpg new file mode 100644 index 0000000..3a4b145 Binary files /dev/null and b/img/polite.jpg differ diff --git a/img/pure.png b/img/pure.png new file mode 100644 index 0000000..11cd42f Binary files /dev/null and b/img/pure.png differ diff --git a/img/python.png b/img/python.png new file mode 100644 index 0000000..c3ddebe Binary files /dev/null and b/img/python.png differ diff --git a/img/qrcode/QQ.jpg b/img/qrcode/QQ.jpg new file mode 100644 index 0000000..b23774c Binary files /dev/null and b/img/qrcode/QQ.jpg differ diff --git a/img/qrcode/QQ.png b/img/qrcode/QQ.png new file mode 100644 index 0000000..affcb4b Binary files /dev/null and b/img/qrcode/QQ.png differ diff --git a/img/qrcode/gzh.jpg b/img/qrcode/gzh.jpg new file mode 100644 index 0000000..6d0f980 Binary files /dev/null and b/img/qrcode/gzh.jpg differ diff --git a/img/qrcode/qqq.webp b/img/qrcode/qqq.webp new file mode 100644 index 0000000..87940a5 Binary files /dev/null and b/img/qrcode/qqq.webp differ diff --git a/img/qrcode/wxq.png b/img/qrcode/wxq.png new file mode 100644 index 0000000..38b8db0 Binary files /dev/null and b/img/qrcode/wxq.png differ diff --git a/img/qrcode/wxzs.jpg b/img/qrcode/wxzs.jpg new file mode 100644 index 0000000..67c9076 Binary files /dev/null and b/img/qrcode/wxzs.jpg differ diff --git a/img/qrcode/wxzz.jpg b/img/qrcode/wxzz.jpg new file mode 100644 index 0000000..53afbed Binary files /dev/null and b/img/qrcode/wxzz.jpg differ diff --git a/img/qrcode/zfbzz.jpg b/img/qrcode/zfbzz.jpg new file mode 100644 index 0000000..b8f94c0 Binary files /dev/null and b/img/qrcode/zfbzz.jpg differ diff --git a/img/rbac/auths.png b/img/rbac/auths.png new file mode 100644 index 0000000..405b407 Binary files /dev/null and b/img/rbac/auths.png differ diff --git a/img/rbac/roles.png b/img/rbac/roles.png new file mode 100644 index 0000000..de0ec12 Binary files /dev/null and b/img/rbac/roles.png differ diff --git a/img/router/async1.jpg b/img/router/async1.jpg new file mode 100644 index 0000000..b18d5d6 Binary files /dev/null and b/img/router/async1.jpg differ diff --git a/img/router/async10.jpg b/img/router/async10.jpg new file mode 100644 index 0000000..19639c1 Binary files /dev/null and b/img/router/async10.jpg differ diff --git a/img/router/async2.jpg b/img/router/async2.jpg new file mode 100644 index 0000000..2ee5341 Binary files /dev/null and b/img/router/async2.jpg differ diff --git a/img/router/async3.jpg b/img/router/async3.jpg new file mode 100644 index 0000000..35bc2f0 Binary files /dev/null and b/img/router/async3.jpg differ diff --git a/img/router/async4.jpg b/img/router/async4.jpg new file mode 100644 index 0000000..aaf4866 Binary files /dev/null and b/img/router/async4.jpg differ diff --git a/img/router/async5.jpg b/img/router/async5.jpg new file mode 100644 index 0000000..64bca48 Binary files /dev/null and b/img/router/async5.jpg differ diff --git a/img/router/async6.jpg b/img/router/async6.jpg new file mode 100644 index 0000000..ca012bb Binary files /dev/null and b/img/router/async6.jpg differ diff --git a/img/router/async7.jpg b/img/router/async7.jpg new file mode 100644 index 0000000..9915fd9 Binary files /dev/null and b/img/router/async7.jpg differ diff --git a/img/router/async8.jpg b/img/router/async8.jpg new file mode 100644 index 0000000..0472ee9 Binary files /dev/null and b/img/router/async8.jpg differ diff --git a/img/router/async9.jpg b/img/router/async9.jpg new file mode 100644 index 0000000..90e4ebb Binary files /dev/null and b/img/router/async9.jpg differ diff --git a/img/router/more.jpg b/img/router/more.jpg new file mode 100644 index 0000000..8352a6f Binary files /dev/null and b/img/router/more.jpg differ diff --git a/img/router/same1.jpg b/img/router/same1.jpg new file mode 100644 index 0000000..08d7f4c Binary files /dev/null and b/img/router/same1.jpg differ diff --git a/img/router/same2.jpg b/img/router/same2.jpg new file mode 100644 index 0000000..dcb7cad Binary files /dev/null and b/img/router/same2.jpg differ diff --git a/img/router/same4.jpg b/img/router/same4.jpg new file mode 100644 index 0000000..c53212a Binary files /dev/null and b/img/router/same4.jpg differ diff --git a/img/router/static1.jpg b/img/router/static1.jpg new file mode 100644 index 0000000..3c0eb14 Binary files /dev/null and b/img/router/static1.jpg differ diff --git a/img/router/static10.jpg b/img/router/static10.jpg new file mode 100644 index 0000000..bb5ad53 Binary files /dev/null and b/img/router/static10.jpg differ diff --git a/img/router/static11.jpg b/img/router/static11.jpg new file mode 100644 index 0000000..3b09583 Binary files /dev/null and b/img/router/static11.jpg differ diff --git a/img/router/static12.jpg b/img/router/static12.jpg new file mode 100644 index 0000000..797c72f Binary files /dev/null and b/img/router/static12.jpg differ diff --git a/img/router/static13.jpg b/img/router/static13.jpg new file mode 100644 index 0000000..370d360 Binary files /dev/null and b/img/router/static13.jpg differ diff --git a/img/router/static14.jpg b/img/router/static14.jpg new file mode 100644 index 0000000..6db9001 Binary files /dev/null and b/img/router/static14.jpg differ diff --git a/img/router/static15.jpg b/img/router/static15.jpg new file mode 100644 index 0000000..3e00ad3 Binary files /dev/null and b/img/router/static15.jpg differ diff --git a/img/router/static16.jpg b/img/router/static16.jpg new file mode 100644 index 0000000..e1b4102 Binary files /dev/null and b/img/router/static16.jpg differ diff --git a/img/router/static2.jpg b/img/router/static2.jpg new file mode 100644 index 0000000..e7e39ba Binary files /dev/null and b/img/router/static2.jpg differ diff --git a/img/router/static3.jpg b/img/router/static3.jpg new file mode 100644 index 0000000..d21e112 Binary files /dev/null and b/img/router/static3.jpg differ diff --git a/img/router/static4.jpg b/img/router/static4.jpg new file mode 100644 index 0000000..a42d310 Binary files /dev/null and b/img/router/static4.jpg differ diff --git a/img/router/static5.jpg b/img/router/static5.jpg new file mode 100644 index 0000000..3c4a261 Binary files /dev/null and b/img/router/static5.jpg differ diff --git a/img/router/static6.jpg b/img/router/static6.jpg new file mode 100644 index 0000000..a05984d Binary files /dev/null and b/img/router/static6.jpg differ diff --git a/img/router/static7.jpg b/img/router/static7.jpg new file mode 100644 index 0000000..7565adc Binary files /dev/null and b/img/router/static7.jpg differ diff --git a/img/router/static8.jpg b/img/router/static8.jpg new file mode 100644 index 0000000..81bd902 Binary files /dev/null and b/img/router/static8.jpg differ diff --git a/img/router/static9.jpg b/img/router/static9.jpg new file mode 100644 index 0000000..7db2688 Binary files /dev/null and b/img/router/static9.jpg differ diff --git a/img/sponsors/aitools.jpg b/img/sponsors/aitools.jpg new file mode 100644 index 0000000..04e7b24 Binary files /dev/null and b/img/sponsors/aitools.jpg differ diff --git a/img/sponsors/aitools.svg b/img/sponsors/aitools.svg new file mode 100644 index 0000000..c33b323 --- /dev/null +++ b/img/sponsors/aitools.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + + + + + + + diff --git a/img/support/addWx.jpg b/img/support/addWx.jpg new file mode 100644 index 0000000..58d6320 Binary files /dev/null and b/img/support/addWx.jpg differ diff --git a/img/support/ali.png b/img/support/ali.png new file mode 100644 index 0000000..e188595 Binary files /dev/null and b/img/support/ali.png differ diff --git a/img/support/alipay.png b/img/support/alipay.png new file mode 100644 index 0000000..0990cb7 Binary files /dev/null and b/img/support/alipay.png differ diff --git a/img/support/chrome_48x48.png b/img/support/chrome_48x48.png new file mode 100644 index 0000000..6a6d425 Binary files /dev/null and b/img/support/chrome_48x48.png differ diff --git a/img/support/edge_48x48.png b/img/support/edge_48x48.png new file mode 100644 index 0000000..e3ed827 Binary files /dev/null and b/img/support/edge_48x48.png differ diff --git a/img/support/firefox_48x48.png b/img/support/firefox_48x48.png new file mode 100644 index 0000000..3e1b89f Binary files /dev/null and b/img/support/firefox_48x48.png differ diff --git a/img/support/safari_48x48.png b/img/support/safari_48x48.png new file mode 100644 index 0000000..bcac3d7 Binary files /dev/null and b/img/support/safari_48x48.png differ diff --git a/img/support/wechat.png b/img/support/wechat.png new file mode 100644 index 0000000..a726f4d Binary files /dev/null and b/img/support/wechat.png differ diff --git a/img/support/wechatpay.png b/img/support/wechatpay.png new file mode 100644 index 0000000..e0adec6 Binary files /dev/null and b/img/support/wechatpay.png differ diff --git a/img/support/wx.jpg b/img/support/wx.jpg new file mode 100644 index 0000000..09dfa2f Binary files /dev/null and b/img/support/wx.jpg differ diff --git a/img/support/wx.png b/img/support/wx.png new file mode 100644 index 0000000..22a7cd4 Binary files /dev/null and b/img/support/wx.png differ diff --git a/img/tauri/1.jpg b/img/tauri/1.jpg new file mode 100644 index 0000000..2e4dd94 Binary files /dev/null and b/img/tauri/1.jpg differ diff --git a/img/type/_com1.jpg b/img/type/_com1.jpg new file mode 100644 index 0000000..4176d0b Binary files /dev/null and b/img/type/_com1.jpg differ diff --git a/img/type/_com1.png b/img/type/_com1.png new file mode 100644 index 0000000..045f66f Binary files /dev/null and b/img/type/_com1.png differ diff --git a/img/type/_com2.jpg b/img/type/_com2.jpg new file mode 100644 index 0000000..d7a56e3 Binary files /dev/null and b/img/type/_com2.jpg differ diff --git a/img/type/_com2.png b/img/type/_com2.png new file mode 100644 index 0000000..94a9300 Binary files /dev/null and b/img/type/_com2.png differ diff --git a/img/type/after.jpg b/img/type/after.jpg new file mode 100644 index 0000000..332bf19 Binary files /dev/null and b/img/type/after.jpg differ diff --git a/img/type/before.jpg b/img/type/before.jpg new file mode 100644 index 0000000..bfbc55c Binary files /dev/null and b/img/type/before.jpg differ diff --git a/img/type/shims-vue1.png b/img/type/shims-vue1.png new file mode 100644 index 0000000..3eaa0ff Binary files /dev/null and b/img/type/shims-vue1.png differ diff --git a/img/type/shims-vue2.jpg b/img/type/shims-vue2.jpg new file mode 100644 index 0000000..4891221 Binary files /dev/null and b/img/type/shims-vue2.jpg differ diff --git a/img/type/shims-vue3.jpg b/img/type/shims-vue3.jpg new file mode 100644 index 0000000..6a7feb7 Binary files /dev/null and b/img/type/shims-vue3.jpg differ diff --git a/img/type/whole.jpg b/img/type/whole.jpg new file mode 100644 index 0000000..f7c56cc Binary files /dev/null and b/img/type/whole.jpg differ diff --git a/img/ui.png b/img/ui.png new file mode 100644 index 0000000..617c56d Binary files /dev/null and b/img/ui.png differ diff --git a/img/watermarks/buildgood.jpg b/img/watermarks/buildgood.jpg new file mode 100644 index 0000000..e7ddc38 Binary files /dev/null and b/img/watermarks/buildgood.jpg differ diff --git a/img/watermarks/rbac.jpg b/img/watermarks/rbac.jpg new file mode 100644 index 0000000..11740c4 Binary files /dev/null and b/img/watermarks/rbac.jpg differ diff --git a/img/web.png b/img/web.png new file mode 100644 index 0000000..0a6e27c Binary files /dev/null and b/img/web.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..ca70210 --- /dev/null +++ b/index.html @@ -0,0 +1,45 @@ + + + + + + ronna-admin-doc + + + + + + + + + + +
ronna-admin-doc

支持这个项目

# ⚡ 反馈与交流

在使用过程中有任何问题和想法，请给我提 Issue (opens new window)。 +你也可以在Issue查看别人提的问题和给出解决方案。

或者加入我们的交流群：

群号: 891207826
+ Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
+ + + diff --git a/markmap/01.html b/markmap/01.html new file mode 100644 index 0000000..28665f6 --- /dev/null +++ b/markmap/01.html @@ -0,0 +1,126 @@ + + + + + + + + Markmap + + + + + + + + + + + + diff --git a/pages/1b12ed/index.html b/pages/1b12ed/index.html new file mode 100644 index 0000000..0fb41cc --- /dev/null +++ b/pages/1b12ed/index.html @@ -0,0 +1,40 @@ + + + + + + 支持这个项目 | ronna-admin-doc + + + + + + + + + + +
ronna-admin-doc

支持这个项目

如果您正在使用这个项目并感觉良好，或者是想支持我继续开发，您可以通过如下任意方式支持我：

  1. Star并分享 ronna-admin (opens new window) 🚀
  2. 通过以下二维码 一次性捐款，打赏作者一杯茶。🍵

谢谢！ ❤️

微信赞赏 微信 支付宝
赞赏码 Wechat QRcode Alipay QRcode

# 赞助商

如果您想支持本项目，奈何囊中羞涩，您可以花十几秒点击下方赞助商进入注册（只需微信扫码就可以），赞助商就会代您赞助一笔小钱。

# 成为赞助商

成为赞助商，即可将您的品牌LOGO及标语同时展示在：

  • GitHub仓库主页顶部
  • 官网首页顶部
  • 官网所有文档页左侧边栏顶部

主题官网平均每月约8w+浏览量 + GitHub仓库每月约1w+浏览量

联系方式: kunlong_luo@163.com

# 致谢

感谢给予支持的朋友，您的支持是我前进的动力 🎉

上次更新: 2024/04/05, 09:11:09
+ Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
+ + + diff --git a/pages/FAQ/index.html b/pages/FAQ/index.html new file mode 100644 index 0000000..9a94be8 --- /dev/null +++ b/pages/FAQ/index.html @@ -0,0 +1,478 @@ + + + + + + 常见问题 | ronna-admin-doc + + + + + + + + + + +
ronna-admin-doc
目录

常见问题

# 是否支持 IE ？

答：vue3 官方说过不支持 IE，具体看 rfcs (opens new window) 和 cn.vuejs (opens new window)。当然有人会说 @vitejs/plugin-legacy (opens new window) 会支持 IE，它的确会，但是它是一款 vite 插件，只对非 vue3 的框架进行支持，目前没有任何一款工具可以使 vue3 支持 IE 浏览器，如果您项目需要支持 IE，请慎重考虑使用本平台。如果您既要使用最新技术并且又想稳定又要兼容 IE 浏览器的话可以选择 vue2.7 的某个版本搭配 vue-cli 最新版本

# husky 是什么？可以删除 husky 提交前校验吗？如何彻底删除？

  • husky 是什么？
    +答：官方文档 (opens new window)

  • 可以删除 husky 提交前校验吗？
    +答：如果您们提交代码不需要严格的提交前校验，这当然可以删除

  • 如何彻底删除？
    +① 删除根目录 .husky 文件夹以及里面所有文件
    +② 删除根目录 commitlint.config.js 文件
    +③ 来到 package.json 下的 devDependencies ，删除 @commitlint/cli 、 @commitlint/config-conventional 、 @commitlint/types 、 husky 、 lint-staged 这些依赖
    +④ 最后来到 package.json 下的 scripts ，删除 "prepare": "husky" 命令即可

# 为什么使用 pnpm ？ pnpm 天生支持 monorepo，为什么平台不采用这种模式呢？可以不使用 pnpm 吗？如何从 pnpm 切换到 yarn ?

  • 为什么使用 pnpm？
    +① 节约磁盘空间并提升安装速度
    +当使用 npm 或 Yarn 时，如果您有 100 个项目使用了某个依赖，就会有 100 份该依赖的副本保存在硬盘上。 对于 pnpm ，依赖项将存储在一个内容可寻址的仓库中，因此：如果您用到了某依赖项的不同版本，那么只会将有差异的文件添加到仓库。例如，如果它有 100 个文件，而新版本只改变了其中 1 个文件。那么 pnpm update 只会向存储中心添加 1 个新文件，不会仅因为单一的改变而克隆整个依赖。所有文件都会存储在硬盘上的同一位置。 当多个包（package）被安装时，所有文件都会从同一位置创建硬链接，不会占用额外的磁盘空间。 这允许您跨项目地共享同一版本的依赖。最终您节省了大量与项目和依赖成比例的硬盘空间，并且拥有更快的安装速度！
    +② 创建非扁平化的 node_modules 文件夹
    +当使用 npm 安装依赖时，所有的依赖都会被提升到模块的根目录。 因此，项目可以访问到未被添加进 当前 项目的依赖。pnpm 使用软链的方式将项目的直接依赖添加进模块文件夹的根目录。

  • pnpm 天生支持 monorepo，为什么平台不采用这种模式呢？
    +答：我们先来简单介绍一下什么是 monorepo ，monorepos 指单一代码库，在版本控制系统的单个代码库里包含了许多项目的代码，与它对应的是 multirepos 多代码库，每个项目都储存在一个完全独立的、版本控制的代码库中。monorepo 可能并不适合大多数项目，毕竟大家习惯了多代码库开发，所以平台不采用这种模式。
    推荐文章:Monorepo 可能没您想象中那么香 (opens new window)

  • 可以不使用 pnpm 吗？
    +答：可以的

  • 如何从 pnpm 替换到 yarn（ npm 替换方法同下）
    +替换方法：来到根目录 package.json 文件，删除 "pnpm": ">= 6" 和 "preinstall": "npx only-allow pnpm" ，然后将 pnpm 全部换成 yarn 即可

注意

ronna-admin 在 3.5.0 版本移除了 cross-env，采用 pnpm 中 shell-emulator (opens new window)这个配置项替代。如果您替换成了 yarn 或者 npm ，则需要安装 cross-env，还原此处的代码即可 commit (opens new window)

# 平台出现报错 Cannot find module '@zougt/some-loader-utils'

  • 为什么会出现 Cannot find module '@zougt/some-loader-utils'
    +答：平台路径请不要使用中文命名！！！会造成解析乱码！！！请使用全英文路径！！！

# 平台出现报错 Access is denied（windows 常见）

error

  • 解决办法：请遵循平台要求，安装对应的 node 和 pnpm 版本 ( node 16 版本及以上、pnpm 6 版本及以上)

# 安装依赖时出现报错 Cannot find module 'sass'

答：删除平台的 pnpm-lock.yaml 和 node_modules ，重新执行命令 pnpm install 安装依赖即可。（重点：文件存放路径不要带有中文）

# 动态路由刷新出现警告 ⚠️

  • 为什么会出现警告？会不会影响使用？
    +答：这个警告是 vue-router 作者故意留下的，咱也不知道为啥，详情看 issues (opens new window)。不会影响使用，功能一切表现正常，平台打包部署到生产环境就不会出现警告了。 +已通过 vite-plugin-router-warn (opens new window) 解决。

# 平台出现警告 rank only the home page can be 0 ⚠️

rank

答：路由 meta 里的 rank 字段只有 home 路由才能是 0 ，其他均不能为 0 。作为一种规范，rank 字段最好唯一。rank 字段代表菜单的排序，而且只能是顶级菜单进行排序，也就是最外层的菜单，为什么这么设计呢。详见issues/154 (opens new window)。

# 为什么平台使用 lodash-unified ，而不是使用 lodash-es 呢？

答：其实 lodash-unified 只是对 lodash-es 做了 ESM (ESModule)格式支持并兼容 CJS (CommonJS)格式，vite 又是使用原生 ESM 文件快速启动。这里需要注意的是 lodash-unified 和 lodash-es 需要同时安装。
+用法：import { sum } from "lodash-unified"。

# 为什么平台使用手动按需引入，而不是使用 unplugin-vue-components 插件自动按需引入呢？

答：我尝试将 unplugin-element-plus 替换成 unplugin-vue-components ，但似乎 unplugin-vue-components 表现不是太好，整体来说有些问题，可以看看 unplugin-vue-components/issues (opens new window) 了解一下，而且 unplugin-vue-components 不是为 element-plus 特供的产物，毕竟 vite 等工具还在高速发展，可能会出现一些莫名的问题影响项目，我之前碰到过开发环境没事，打包就凉了（这里是 vite 某个版本的问题），这很坑，所以我感觉手动按需引入更有安全感，毕竟迭代了这么多版本，unplugin-element-plus 没出过问题。所以整体来说平台都把很多坑都踩过了，毕竟提供很多人使用，平台应该有这个责任在使用最新技术前进行调研，并在综合考虑下保留相对稳定的东西，给平台带来稳定。当然您也可自行替换成 unplugin-vue-components 插件自动按需引入。

# 为什么平台采用全局引入 element-plus ，而不是按需引入呢？ 全局引入带来打包冗余，如何处理？ 如何改成按需引入？

  • 为什么平台采用全局引入 element-plus ，而不是按需引入呢？
    +答：① 经过多次实践，按需引入一个组件库的话，vite 的预编译的时间有点长（尤其是性能低的电脑或者您开了很多程序导致 cpu 占用过高），所以我们采用了全局引入的方式，不再让它预编译，而是直接加载整个包。② 按需引入会出现 new dependencies optimized 的情况，这个情况一旦出现就会使得页面重新加载，如下图，开发体验不好。

optimized +上图的问题，估计是 vite 还需进行优化，下图是来自 vite 官方开发者的回复issues (opens new window) vite

  • 全局引入带来打包冗余，如何处理？
    +答：全局引入，打包不会在进行 tree shanking ，带来未引用的代码也打包进来，造成冗余问题。如何解决呢。目前来说只能在打包时，平台改用 unplugin-element-plus 插件按需引入模式，开发时，再换成全局引入。

  • 如何改成按需引入？
    +① 安装 unplugin-element-plus ，执行命令：

      pnpm add unplugin-element-plus -D
+

    ep1 +② 来到根目录 build/plugins.ts 文件，去掉 import ElementPlus from "unplugin-element-plus/vite"; 和 ElementPlus({}), 的代码注释
    ep2 +③ 来到根目录 src/main.ts 文件，注释 import ElementPlus from "element-plus"; ，添加 import { useElementPlus } from "/@/plugins/element-plus"; ，将 use(ElementPlus) 替换成 use(useElementPlus) ep3 +④ 千万别忘记，把用到的 element-plus 组件引入到根目录 src/plugins/element-plus/index.ts 文件中

# vertical 模式下左侧菜单卡顿，如何解决？菜单切换卡顿？

  • vertical 模式下左侧菜单卡顿，如何解决？
    +答：这个问题大多数出现在 windows 上，特别是电脑性能低或者双屏的模式下。我的电脑从未出现过卡顿的情况。下图是我的电脑信息

mac

element-plus 的 menu 在上述的情况可能会出现卡顿。

两种解决办法：

① 从软件上解决：来到 public/platform-config.json (opens new window) 设置 MenuArrowIconNoTransition 为 true 即可以解决，当然平台已经设置过了。菜单经过测试在谷歌浏览器 92 到 94 版本是不卡顿的，谷歌浏览器版本下载地址 chromedownloads (opens new window)，卡顿是这个 transform: rotateZ(180deg) (opens new window) 造成的，貌似是谷歌的 bug (opens new window) 吧
+② 从硬件上解决：运行 window + x 打开计算机管理界面，找到设备管理器(或者英文 Device Manager)，打开显示适配器(或者英文 Display Adapters)，如果列表内展示的有 Inter(R) HD Graphics，则说明此电脑具有集成显卡，禁用掉此项（集成显卡），将独立显卡开启满载状态。Windows 怎么禁用集成显卡 (opens new window)

  • 菜单切换卡顿？
    +答：有人问平台演示环境菜单切换卡顿，是什么问题？
    +① 首先，平台的演示环境使用的是 github (opens new window) ，一个免费的静态网站部署服务，切换菜单的时候，需要加载网络资源，走了请求，响应越慢，页面显示的越慢。
    +② 其次，本地运行平台的完整版，有的菜单切换卡顿，因为也要加载资源啊，比如地图什么的，当前页面加载资源越大，正常情况下响应就越慢，这是最基本的知识哦。

# 浏览器控制台打印一些重复信息，很影响开发体验，如何解决？

log

答：如下图所示，触发了 vite 的 hmr update 就会在控制台输出相对应的信息 issues (opens new window) ，有时候输出的信息对于我们来说并没有用，是否可以屏蔽掉这些信息呢？当然可以，在浏览器控制台过滤框中输入您不需要的信息并在最前面加上 - 即可。浏览器控制台过滤无用的提示和报错 (opens new window) 推荐文章

hotlog

# vue3 的 <script setup> 写法，虽然会依据它的文件名来自动推断组件名称 name，但这也约束了我们的写法，不算灵活，有没有解决方案呢？

答：有的。有人在 vue 上提了这个 issues：use <script setup name="cpnName"> instead of two <script>，这种写法无疑是非常方便的，但是被尤大否决了，具体可看 issues (opens new window)，不过周边生态出了个插件 unplugin-vue-define-options (opens new window) 可以在一个 setup 里加入 name ，很方便。用法如下

<script setup lang="ts">
+defineOptions({
+  name: "页面名称"
+});
+</script>
+

目前vue官方已支持 defineOptions (opens new window)

# vue3 单文件支持多个根标签，但是平台为什么不能这么用呢？如何解决？

  • 平台为什么不能这么用呢？
    +答：因为平台用了 vue3 中 Transition 组件包裹整个内容区，这样才能带来各种页面切换效果。但是 Transition 仅支持单个元素或组件作为其插槽内容。如果内容是一个组件，则该组件也必须只有一个根元素，所以这才要求内容区里的单文件要在最外层加上一个根元素，详情看 TIP (opens new window) vue3文档

  • 如何解决？
    +答：如果想内容区的单文件支持多个根元素，可以来到这里 appMain.vue (opens new window) 将 Transition 以及相关地方删除，不在要页面内容过渡效果了。

# 不同项目的本地存储设置可能不同（页面效果不同），那么如何避免 fork 项目的本地存储 key 值一样呢？

namespace

  • 如何避免？
    +答：可以在 此处 (opens new window) 修改 ResponsiveStorageNameSpace 为您所需的命名空间即可

# 平台要求 node 版本应不小于 18.18.0 、pnpm 版本应不小于 8.6.10 ，但是实际开发有的项目需要比这些低的版本怎么解决呢？

答：推荐阅读 三款非常实用的 Node.js 版本管理工具 (opens new window)

# 打包时报 Unexpected token，如下图（来自群友提供）

unexpected

首先请您 不要 用 中文路径名，然后我们来解答一下

答：这里报错来自于 vite-plugin-remove-console (opens new window)，当 console.log 写法不规范或者这个文件是压缩格式时就会出现这种报错，请在 external 中排除这个 console.log 出现的文件，参考 removeConsole (opens new window)

# 安装依赖慢，如何解决？

可能您刚接触到 ronna-admin 会有个疑问，为什么平台使用了 pnpm 可是安装平台依赖的时候还是等了很长时间呢？

答：首先我觉得您可以认真看下 pnpm 哦。其次，pnpm 只会在项目依赖包从本地找不到对应版本的情况下，才会去 npm (opens new window) 下载，既然是 npm 下载的话，它肯定是国外镜像，下载慢就很正常了。下面讲下解决办法：

① 使用下面命令查看当前 npm 源

npm config ls
+

执行完上面的命令后，在您没有设置过任何源的情况下，默认是 npmjs (opens new window) 官方源，如下图

npm

② 不管是什么源，我们都可以不用管，直接执行下面命令即可

npm config set registry https://registry.npmmirror.com
+

上面的命令是将本地的源换成国内源 npmmirror (opens new window)，经过几轮测试，发现它的下载速度快且同步率高，同步频率 10 分钟一次，如果您之前的源是这个 http://registry.npm.taobao.org ，那您必须换成 npmmirror 啦，因为原淘宝 npm 域名即将停止解析 具体了解 (opens new window)
+执行完上面的命令后再使用 ① 中的命令查看本地源，如下图

npm

③ 当我们将本地源换成 npmmirror 后，再回到 ronna-admin 平台，将 pnpm-lock.yaml 和 node_modules 这两个文件删除，然后执行下面的命令重新安装依赖，您就会发现安装速度很快啦

pnpm install
+

如果您不删除上面提到的两个文件就会遇到如下图的报错

npm

提示

如果您本地有自己维护的 npm 包，请在发包前使用下面命令将本地源换成 npm 官方源，这样才能保证您发包成功，发完之后再换成 npmmirror 源即可。同理，如何您公司有私服的话，也是如此操作，只不过把下面命令 registry 后的地址换成私服的地址即可。如何部署私服可参考 该文章 (opens new window)

npm config set registry https://registry.npmjs.org
+

当然第二种办法也是最方便的办法就是将下面代码加入到您自己库的 package.json 里 查看具体参考 (opens new window)

"publishConfig": {
+  "registry": "https://registry.npmjs.org/"
+}
+

# 安装 vue 的某些版本，页面卡顿明显，如何解决？

答：vue v3.2.41 及以上版本和 Vue.js devtools v6.4.5 两者一起使用，页面卡顿明显，尤其当页面元素多以及同一时刻操作较多元素是最为明显。解决办法：卸载 Vue.js devtools 这款浏览器插件，卸载后，页面比之前操作还流畅 🐶。这足以看出 Vue.js devtools 影响还是很大的，可以尝试不依赖 Vue.js devtools，我这些年用 vue 基本不用 Vue.js devtools，毕竟浏览器的断点调试足够了，当然这也可以锻炼您的思维能力

# 平台出现报错 global is not defined

答：可能是您引入某个库的问题，比如 aws-sdk-js (opens new window)，解决办法就是将 src/utils/globalPolyfills.ts (opens new window) 引入 src/main.ts (opens new window)

# 平台如何置灰并且不影响操作？

展开查看实现代码

grey

* { filter: grayscale(100%); }
+
+import { toggleClass } from "@pureadmin/utils";
+
+beforeCreate() {
+  toggleClass(true, "html-grey", document.querySelector("html"));
+},
+

# 平台在使用 element-plus 的 el-dialog、el-drawer、el-message-box、el-notification 这四个组件时，右上角关闭图标的样式跟 element-plus 本身表现不一致？

答：在平台 3.9.2 版本，我把样式覆盖了，使其表现更鲜明（细心的小伙伴会发现 vscode 好多操作鼠标覆盖上去也是这种样式风格 🤗️），具体代码修改位置 第一处 (opens new window)、第二处 (opens new window)，如果想保持一致删除对应改动处即可

展开查看平台当前这四个组件右上角关闭图标的样式

dialog dialog-dark

drawer drawer-dark

messagebox messagebox-dark

notification notification-dark

# 平台在 v3.9.4 版本完全移除了 vxe-table，为什么移除？如何自行集成？

  • 为什么移除？

答：请点击这里查看原因 (opens new window)

  • 如何自行集成？
点击查看
  1. 安装 vxe-table、xe-utils
pnpm add vxe-table xe-utils
+

  1. 将 vxe-table 和 xe-utils 加入 build/optimize.ts 文件的 include 里

  2. 安装 font-awesome

pnpm add font-awesome -D
+
  1. 在 src/layout/index.vue 文件的 <script setup lang="ts"></script> 引入 font-awesome，如下
<script setup lang="ts">
+// vxe-table的所有icon不支持component模式，间接依赖了font-awesome
+import "font-awesome/css/font-awesome.min.css";
+</script>
+
  1. 将下面样式加入 src/style/index.scss 文件
/* 重置 vxe-table 样式 */
+.vxe-button.type--button.theme--primary:hover,
+.vxe-pager .vxe-pager--num-btn:not(.is--disabled).is--active {
+  color: #fff !important;
+}
+
  1. 将下面样式加入 src/style/dark.scss 文件
/* vxe-table 暗黑模式适配 */
+.vxe-table--header-wrapper,
+.vxe-table--body-wrapper {
+  color: var(--el-text-color-primary);
+  background: var(--el-bg-color) !important;
+}
+
+.vxe-table--render-default.border--full .vxe-header--column,
+.vxe-table--render-default.border--full .vxe-body--column,
+.vxe-table--render-default.border--full .vxe-footer--column {
+  background-image: linear-gradient(
+      var(--el-border-color-lighter),
+      var(--el-border-color-lighter)
+    ),
+    linear-gradient(
+      var(--el-border-color-lighter),
+      var(--el-border-color-lighter)
+    );
+}
+
+/* 表头 */
+.vxe-table--header-wrapper {
+  background: #262727 !important;
+}
+
+.vxe-table--render-wrapper,
+.vxe-table--main-wrapper {
+  border: none;
+}
+
+.vxe-pager.is--perfect,
+.vxe-table--render-default .vxe-table--border-line {
+  border: 1px solid var(--el-border-color-lighter);
+}
+
+.vxe-table--header-border-line {
+  border-bottom: 1px solid var(--el-border-color-lighter) !important;
+}
+
+.vxe-body--row.row--hover,
+.vxe-pager {
+  background-color: #262727;
+}
+
+.vxe-input--inner,
+.vxe-pager .vxe-pager--jump-prev,
+.vxe-pager .vxe-pager--prev-btn,
+.vxe-pager .vxe-pager--next-btn,
+.vxe-pager .vxe-pager--jump-next,
+.vxe-pager .vxe-pager--num-btn,
+.vxe-pager .vxe-pager--jump .vxe-pager--goto {
+  background-color: transparent;
+  color: var(--el-text-color-primary);
+  // outline: none !important;
+}
+
+.vxe-select-option--wrapper {
+  background: var(--el-bg-color) !important;
+}
+
+.vxe-select-option:not(.is--disabled).is--hover {
+  background: var(--el-color-primary-light-6) !important;
+}
+
+.vxe-modal--wrapper.type--modal .vxe-modal--box,
+.vxe-modal--wrapper.type--alert .vxe-modal--box,
+.vxe-modal--wrapper.type--confirm .vxe-modal--box,
+.vxe-form {
+  background: var(--el-bg-color) !important;
+}
+
+.vxe-modal--box,
+.vxe-modal--header {
+  border: none;
+  background: var(--el-bg-color) !important;
+}
+
+.vxe-modal--title,
+.vxe-button--content,
+.vxe-modal--header-title {
+  color: var(--el-text-color-primary);
+}
+
+.vxe-button.type--button:hover {
+  background: var(--el-color-primary) !important;
+}
+
+.vxe-button {
+  background-color: transparent;
+}
+
  1. 使用下面代码直接替换 src/layout/theme/index.ts 里的所有代码
/**
+ * @description ⚠️：此文件仅供主题插件使用，请不要在此文件中导出别的工具函数（仅在页面加载前运行）
+ */
+
+import { EpThemeColor } from "../../../public/platform-config.json";
+
+type MultipleScopeVarsItem = {
+  scopeName: string;
+  varsContent: string;
+};
+
+/** 将vxe默认主题色和ep默认主题色保持一致 */
+const vxeColor = EpThemeColor;
+/** 预设主题色 */
+const themeColors = {
+  default: {
+    vxeColor,
+    subMenuActiveText: "#fff",
+    menuBg: "#001529",
+    menuHover: "#4091f7",
+    subMenuBg: "#0f0303",
+    subMenuActiveBg: "#4091f7",
+    menuText: "rgb(254 254 254 / 65%)",
+    sidebarLogo: "#002140",
+    menuTitleHover: "#fff",
+    menuActiveBefore: "#4091f7"
+  },
+  light: {
+    vxeColor,
+    subMenuActiveText: "#409eff",
+    menuBg: "#fff",
+    menuHover: "#e0ebf6",
+    subMenuBg: "#fff",
+    subMenuActiveBg: "#e0ebf6",
+    menuText: "#7a80b4",
+    sidebarLogo: "#fff",
+    menuTitleHover: "#000",
+    menuActiveBefore: "#4091f7"
+  },
+  dusk: {
+    vxeColor: "#f5222d",
+    subMenuActiveText: "#fff",
+    menuBg: "#2a0608",
+    menuHover: "#e13c39",
+    subMenuBg: "#000",
+    subMenuActiveBg: "#e13c39",
+    menuText: "rgb(254 254 254 / 65.1%)",
+    sidebarLogo: "#42090c",
+    menuTitleHover: "#fff",
+    menuActiveBefore: "#e13c39"
+  },
+  volcano: {
+    vxeColor: "#fa541c",
+    subMenuActiveText: "#fff",
+    menuBg: "#2b0e05",
+    menuHover: "#e85f33",
+    subMenuBg: "#0f0603",
+    subMenuActiveBg: "#e85f33",
+    menuText: "rgb(254 254 254 / 65%)",
+    sidebarLogo: "#441708",
+    menuTitleHover: "#fff",
+    menuActiveBefore: "#e85f33"
+  },
+  yellow: {
+    vxeColor: "#fadb14",
+    subMenuActiveText: "#d25f00",
+    menuBg: "#2b2503",
+    menuHover: "#f6da4d",
+    subMenuBg: "#0f0603",
+    subMenuActiveBg: "#f6da4d",
+    menuText: "rgb(254 254 254 / 65%)",
+    sidebarLogo: "#443b05",
+    menuTitleHover: "#fff",
+    menuActiveBefore: "#f6da4d"
+  },
+  mingQing: {
+    vxeColor: "#13c2c2",
+    subMenuActiveText: "#fff",
+    menuBg: "#032121",
+    menuHover: "#59bfc1",
+    subMenuBg: "#000",
+    subMenuActiveBg: "#59bfc1",
+    menuText: "#7a80b4",
+    sidebarLogo: "#053434",
+    menuTitleHover: "#fff",
+    menuActiveBefore: "#59bfc1"
+  },
+  auroraGreen: {
+    vxeColor: "#52c41a",
+    subMenuActiveText: "#fff",
+    menuBg: "#0b1e15",
+    menuHover: "#60ac80",
+    subMenuBg: "#000",
+    subMenuActiveBg: "#60ac80",
+    menuText: "#7a80b4",
+    sidebarLogo: "#112f21",
+    menuTitleHover: "#fff",
+    menuActiveBefore: "#60ac80"
+  },
+  pink: {
+    vxeColor: "#eb2f96",
+    subMenuActiveText: "#fff",
+    menuBg: "#28081a",
+    menuHover: "#d84493",
+    subMenuBg: "#000",
+    subMenuActiveBg: "#d84493",
+    menuText: "#7a80b4",
+    sidebarLogo: "#3f0d29",
+    menuTitleHover: "#fff",
+    menuActiveBefore: "#d84493"
+  },
+  saucePurple: {
+    vxeColor: "#722ed1",
+    subMenuActiveText: "#fff",
+    menuBg: "#130824",
+    menuHover: "#693ac9",
+    subMenuBg: "#000",
+    subMenuActiveBg: "#693ac9",
+    menuText: "#7a80b4",
+    sidebarLogo: "#1f0c38",
+    menuTitleHover: "#fff",
+    menuActiveBefore: "#693ac9"
+  }
+};
+
+/**
+ * @description 将预设主题色处理成主题插件所需格式
+ */
+export const genScssMultipleScopeVars = (): MultipleScopeVarsItem[] => {
+  const result = [] as MultipleScopeVarsItem[];
+  Object.keys(themeColors).forEach(key => {
+    result.push({
+      scopeName: `layout-theme-${key}`,
+      varsContent: `
+        $vxe-primary-color: ${themeColors[key].vxeColor} !default;
+        $subMenuActiveText: ${themeColors[key].subMenuActiveText} !default;
+        $menuBg: ${themeColors[key].menuBg} !default;
+        $menuHover: ${themeColors[key].menuHover} !default;
+        $subMenuBg: ${themeColors[key].subMenuBg} !default;
+        $subMenuActiveBg: ${themeColors[key].subMenuActiveBg} !default;
+        $menuText: ${themeColors[key].menuText} !default;
+        $sidebarLogo: ${themeColors[key].sidebarLogo} !default;
+        $menuTitleHover: ${themeColors[key].menuTitleHover} !default;
+        $menuActiveBefore: ${themeColors[key].menuActiveBefore} !default;
+      `
+    } as MultipleScopeVarsItem);
+  });
+  return result;
+};
+
  1. 新建文件夹，起名 vxe-table ，然后添加 index.scss 和 index.ts 这两个文件到 vxe-table 文件夹里，如下
  • vxe-table 文件夹
  • index.scss 文件
@import "vxe-table/styles/variable.scss";
+@import "vxe-table/styles/modules.scss";
+
+i {
+  border-color: initial;
+}
+
  • index.ts 文件
import "xe-utils";
+import "./index.scss";
+import XEUtils from "xe-utils";
+import { App, unref } from "vue";
+import { i18n } from "@/plugins/i18n";
+import zh from "vxe-table/lib/locale/lang/zh-CN";
+import en from "vxe-table/lib/locale/lang/en-US";
+
+import {
+  // 核心
+  VXETable,
+  // 表格功能
+  Icon,
+  Filter,
+  Edit,
+  Menu,
+  Export,
+  Keyboard,
+  Validator,
+  // 可选组件
+  Column,
+  Colgroup,
+  Grid,
+  Tooltip,
+  Toolbar,
+  Pager,
+  Form,
+  FormItem,
+  FormGather,
+  Checkbox,
+  CheckboxGroup,
+  Radio,
+  RadioGroup,
+  RadioButton,
+  Switch,
+  Input,
+  Select,
+  Optgroup,
+  Option,
+  Textarea,
+  Button,
+  Modal,
+  List,
+  Pulldown,
+  // 表格
+  Table
+} from "vxe-table";
+
+// 全局默认参数
+VXETable.setup({
+  size: "medium",
+  version: 0,
+  zIndex: 1002,
+  table: {
+    // 自动监听父元素的变化去重新计算表格
+    autoResize: true,
+    // 鼠标移到行是否要高亮显示
+    highlightHoverRow: true
+  },
+  input: {
+    clearable: true
+  },
+  i18n: (key, args) => {
+    return unref(i18n.global.locale) === "zh"
+      ? XEUtils.toFormatString(XEUtils.get(zh, key), args)
+      : XEUtils.toFormatString(XEUtils.get(en, key), args);
+  },
+  translate(key) {
+    const NAMESPACED = ["el.", "buttons."];
+    if (key && NAMESPACED.findIndex(v => key.includes(v)) !== -1) {
+      return i18n.global.t.call(i18n.global.locale, key);
+    }
+    return key;
+  }
+});
+
+export function useTable(app: App) {
+  app
+    .use(Icon)
+    .use(Filter)
+    .use(Edit)
+    .use(Menu)
+    .use(Export)
+    .use(Keyboard)
+    .use(Validator)
+    // 可选组件
+    .use(Column)
+    .use(Colgroup)
+    .use(Grid)
+    .use(Tooltip)
+    .use(Toolbar)
+    .use(Pager)
+    .use(Form)
+    .use(FormItem)
+    .use(FormGather)
+    .use(Checkbox)
+    .use(CheckboxGroup)
+    .use(Radio)
+    .use(RadioGroup)
+    .use(RadioButton)
+    .use(Switch)
+    .use(Input)
+    .use(Select)
+    .use(Optgroup)
+    .use(Option)
+    .use(Textarea)
+    .use(Button)
+    .use(Modal)
+    .use(List)
+    .use(Pulldown)
+    // 安装表格
+    .use(Table);
+}
+

9.最后一步，将下面代码添加到 src/main.ts 文件，然后您就可以按照 vxetable (opens new window) 文档去使用啦

import { useTable } from "@/plugins/vxe-table";
+
+// 记得要用 app.use 注册下哦
+app.use(useTable)
+

具体修改记录

点击查看完整版具体修改记录 (opens new window)
点击查看非国际化精简版具体修改记录 (opens new window)
点击查看国际化精简版具体修改记录 (opens new window)

# 平台在 v3.9.5 版本完全移除了 lodash 和其相关库，为什么移除？如何自行集成？

  • 为什么移除？

答：请点击这里查看原因 (opens new window)

  • 如何自行集成？
点击查看
  1. 安装 lodash、lodash-es、lodash-unified
pnpm add lodash lodash-es lodash-unified
+
  1. 安装 @types/lodash、@types/lodash-es
pnpm add @types/lodash @types/lodash-es -D
+

  1. 将 lodash、lodash-es、lodash-unified 这三个库加入到 include (opens new window)

  2. 如果需要在生产环境使用 lodash cdn ，将下面代码加入到 modules (opens new window)

{
+  name: "lodash",
+  var: "lodash",
+  // 可写`完整路径`，会替换`prodUrl`
+  path: "https://cdn.bootcdn.net/ajax/libs/lodash.js/4.17.21/lodash.min.js"
+}
+
  1. 最后直接使用 lodash-unified 即可，如下代码
import { cloneDeep } from "lodash-unified"
+

# mac 版本的向日葵无法远程操控？向日葵总是闪退、打不开？

答：mac 版本的向日葵无法远程操控请参考下图解决

xrk1

答：向日葵总是闪退、打不开请参考下图解决

xrk2

# 初次拉取项目，使用 vscode 编辑器时代码出现 eslint 报错，如下图

eslint

答：解决办法如下图，来自 issues/953 (opens new window)

eslint1

上次更新: 2024/04/05, 09:11:09
vite预构建
非平台问题跟踪记录

+ ← + 非平台问题跟踪记录→ +

+ Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
+ + + diff --git a/pages/RBAC/index.html b/pages/RBAC/index.html new file mode 100644 index 0000000..9d50aef --- /dev/null +++ b/pages/RBAC/index.html @@ -0,0 +1,53 @@ + + + + + + RBAC权限 | ronna-admin-doc + + + + + + + + + + +
ronna-admin-doc
目录

RBAC权限

所谓 RBAC（Role Based Access Control）权限指的是基于角色的访问控制

rbac

# 用户

平台用 mock 模拟出两个账号，一个是 admin (opens new window)，另一个是 common (opens new window)，用户名字段为 username ，为字符串类型，当然平台将用户名在 pinia 的 state (opens new window) 里存了一份

# 角色

平台用 mock 模拟出两个角色，一个是 admin (opens new window)，另一个是 common (opens new window)，角色存放在 roles 字段中，为数组类型，可支持多个角色，当然平台将 当前登录用户的角色 在 pinia 的 state (opens new window) 里也存了一份

# 权限

整体分为 粗粒度权限 和 细粒度权限

# 粗粒度权限

# 菜单权限

# 实现原理、代码

页面整体的菜单存放在 wholeMenus (opens new window)，所以我们只需要控制 wholeMenus 就能控制菜单的显示、隐藏。通过 filterNoPermissionTree (opens new window) 函数从菜单中过滤无权限的菜单

# 如何配置

只需要通过返回路由的 roles 配置项，赋予该菜单权限即可，如下图

roles

实现细节

将菜单与路由解藕，这样可以更灵活的控制二者，不会造成一方改动必会影响另一方

# url 链接权限

# 实现原理、代码

平台在路由的 beforeEach (opens new window) 钩子函数中，通过对比当前用户的角色和当前路由中 roles 字段来判断是否有无权限，无权限跳转 403 (opens new window) 页面

# 如何配置

您不需要做任何配置，只需要像上图一样配置好权限就行，平台会根据有无权限自行判断，如下面视频，当有 admin 权限时可以看到系统管理目录以及里面的菜单页面并且可以通过 url 跳转，当然也可以在 菜单搜索 (opens new window) 中找到，当无 admin 权限时反之

# 按钮、组件、类方法权限

针对这三类权限判断，平台提供三种方法 组件方式判断权限、函数方式判断权限、指令方式判断权限

在使用这三种方法前，需要通过返回路由的 auths 配置项，赋予该页面按钮级别权限，如下图

auths

# 组件方式判断权限
  • 按钮、组件权限可用
# 实现原理、代码

通过 hasAuth (opens new window) 函数，进行权限组件的封装，使用 Vue 提供的 Fragment (opens new window) 标签进行包裹，这样可让被包裹的组件无多余标签，减少渲染成本。查看具体代码 (opens new window)

# 如何配置

具体参考 views/permission/button/index.vue (opens new window)

<Auth value="btn_add">
+  <el-button type="success"> 拥有code：'btn_add' 权限可见 </el-button>
+</Auth>
+

提示

平台已经全局注册 Auth (opens new window) 组件，无需重复注册

# 函数方式判断权限
  • 按钮、组件、类方法权限都可用
# 实现原理、代码

通过 hasAuth (opens new window) 函数判断某些按钮、组件、类方法是否有按钮级别的权限

# 如何配置

具体参考 views/permission/button/index.vue (opens new window)

<el-button type="success" v-if="hasAuth('btn_add')">
+  拥有code：'btn_add' 权限可见
+</el-button>
+
hasAuth("btn_add") ? "显示" : "隐藏";
+
# 指令方式判断权限
  • 按钮、组件权限可用。指令方式不能动态修改权限
# 实现原理、代码

通过 hasAuth (opens new window) 函数，进行权限指令的封装。查看具体代码 (opens new window)

# 如何配置

具体参考 views/permission/button/index.vue (opens new window)

<el-button type="success" v-auth="'btn_add'">
+  拥有code：'btn_add' 权限可见
+</el-button>
+

# 细粒度权限

# 数据权限

数据权限对页面的要求就非常简单了，比如可以将数据权限的配置功能放在 角色管理 页面进行配置即可

上次更新: 2024/04/05, 09:11:09
Tailwind CSS
类型声明

+ ← + 类型声明→ +

+ Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
+ + + diff --git a/pages/build/index.html b/pages/build/index.html new file mode 100644 index 0000000..a5a5796 --- /dev/null +++ b/pages/build/index.html @@ -0,0 +1,173 @@ + + + + + + 打包和部署 | ronna-admin-doc + + + + + + + + + + +
ronna-admin-doc
目录

打包和部署

# 本地环境打包预览

pnpm preview:build
+

# 预发布打包

.env.staging (opens new window) 文件为预发布打包前的配置文件，预发布 (opens new window) vite文档

pnpm build:staging
+

# 正式环境打包

.env.production (opens new window) 文件为正式环境打包前的配置文件

pnpm build
+

# 打包分析

pnpm report
+

report

# 平台文件、语言分析

分析平台采用了哪些语言以及代码量

pnpm cloc
+

image-cloc

打包优化

点击查看更多 打包优化

# 部署

# nginx

在 http 请求篇，平台主推使用 nginx 部署，因为可以满足绝大多数场景，下面我们讲一下如何配置

# 打包

平台提供了全局打包路径 VITE_PUBLIC_PATH (opens new window) ，默认 /，可根据需求自行修改。比如平台的预览地址是 https://github.com/ronnaces/ronna-admin/#/login，可以看到根目录 https://github.com/ronnaces 后面又跟了个 /ronna-admin/ 子目录，那么我们打包时就应该把 VITE_PUBLIC_PATH 改成 /ronna-admin/，然后执行 pnpm build 就行，打包完后观察平台根目录会多出个 dist 目录，如下图

dist-small

# nginx 配置

拿 mac 举例，配置都一样，可能您们对应的目录不一样，根据实际情况修改即可

① 上面打包好后，来到 /usr/local/var/www 目录下，将打包后 dist 文件里的静态资源都放进去即可，如下图

dist

② 比如我们在 vite.config.ts 配置了两个后端地址，如下

proxy: {
+  // 第一个代理后端地址
+  "/api": {
+    target: "http://127.0.0.1:3000",
+    changeOrigin: true,
+    rewrite: path => path.replace(/^\/api/, "")
+  },
+  // 第二个代理后端地址
+  "/otherApi": {
+    target: "http://127.0.0.1:3290",
+    changeOrigin: true,
+    rewrite: path => path.replace(/^\/otherApi/, "")
+  },
+}
+

来到 /usr/local/etc/nginx/nginx.conf 这个 nginx 的配置文件，修改成如下配置即可

nginx.config

location / {
+    root   html;
+    index  index.html index.htm;
+    # 用于配合前端路由为h5模式使用，防止刷新404 https://router.vuejs.org/zh/guide/essentials/history-mode.html#nginx
+    try_files $uri $uri/ /index.html;
+}
+
+# 第一个代理后端地址（vite.config.ts里叫 /api，这里也要保持一致）
+location /api {
+    # 如果后端在本地比如127.0.0.1或者localhost请解开下面的rewrite注释即可
+    # rewrite  ^.+api/?(.*)$ /$1 break;
+    # 这里填写后端地址（后面一定不要忘记添加 / ）
+    proxy_pass http://127.0.0.1:3000/;
+    proxy_set_header Host $host;
+    proxy_set_header Cookie $http_cookie;
+    proxy_set_header X-Real-IP $remote_addr;
+    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+    proxy_redirect default;
+    add_header Access-Control-Allow-Origin *;
+    add_header Access-Control-Allow-Headers X-Requested-With;
+    add_header Access-Control-Allow-Methods GET,POST,OPTIONS;
+}
+
+# 第二个代理后端地址（vite.config.ts里叫 /otherApi，这里也要保持一致）
+location /otherApi {
+    # 如果后端在本地比如127.0.0.1或者localhost请解开下面的rewrite注释即可
+    # rewrite  ^.+otherApi/?(.*)$ /$1 break;
+    # 这里填写后端地址（后面一定不要忘记添加 / ）
+    proxy_pass http://127.0.0.1:3290/;
+    proxy_set_header Host $host;
+    proxy_set_header Cookie $http_cookie;
+    proxy_set_header X-Real-IP $remote_addr;
+    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+    proxy_redirect default;
+    add_header Access-Control-Allow-Origin *;
+    add_header Access-Control-Allow-Headers X-Requested-With;
+    add_header Access-Control-Allow-Methods GET,POST,OPTIONS;
+}
+

将上面的配置放到 server 里，如下图

nginx-config

上面的配置是平台的 VITE_PUBLIC_PATH = / 情况，也就是只有跟目录的情况。下面的配置为有子目录情况，比如子目录叫 `ronna-admin`

① 来到 .env.production (opens new window)，将 VITE_PUBLIC_PATH 等于 /ronna-admin，如下

# 线上环境平台打包路径
+VITE_PUBLIC_PATH = /ronna-admin/
+

② 配置 nginx.config 如下，可以看到多了个 location /ronna-admin/ 配置

nginx.config

点击查看 
location / {
+    root   html;
+    index  index.html index.htm;
+    try_files $uri $uri/ /index.html;
+}
+
+location /ronna-admin/ {
+    root   html;
+    index  index.html index.htm;
+    try_files $uri $uri/ /ronna-admin/index.html;
+}
+
+location /api {
+    # 如果后端在本地比如127.0.0.1或者localhost请解开下面的rewrite注释即可
+    # rewrite  ^.+api/?(.*)$ /$1 break;
+    # 这里填写后端地址（后面一定不要忘记添加 / ）
+    proxy_pass http://127.0.0.1:3000/;
+    proxy_set_header Host $host;
+    proxy_set_header Cookie $http_cookie;
+    proxy_set_header X-Real-IP $remote_addr;
+    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+    proxy_redirect default;
+    add_header Access-Control-Allow-Origin *;
+    add_header Access-Control-Allow-Headers X-Requested-With;
+    add_header Access-Control-Allow-Methods GET,POST,OPTIONS;
+}
+
+location /otherApi {
+    # 如果后端在本地比如127.0.0.1或者localhost请解开下面的rewrite注释即可
+    # rewrite  ^.+otherApi/?(.*)$ /$1 break;
+    # 这里填写后端地址（后面一定不要忘记添加 / ）
+    proxy_pass http://127.0.0.1:3290/;
+    proxy_set_header Host $host;
+    proxy_set_header Cookie $http_cookie;
+    proxy_set_header X-Real-IP $remote_addr;
+    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+    proxy_redirect default;
+    add_header Access-Control-Allow-Origin *;
+    add_header Access-Control-Allow-Headers X-Requested-With;
+    add_header Access-Control-Allow-Methods GET,POST,OPTIONS;
+}
+

# 开启 gzip、brotli 压缩

① 来到 .env.production (opens new window)，将 VITE_COMPRESSION 等于 both，如下

# 同时开启 gzip 与 brotli 压缩
+VITE_COMPRESSION = "both"
+

② 配置 nginx.config 如下

nginx.config

http {
+  # 开启gzip
+  gzip on;
+  # https://blog.csdn.net/fxss5201/article/details/106535475
+  gzip_static on;
+  gzip_proxied any;
+  # 低于1kb的资源不压缩
+  gzip_min_length 1k;
+  gzip_buffers 4 16k;
+  gzip_comp_level 2;
+  # 需要压缩的类型
+  gzip_types text/plain application/javascript application/x-javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;
+  # 配置禁用gzip条件，支持正则。此处表示ie6及以下不启用gzip（因为ie低版本不支持）
+  gzip_disable "MSIE [1-6]\.";
+  # 是否添加“Vary: Accept-Encoding”响应头
+  gzip_vary off;
+
+  # 开启brotli压缩，与gzip共存不会冲突，nginx默认不支持ngx_brotli模块，需要自行编译，参考 https://cloud.tencent.com/developer/article/2071894
+  brotli on;
+  brotli_comp_level 6;
+  brotli_buffers 16 8k;
+  brotli_min_length 20;
+  brotli_types text/plain text/css application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript application/javascript image/svg+xml;
+}
+

下面两张图是平台非国际化精简版开启 gzip 前后对比

未开启 gzip（资源大小 2.6MB）

before-gzip

开启 gzip（资源被压缩，大小 684kb，比未开启时少了约 2MB 🐮）

after-gzip

# nginx 常用命令

# 启动 nginx
sudo nginx
+
# 重启 nginx
sudo nginx -s reload
+
# 停止运行 nginx
sudo nginx -s stop
+
# 判断 nginx.config 配置文件语法是否正确

常用于当您配置 nginx.config 文件保存重启后却不生效时

sudo nginx -t
+

当出现 ok、successful 的字眼时说明配置文件语法没问题

check-nginx-config

上次更新: 2024/04/05, 09:11:09
http请求
图标

+ ← + 图标→ +

+ Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
+ + + diff --git a/pages/buildgood/index.html b/pages/buildgood/index.html new file mode 100644 index 0000000..6beb24e --- /dev/null +++ b/pages/buildgood/index.html @@ -0,0 +1,66 @@ + + + + + + 打包优化 | ronna-admin-doc + + + + + + + + + + +
ronna-admin-doc
目录

打包优化

打包优化关联着网站的稳定与加载速度，在开发中也是非常重要的一项

buildgood

# vite 自身的构建优化

点击查看 build-optimizations (opens new window) vite官方文档

# css 优化

分两步优化

# ​ 压缩 css

使用 cssnano 去压缩 css

# ​ 自动添加浏览器前缀

使用 Autoprefixer 自动添加浏览器前缀

# 组件、工具库

  • 无论是组件（如 element-plus），还是工具库（如 lodash、axios）我们都应该尽可能的按需引入，使其有良好的  tree-shaking 效果，这样项目整体打包出来的无用代码就少之又少了

  • 拿 lodash 举例，lodash 默认是 cjs 格式，不支持 es6 的 import 语法，那么我们就可以去 github 或者某些搜索引擎去寻找替代品，最终平台找到了 lodash-unified，它完全兼容 lodash 的全部语法并且既支持 esm 又支持 cjs，这使得它无论在浏览器还是 node 环境中表现都很良好。当然如果遇到那种只支持 cjs 格式，网上找遍了都找不到兼容 esm 格式的咋办呢，这时你可以参考 lodash-unified，看看别人是如何转换的 😊

  • vite 目前最大的性能瓶颈是大量模块的首页加载，可看 vite-issues (opens new window)，值得期待的是这个 pr (opens new window) 可能会缓解这个麻烦

# 压缩 gzip、brotli 格式

使用 vite-plugin-compression (opens new window) 对平台进行 gzip 或者 brotli 压缩，nginx 对这两种压缩模式都支持，压缩后部署到 nginx 将极大提高网页加载速度

# 如何开启压缩

来到 .env.production 文件，设置 VITE_COMPRESSION (opens new window) 即可。设置总体分为下面两种 具体实现代码 (opens new window)

# 两种总体设置

  1. 压缩时不删除原始文件的配置
  2. 压缩时删除原始文件的配置
# 压缩时不删除原始文件的配置
开启 gzip 压缩
+VITE_COMPRESSION = "gzip"
+
+开启 brotli 压缩
+VITE_COMPRESSION = "brotli"
+
+# 同时开启 gzip 与 brotli 压缩
+VITE_COMPRESSION = "both"
+
+# 不开启压缩，默认
+VITE_COMPRESSION = "none"
+
# 压缩时删除原始文件的配置
开启 gzip 压缩
+VITE_COMPRESSION = "gzip-clear"
+
+开启 brotli 压缩
+VITE_COMPRESSION = "brotli-clear"
+
+# 同时开启 gzip 与 brotli 压缩
+VITE_COMPRESSION = "both-clear"
+
+# 不开启压缩，默认
+VITE_COMPRESSION = "none"
+

# 采用 cdn 模式替换本地依赖

# vite 插件

使用 vite-plugin-cdn-import (opens new window) 插件，在打包时将指定的 modules 替换成 cdn 链接，从而减少构建时间，提高生产环境中页面加载速度。

# cdn 厂商（免费）

平台 cdn 采用的是国内 bootcdn (opens new window)，主要是稳定并且快，当然您也可以选择 unpkg (opens new window) 或者 jsdelivr (opens new window)，这两个 cdn 是国外的

# 如何启动 cdn 替换

来到 .env.production 文件，将 VITE_CDN (opens new window) 设置成 true 即可

# 默认启动 cdn 替换的模块有哪些

vue、vue-router、vue-demi、pinia、element-plus、axios、dayjs、echarts 具体代码 build/cdn.ts (opens new window)

# 生产环境删除 console.log

使用平台开发的 vite-plugin-remove-console (opens new window) 插件，在打包构建时移除平台中所有的 console.log

# 静态资源分类打包

vite 是基于 esbuild 和 rollup 构建的，在打包时如果不进行 output 的配置，打包出来的效果如下图（这也是 vite 默认打包出来的效果，可以看到所有文件都混在一起）

no-output

下图是我们配置 output (opens new window) 后的效果，可以看到文件都进行了分类存放，这也方便我们查找文件

output

相关推荐

Vite 代码拆包插件。支持多种拆包策略，可避免手动操作 manualChunks 潜在的循环依赖问题 (opens new window)

# svg 压缩

一般下载的 svg 或者复制的 svg 代码，里面存在一些无关紧要的元素，可以将其剔除，毫无影响地降低 svg 大小
+平台使用了 svgo (opens new window) 工具对所有 svg 进行了压缩，您拉取平台代码时所有 svg 都已经最简了哦。当然您会问自己新加的 svg 如何精简呢，来到 main/package.json (opens new window)，可以看到平台默认使用 svgo 工具对 src/assets/svg 文件夹里的所有 svg 进行压缩，这是可以改动的，只需要将 -f 和 -o 后的路径改为您需要压缩的 svg 路径即可。温馨提示：只需要运行 pnpm svgo 命令对 svg 文件进行一次压缩即可

推荐阅读

上次更新: 2024/04/05, 09:11:09
自定义免登录
vite预构建

+ ← + vite预构建→ +

+ Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
+ + + diff --git a/pages/config/index.html b/pages/config/index.html new file mode 100644 index 0000000..431b87a --- /dev/null +++ b/pages/config/index.html @@ -0,0 +1,147 @@ + + + + + + 平台配置 | ronna-admin-doc + + + + + + + + + + +
ronna-admin-doc
目录

平台配置

下图左上角箭头所指处就是平台的 logo

logo

为了保持 logo 的高保真，平台采用 svg 作为 logo 格式。自定义 logo ，只需修改下图 logo.svg 文件即可

config-logo

当然也可以自定义 logo 格式。比如需要 png 的图片，只需要把上图中 logo.svg 换成所需的 logo.png ，然后来到 layout/hooks/useNav.ts (opens new window) ，把 "/logo.svg" 改成 "/logo.png" 即可

# 环境变量

# 配置文件

一共 四 个配置文件，都在平台根目录下，具体如下

├── .env                  # 基础环境变量配置文件（优先级最低）
+├── .env.development      # 开发环境变量配置文件
+├── .env.production       # 生产环境变量配置文件
+├── .env.staging          # 预发布环境变量配置文件
+

# 具体配置

平台内置 六 个环境变量，具体如下

# 平台本地运行端口号
+VITE_PORT = 8848
+
+# 平台打包路径
+VITE_PUBLIC_PATH = /
+
+# 平台路由历史模式（Hash模式传"hash"、HTML5模式传"h5"、Hash模式带base参数传"hash,base参数"、HTML5模式带base参数传"h5,base参数"）
+VITE_ROUTER_HISTORY = "hash"
+
+# 是否在打包时使用cdn替换本地库 替换 true 不替换 false
+VITE_CDN = false
+
+# 是否启用gzip压缩或brotli压缩（分两种情况，删除原始文件和不删除原始文件）
+# 压缩时不删除原始文件的配置：gzip、brotli、both（同时开启 gzip 与 brotli 压缩）、none（不开启压缩，默认）
+# 压缩时删除原始文件的配置：gzip-clear、brotli-clear、both-clear（同时开启 gzip 与 brotli 压缩）、none（不开启压缩，默认）
+VITE_COMPRESSION = "none"
+
+# 是否隐藏首页 隐藏 true 不隐藏 false （勿删除，VITE_HIDE_HOME只需在.env文件配置）
+VITE_HIDE_HOME = false
+

# 基础用法

.env 文件 (opens new window) vite文档

const { VITE_PUBLIC_PATH } = import.meta.env;
+console.log("当前环境变量VITE_PUBLIC_PATH为：", VITE_PUBLIC_PATH)
+

知识点：如何在 .vue 或 .ts 文件中判断当前是开发环境还是生产环境？

打印 process.env.NODE_ENV，值为 development 代表是开发环境，值为 production 代表是生产环境

# 如何添加自定义配置

比如要在 .env.production 文件添加自定义配置 VITE_HANDSOME = true，作为一种规范推荐使用 VITE_ 作为自定义配置前缀

① 在 .env.production 中加入 VITE_HANDSOME = true，具体如下

# 自定义配置
+VITE_HANDSOME = true
+

② 加入类型支持，在 interface ViteEnv (opens new window) 里加上 VITE_HANDSOME: boolean，具体如下

interface ViteEnv {
+  VITE_HANDSOME: boolean;
+}
+

③ 设置默认值，在 build/index.ts (opens new window) 文件的 ret 变量上加上 VITE_HANDSOME: true，具体如下

const ret: ViteEnv = {
+  VITE_HANDSOME: true
+}
+

# platform-config.json

platform-config.json (opens new window) 配置文件在任何环境下修改都可生效

{
+  "Version": "2.0.0", // 平台版本号
+  "Title": "RonnaAdmin", // 平台标题
+  "FixedHeader": true, // 是否固定页头和标签页（true 内容区超出出现纵向滚动条 false 页头、标签页、内容区可纵向滚动）
+  "HiddenSideBar": false, // 隐藏菜单和页头，只显示标签页和内容区
+  "MultiTagsCache": false, // 是否开启持久化标签 （会缓存）
+  "KeepAlive": true, // 是否开启组件缓存（此处不同于路由的 keepAlive，如果此处为 true 表示设置路由的 keepAlive 起效，反之设置 false 屏蔽平台整体的 keepAlive，即使路由设置了keepAlive 也不再起作用）
+  "Locale": "zh", // 默认国际化语言 （zh 中文、en 英文）（会缓存）
+  "Layout": "vertical", // 导航菜单模式 （vertical 左侧菜单模式、horizontal 顶部菜单模式、mix 综合菜单模式）（会缓存）
+  "Theme": "light", // 主题模式（会缓存）
+  "DarkMode": false, // 是否开启暗黑模式 （会缓存）
+  "OverallStyle": "light", // 整体风格（浅色：light、深色：dark、自动：system）（会缓存）更多详情看 https://github.com/ronnaces/ronna-admin/commit/dd783136229da9e291b518df93227111f4216ad0#commitcomment-137027417
+  "Grey": false, // 灰色模式（会缓存）
+  "Weak": false, // 色弱模式（会缓存）
+  "HideTabs": false, // 是否隐藏标签页（会缓存）
+  "HideFooter": false, // 是否隐藏页脚（会缓存）
+  "SidebarStatus": true, // vertical左侧菜单模式模式下侧边栏状态（true 展开、false 收起）（会缓存）
+  "EpThemeColor": "#409EFF", // 主题色（会缓存）
+  "ShowLogo": true, // 是否显示logo（会缓存）
+  "ShowModel": "smart", // 标签页风格（smart 灵动模式、card 卡片模式）（会缓存）
+  "MenuArrowIconNoTransition": false, // 菜单展开、收起图标是否开启动画，如遇菜单展开、收起卡顿设置成 true 即可（默认 false，开启动画）
+  "CachingAsyncRoutes": false, // 是否开启动态路由缓存本地的全局配置，默认 false
+  "TooltipEffect": "light", // 可配置平台主体所有 el-tooltip 的 effect 属性，默认 light，不会影响业务代码
+  "ResponsiveStorageNameSpace": "responsive-", // 本地响应式存储的命名空间
+  "MenuSearchHistory": 6 // 菜单搜索历史的最大条目
+}
+

提示

开发、生产环境修改都可生效，上面 platform-config.json 文件标记 会缓存 即配置会缓存在本地浏览器，应先清空浏览器缓存才能生效

# 基础用法

平台将 platform-config.json 中所有配置都已经注册到 $config (opens new window) 这个全局属性对象上，应用内所有组件实例都可访问 globalproperties (opens new window)

# .vue 文件中使用（setup 语法）

<script setup lang="ts">
+import { getCurrentInstance } from "vue";
+
+const { Version } = getCurrentInstance().appContext.config.globalProperties.$config;
+console.log("Version：", Version)
+</script>
+

# .vue 文件中使用（非 setup 语法）

<script lang="ts">
+export default defineComponent({
+   computed: {
+    currentConfig() {
+      return this.$config?.Version;
+    }
+  }
+});
+</script>
+

# .ts 或 .vue 中使用

具体实现代码位置 config/index.ts (opens new window)

import { getConfig } from "@/config";
+
+console.log("Version：", getConfig()?.Version)
+

# 如何添加自定义配置

比如要添加的自定义配置为 Handsome: true

① 在 platform-config.json 中加入 Handsome: true，具体如下

{
+  "Handsome": true // 自定义配置
+}
+

② 加入类型支持，在 interface PlatformConfigs (opens new window) 里加上 Handsome?: boolean，具体如下

interface PlatformConfigs {
+  Handsome?: boolean; // 根据实际类型编写
+}
+

# package.json

package.json (opens new window) 文件中的 scripts 配置中存放平台的各种命令，具体如下

{
+  "scripts": {
+    "dev": "NODE_OPTIONS=--max-old-space-size=4096 vite", // 启动平台
+    "serve": "pnpm dev", // 启动平台（有人喜欢dev、有人喜欢serve）
+    "build": "rimraf dist && NODE_OPTIONS=--max-old-space-size=8192 vite build", // 打包平台（rimraf 包的作用：以包的形式包装rm -rf命令，用来删除文件和文件夹的，不管文件夹是否为空，都可删除）
+    "build:staging": "rimraf dist && vite build --mode staging", // 打包平台（预发布环境）
+    "report": "rimraf dist && vite build", // 打包平台并生产平台包文件大小图形化分析
+    "preview": "vite preview", // 预览平台，需先打包（无需安装live-server等工具，vite自带预览功能）
+    "preview:build": "pnpm build && vite preview", // 打包并预览平台（无需安装live-server等工具，vite自带预览功能）
+    "typecheck": "tsc --noEmit && vue-tsc --noEmit --skipLibCheck", // 使用vue-tsc工具对指定的.ts、.tsx、.vue文件进行类型校验
+    "svgo": "svgo -f . -r", // 压缩当前目录下的所有SVG文件，更多详情看 https://github.com/ronnaces/ronna-admin/commit/a114dbb4652d6316853d75ff127180fc07d07d2b#commitcomment-136451628
+    "cloc": "NODE_OPTIONS=--max-old-space-size=4096 cloc . --exclude-dir=node_modules --exclude-lang=YAML", // 平台文件、语言分析
+    "clean:cache": "rimraf .eslintcache && rimraf node_modules && pnpm install", // 删除node_modules、清空eslint缓存并重新安装平台依赖
+    "lint:eslint": "eslint --cache --max-warnings 0  \"{src,mock,build}/**/*.{vue,js,ts,tsx}\" --fix", // eslint修复
+    "lint:prettier": "prettier --write  \"src/**/*.{js,ts,json,tsx,css,scss,vue,html,md}\"", // prettier格式化
+    "lint:stylelint": "stylelint --cache --fix \"**/*.{html,vue,css,scss}\" --cache --cache-location node_modules/.cache/stylelint/", // stylelint格式化修复
+    "lint": "pnpm lint:eslint && pnpm lint:prettier && pnpm lint:stylelint", // 平台整体lint格式化并修复
+    "prepare": "husky", // 自动生成husky（https://typicode.github.io/husky/#/）
+    "preinstall": "npx only-allow pnpm" // 只允许运行pnpm命令，如果您换成yarn、npm需要把这行删除（https://pnpm.io/zh/only-allow-pnpm）
+  }
+}
+
上次更新: 2024/04/05, 09:11:09
.vscode文件夹详解
布局

+ ← + 布局→ +

+ Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
+ + + diff --git a/pages/db78e2/index.html b/pages/db78e2/index.html new file mode 100644 index 0000000..31b271f --- /dev/null +++ b/pages/db78e2/index.html @@ -0,0 +1,50 @@ + + + + + + 资源 | ronna-admin-doc + + + + + + + + + + +
ronna-admin-doc
目录

资源

# 插件推荐

更多插件...

# 社区优秀解决方案

# 1. 站点信息模块 (opens new window)

在首页添加站点信息模块，效果：

在文章页添加文章字数、阅读时间、浏览量，效果：

# 2. 私密文章功能 (opens new window)

当大家想要「云端备份」文章到博客时，又不希望别人看到，该功能能满足你。

# 3. 首页大图模块 (opens new window)

喜欢首页大图模式的朋友可以参考此教程。

# 4. 优雅的全文搜索方案 (opens new window)

# 文章管理和发布

使用 此插件 src-sy-post-publisher (opens new window) 发布思源笔记 (opens new window)的文章到Vuepress等平台。

# 图标&配图

说明：以下图标非主题内置，你可以选择喜欢的图标右键保存或到图标库下载。更多图标：阿里图标库 (opens new window)

# 静态图标

编程

服务器

机器学习

计算机网络

面向对象

软件开发

数据结构

数据库

思维导图

算法

网络技术

系统

系统分析

项目管理

# 萌系图标

# 动态图标

猫1

猫2

猫3

猫4

# 插画

免费插画 (opens new window)
2D/3D/手绘插画 (opens new window)
阿里插画库 (opens new window)

# 配图

可画-文章配图 (opens new window)

logo生成1 (opens new window)
logo生成2 (opens new window)

# Emoji表情

Emoji百科 (opens new window)

小技巧

在任意输入框快速打开emoji表情方法：
+Windows系统下按Win + .
+Mac系统下按Control + Command + 空格

上次更新: 2024/04/05, 09:11:09
+ Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
+ + + diff --git a/pages/directory/index.html b/pages/directory/index.html new file mode 100644 index 0000000..cf445b4 --- /dev/null +++ b/pages/directory/index.html @@ -0,0 +1,177 @@ + + + + + + 目录结构 | ronna-admin-doc + + + + + + + + + + +
ronna-admin-doc

目录结构

完整版 (opens new window)目录结构

├── .github  # GitHub 配置文件
+│   ├── ISSUE_TEMPLATE  # 问题提交参考模板
+│   ├── workflows git  # 工作流
+├── .husky  # 代码提交前校验配置文件
+├── .vscode  # IDE 工具推荐配置文件
+│   │   ├── extensions.json  # 一键安装平台推荐的 vscode 插件
+│   │   ├── settings.json  # 设置扩展程序或 vscode 编辑器的一些属性
+│   │   ├── vue3.0.code-snippets  # vue3.0 代码片段
+│   │   └── vue3.2.code-snippets  # vue3.2 代码片段
+│   │   └── vue3.3.code-snippets  # vue3.3 代码片段
+├── build  # 构建工具
+│   │   ├── cdn.ts  # 打包时采用 cdn 模式
+│   │   ├── compress.ts  # 打包时启用 gzip 压缩或 brotli 压缩
+│   │   ├── info.ts  # 输出打包信息（大小、用时）
+│   │   ├── optimize.ts  # vite 依赖预构建配置项
+│   │   ├── plugins.ts  # vite 相关插件存放处
+│   │   ├── utils.ts  # 构建工具常用方法抽离
+├── locales  # 国际化文件存放处
+│   │   ├── en.yaml  # 英文配置
+│   │   ├── zh-CN.yaml  # 中文配置
+├── mock  # mock 模拟后台数据
+│   │   ├── asyncRoutes.ts  # 模拟后台返回动态路由
+│   │   ├── ...
+├── node_modules  # 模块依赖
+├── public  # 静态资源
+│   │   ├── audio  # 音频文件
+│   │   ├── html  # 静态 iframe 页面
+│   │   ├── wasm  # wasm 文件以及胶水代码
+│   │   ├── favicon.ico  # favicon
+│   │   ├── logo.svg  # logo
+│   │   ├── platform-config.json  # 全局配置文件（打包后修改也可生效）
+├── src
+│   ├── api  # 接口请求统一管理
+│   ├── assets  # 字体、图片等静态资源
+│   ├── components  # 自定义通用组件
+│   │   ├── ReAnimateSelector  # [animate.css](https://animate.style/) 选择器组件
+│   │   ├── ReAuth  # 按钮级别权限组件
+│   │   ├── ReBarcode  # 条形码组件
+│   │   ├── ReCol  # 封装 element-plus 的 el-col 组件
+│   │   ├── ReCountTo  # 数字动画组件
+│   │   ├── ReCropper  # 图片裁剪组件
+│   │   ├── ReDialog  # 基于 element-plus 中 el-dialog 组件开发的函数式弹框
+│   │   ├── ReFlicker  # 圆点、方形闪烁动画组件
+│   │   ├── ReFlop  # 时间翻牌组件
+│   │   ├── ReFlowChart  # LogicFlow 流程图组件
+│   │   ├── ReIcon  # 图标组件
+│   │   ├── ReImageVerify  # 图形验证码组件
+│   │   ├── ReMap  # 高德地图组件
+│   │   ├── RePureTableBar  # 配合 `@pureadmin/table` 实现快速便捷的表格操作 https://github.com/ronnacespure-admin-table */
+│   │   ├── ReQrcode  # 二维码组件
+│   │   ├── ReSeamlessScroll  # 无缝滚动组件
+│   │   ├── ReSegmented  # 分段控制器组件
+│   │   ├── ReSelector  # 选择器组件
+│   │   ├── ReSplitPane  # 切割面板组件
+│   │   ├── ReText  # 支持 Tooltip 提示的文本省略组件
+│   │   ├── ReTreeLine  # 树形连接线组件（基于element-plus）
+│   │   ├── ReTypeit  # 打字机效果组件
+│   ├── config  # 获取平台动态全局配置
+│   ├── directives  # 自定义指令
+│   │   ├── auth  # 按钮级别权限指令
+│   │   ├── copy  # 文本复制指令（默认双击复制）
+│   │   ├── longpress  # 长按指令
+│   │   ├── optimize  # 防抖、节流指令
+│   ├── layout  # 主要页面布局
+│   ├── plugins  # 处理一些库或插件，导出更方便的 api
+│   ├── router  # 路由配置
+│   ├── store  # pinia 状态管理
+│   ├── style  # 全局样式
+│   │   ├── dark.scss  # 暗黑模式样式适配文件
+│   │   ├── element-plus.scss  # 全局覆盖 element-plus 样式文件
+│   │   ├── reset.scss  # 全局重置样式文件
+│   │   ├── sidebar.scss  # layout 布局样式文件
+│   │   ├── tailwind.css  # tailwindcss 自定义样式配置文件
+│   │   ├── ...
+│   ├── utils  # 全局工具方法
+│   │   ├── http  # 封装 axios 文件
+│   │   ├── localforage  # 二次封装 localforage (https://localforage.docschina.org/) 支持设置过期时间，提供完整的类型提示
+│   │   ├── progress  # 封装 nprogress
+│   │   └── auth.ts  # 处理用户信息和 token 相关
+│   │   └── chinaArea.ts  # 汉字转区域码
+│   │   └── globalPolyfills.ts  # 解决项目可能因为安装某个依赖出现 `global is not defined` 报错
+│   │   └── message.ts  # 消息提示函数
+│   │   ├── mitt.ts  # 触发公共事件，类似 EventBus
+│   │   ├── preventDefault.ts  # 阻止键盘F12、浏览器默认右键菜单、页面元素选中、图片默认可拖动的方法
+│   │   ├── print.ts  # 打印函数
+│   │   ├── propTypes.ts  # 二次封装 vue 的 propTypes
+│   │   ├── responsive.ts  # 全局响应式 storage 配置
+│   │   ├── sso.ts  # 前端单点登录逻辑处理
+│   │   ├── tree.ts  # 树结构相关处理函数
+│   ├── views  # 存放编写业务代码页面
+│   ├── App.vue  # 入口页面
+│   ├── main.ts  # 入口文件
+├── types  # 全局 TS 类型配置
+│   │   ├── global-components.d.ts  # 自定义全局组件获得 Volar 提示（自定义的全局组件需要在这里声明下才能获得 Volar 类型提示哦）
+│   │   ├── global.d.ts  # 全局类型声明，无需引入直接在 `.vue` 、`.ts` 、`.tsx` 文件使用即可获得类型提示
+│   │   ├── index.d.ts  # 此文件跟同级目录的 global.d.ts 文件一样也是全局类型声明，只不过这里存放一些零散的全局类型，无需引入直接在 .vue 、.ts 、.tsx 文件使用即可获得类型提示
+│   │   ├── router.d.ts  # 全局路由类型声明
+│   │   ├── shims-tsx.d.ts  # 该文件是为了给 .tsx 文件提供类型支持，在编写时能正确识别语法
+│   │   └── shims-vue.d.ts  # .vue、.scss 文件不是常规的文件类型，typescript 无法识别，所以我们需要通过下图的代码告诉 typescript 这些文件的类型，防止类型报错
+├── .browserslistrc  # 配置目标浏览器的环境
+├── .dockerignore  # 排除不需要上传到 docker 服务端的文件或目录
+├── .editorconfig  # 编辑器读取文件格式及样式定义配置 https://editorconfig.org/
+├── .env  # 全局环境变量配置（当 .env 文件与 .env.development、.env.production、.env.staging 这三个文件之一存在相同的配置 key 时，.env 优先级更低）
+├── .env.development  # 开发环境变量配置
+├── .env.production  # 生产环境变量配置
+├── .env.staging  # 预发布环境变量配置
+├── .eslintignore  # eslint 语法检查忽略文件
+├── .gitattributes  # 自定义指定文件属性
+├── .gitignore  # git 提交忽略文件
+├── .gitpod.yml  # gitpod 部署配置
+├── .lintstagedrc  # lint-staged 配置
+├── .markdownlint.json  # markdown 格式检查配置
+├── .npmrc  # npm 配置文件
+├── .nvmrc  # 用于指定在使用 Node Version Manager（NVM）时要使用的特定 Node.js 版本
+├── .prettierignore  # prettier 语法检查忽略文件
+├── .prettierrc.js  # prettier 插件配置
+├── .stylelintignore  # stylelint 语法检查忽略文件
+├── CHANGELOG.en_US.md  # 版本更新日志（英文版）
+├── CHANGELOG.md  # 版本更新日志（英文版）
+├── CHANGELOG.zh_CN.md  # 版本更新日志（中文版）
+├── commitlint.config.js  # git 提交前检查配置
+├── Dockerfile  # 用来构建 docker 镜像
+├── eslint.config.js  # eslint 语法检查配置
+├── index.html  # html 主入口
+├── LICENSE  # 证书
+├── package.json  # 依赖包管理以及命令配置
+├── pnpm-lock.yaml  # 依赖包版本锁定文件
+├── postcss.config.js  # postcss 插件配置
+├── README.en-US.md  # README（英文版）
+├── README.md  # README
+├── stylelint.config.js  # stylelint 配置
+├── tailwind.config.ts  # tailwindcss 配置
+├── tsconfig.json  # typescript 配置
+└── vite.config.ts  # vite 配置
+
上次更新: 2024/04/05, 09:11:09
快速开始
.vscode文件夹详解

+ ← + .vscode文件夹详解→ +

+ Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
+ + + diff --git a/pages/git/index.html b/pages/git/index.html new file mode 100644 index 0000000..30ee765 --- /dev/null +++ b/pages/git/index.html @@ -0,0 +1,115 @@ + + + + + + git常用命令 | ronna-admin-doc + + + + + + + + + + +
ronna-admin-doc
目录

git常用命令

# 程序员必备技能之 Git

# 常用命令

# 拉取代码

git clone xxx.git
+

# 创建分支

git branch dev
+# or
+git checkout -b dev
+# or
+git switch -c dev
+

# 切换本地分支

git checkout dev
+# or
+git switch dev
+

# 切换分支并关联远程分支

git checkout -b dev origin/dev
+# or
+git checkout --track origin/dev
+

# 查看本地所有分支

git branch
+

# 查看远程所有分支

git branch -r
+

# 删除本地分支

git branch -d dev
+

# 删除远程分支

git push origin -d dev
+

# 将代码从工作区添加暂存区

git add .
+

# 查看尚未暂存的更新

git diff
+

# 添加提交信息（commit 注释写错，执行 git commit --amend 此时会进入默认 vim 编辑器，修改注释后保存）

git commit -m 'xxxx'
+

# 推送代码到远程分支

git push origin dev
+
+# 强制推送（常在 git rebase 或 git reset 后使用）
+git push -f origin dev
+

# 拉取远程分支代码

git pull origin dev
+

# 合并分支

git merge dev
+

# 查看 git 状态

git status
+

# 查看提交历史

git log
+

# 查看可引用的历史版本记录

git reflog
+

# 把本地未 push 的分叉提交历史整理成直线

git rebase origin/dev
+

# 回到 rebase 执行之前的状态

git rebase --abort
+

# 回退版本

# 回退指定 commit_id 版本
+git reset --hard commit_id
+
+# 回退上一个版本
+git reset --soft HEAD^
+# or
+git reset --soft HEAD~1
+

# 撤销代码

git revert commit_id
+

# 修改分支名

# 第一步
+git branch -m oldBranchName newBranchName
+
+# 第二步
+git push origin :oldBranchName
+
+# 第三步
+git push --set-upstream origin newBranchName
+

# 查看 git 配置

# 查看全局配置
+git config --global --list
+
+# 查看用户名
+git config --global user.name
+

# 添加用户名

git config --global --add user.name newName
+

# 删除用户名

git config --global --unset user.name
+

# 修改用户名

git config --global user.name newName
+

# 配置 Git 用户名和邮箱

# 用户名
+git config --global user.name "Your Name"
+
+# 邮箱
+git config --global user.email "email@example.com"
+

# 统计代码行数

git ls-files | xargs wc -l
+

# 文件或文件夹重命名

Git 在 Windows 和 macOS 的默认文件系统中对文件大小写修改是不敏感的。可能你会先删除文件并提交，然后再新建文件再提交，这样做很麻烦，下面的 git mv 就简化了繁琐的操作
+比如文件 filename.ts 或文件夹 jsutils，它们的相对路径分别是 src/filename.ts 和 src/jsutils

# 将 filename.ts 文件重命名为 fileName.ts，分下面两步
+# 第一步（注意下面的 name.ts 与 filename.ts 是不同的，如果你把 name.ts 改为 fileName.ts 是不行的，因为上面讲了仅大小写不同是不行的）
+git mv src/filename.ts src/name.ts
+# 第二步
+git mv src/name.ts src/fileName.ts
+
+# 将 jsutils 文件夹重命名为 jsUtils，分下面两步
+# 第一步
+git mv src/jsutils src/utils
+# 第二步
+git mv src/utils src/jsUtils
+

# 提交规范

相关参考 (opens new window)

feat: 增加新功能
fix: 修复问题/BUG
style: 代码风格相关无影响运行结果的
perf: 优化/性能提升
refactor: 重构
revert: 撤销修改
test: 测试相关
docs: 文档/注释
chore: 依赖更新/脚手架配置修改等
workflow: 工作流改进
ci: 持续集成
types: 类型定义文件更改
wip: 开发中

# CodeReview 常用缩写

PR（Pull Request）拉取请求，给其他项目提交代码
LGTM（Looks Good To Me）代码已经过 review，可以合并
SGTM（Sounds Good To Me）和上面那句意思差不多，也是已经通过了 review 的意思
WIP（Work In Progress）如果有个改动很大的 PR，可以在写了一部分的情况下先提交，但需在标题写上 WIP，以告诉项目维护者这个功能还未完成，方便维护者提前 review 部分提交的代码
PTAL（Please Take A Look）提示别人来看一下
TBR（To Be Reviewed）提示维护者进行 review
TL;DR（Too Long; Didn't Read）太长懒得看
TBD（To Be Done(or Defined/Discussed/Decided/Determined)） 一般表示还没搞定

简单易懂的 Git (opens new window)视频教程推荐

上次更新: 2024/04/05, 09:11:09
问题反馈
技术网站推荐

+ ← + 技术网站推荐→ +

+ Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
+ + + diff --git a/pages/i18n/index.html b/pages/i18n/index.html new file mode 100644 index 0000000..5c853da --- /dev/null +++ b/pages/i18n/index.html @@ -0,0 +1,89 @@ + + + + + + 国际化 | ronna-admin-doc + + + + + + + + + + +
ronna-admin-doc
目录

国际化

平台内置了国际化，支持自定义国际化、element-plus 国际化

pure-admin 完整版 (opens new window) 只有国际化版本

# vscode 插件

在 vscode 插件商店搜 lokalise.i18n-ally 进行安装，可以带来更友好的国际化提示

i18nAlly

当然不要忘记把下面的 json 代码添加到您 vscode 的 settings.json 中

"i18n-ally.localesPaths": "locales",
+"i18n-ally.keystyle": "nested",
+"i18n-ally.sortKeys": true,
+"i18n-ally.namespace": true,
+"i18n-ally.enabledParsers": ["yaml", "js"],
+"i18n-ally.sourceLanguage": "en",
+"i18n-ally.displayLanguage": "zh-CN",
+"i18n-ally.enabledFrameworks": ["vue"]
+

# 注入国际化

平台使用 @intlify/unplugin-vue-i18n (opens new window) 这款国际化 vite 插件配合 vue-i18n (opens new window)来实现国际化，国际化文件采用了 yaml 格式 点击查看更多格式 (opens new window)

中文添加到 zh-CN.yaml (opens new window) 文件里，英文添加到 en.yaml (opens new window) 文件里，支持嵌套结构，嵌套层级越深性能越低，如下图

i18n

# 基础用法

# .vue 文件中使用

① 使用 vue-i18n 中 useI18n 函数

<script setup lang="ts">
+import { useI18n } from "vue-i18n";
+const { t } = useI18n();
+</script>
+
+<template>
+  <p>{{ t("buttons.hsLoginOut") }}</p>
+</template>
+

② 使用平台提供的 transformI18n (opens new window) 函数

<script setup lang="ts">
+import { transformI18n } from "@/plugins/i18n";
+</script>
+
+<template>
+  <p>{{ transformI18n("buttons.hsLoginOut") }}</p>
+</template>
+

# .ts 文件中使用

在 .ts 文件中推荐使用平台提供的 transformI18n (opens new window) 函数，因为 useI18n 必须在 setup 中使用，具体原因请看 vue-i18n 文档 (opens new window)

import { transformI18n } from "@/plugins/i
+transformI18n("buttons.hsLoginOut");
+

提示

transformI18n 会自动读取 locales (opens new window) 下的国际化语言，如果匹配到则返回，匹配不到的话就是您传什么就返回什么，这样避免报错。这也是为什么平台路由的 title 字段支持传 国际化 和 非国际化 两种写法的原因

# 平台提供的 $t

这里的 $t (opens new window) 是指平台提供的函数，是配合 i18n Ally 插件在 vscode 里带来智能提示，无实际意义，只对提示起作用，而非 vue-i18n 里的

# .vue 文件中使用

对于 i18n Ally 插件来说要想得到智能提示必须使用带有 t 的别名而且 t 永远在最后一位，例如 $$t 、 &t 类似格式都是生效的，而 $t$ 、 t& 不生效

<script setup lang="ts">
+import { $t } from "@/plugins/i18n";
+</script>
+
+<template>
+  <p>{{ $t("login.usernameReg") }}</p>
+</template>
+

效果如下图

i18n

# .ts 文件中使用

import { $t } from "/@/plugins/i18n";
+$t("menus.hslogin");
+

效果如下图

i18n

# 当前的国际化环境

当前的国际化环境是指当前系统正在使用中文还是英文（zh：中文、en：英文）

# .vue 文件中使用

<script setup lang="ts">
+import { useI18n } from "vue-i18n";
+
+const { locale } = useI18n()
+console.log(`当前系统采用的语言是：${locale.value}`)
+</script>
+

# .ts 文件中使用

因为 useI18n 只能在 setup 中使用，所以平台将当前的国际化环境在 localStorage (opens new window) 里存了一份

import type { StorageConfigs } from "/#/index";
+import { storageLocal } from "@pureadmin/utils";
+
+const locale =
+  storageLocal.getItem<StorageConfigs>("responsive-locale")?.locale;
+console.log(`当前系统采用的语言是：${locale}`);
+
上次更新: 2024/04/05, 09:11:09
主题和暗黑模式
Tailwind CSS

+ ← + Tailwind CSS→ +

+ Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
+ + + diff --git a/pages/icon/index.html b/pages/icon/index.html new file mode 100644 index 0000000..7414852 --- /dev/null +++ b/pages/icon/index.html @@ -0,0 +1,154 @@ + + + + + + 图标 | ronna-admin-doc + + + + + + + + + + +
ronna-admin-doc
目录

图标

图标是文字的隐喻，可以实现视觉引导和功能划分。平台内置多种图标解决方案，满足 99.99% 的图标场景需求

# iconify

在开始之前，我们先来了解下 iconify 。它是统一的图标框架，超过 100 多个图标集都集中在这一个库，超过 100,000 个开源矢量图标，并且会定期更新图标。您可以在 iconify (opens new window) 或者 icones (opens new window) 中看到所有的图标集。平台也对 iconify。

关于 element-plus 图标集成

问：平台虽然使用了 element-plus 作为主要 ui 框架，但是并没有引入官网推荐的 @element-plus/icons-vue (opens new window) 图标库，那该如何使用 element-plus 的图标呢？

答：iconify 非常强大，已经把 element-plus 的图标集成进去了。平台使用了 @iconify-icons/ep (opens new window) 完全替代了 @element-plus/icons-vue (opens new window) , 具体看 iconify/ep (opens new window) 或者 icones/ep (opens new window)

# 本地图标

本地图标是指通过本地安装各类图标库依赖包或者本地引入静态资源（比如 iconfont、svg ）的图标

# iconfont 的引入

# 存放目录

可以看到下图，平台将 iconfont 放到了 src/assets/iconfont (opens new window) 文件夹里，这是平台内置的 iconfont ，最好不要删除。如果您项目也用到了 iconfont ，可以在同级目录src/assets下新建文件夹，比如iconfont-business，用来存放您项目的 iconfont 文件

iconfont

# 如何导入

来到 src/main.ts 文件下参考 导入 (opens new window) 即可

# 组件使用

平台对 iconfont 进行了组件的封装 FontIcon (opens new window)

点击查看 
<template>
+  <div>
+    <!-- 分font-class、unicode、symbol三种模式 -->
+    <!-- font-class模式 -->
+    <FontIcon icon="team-iconlogo" />
+    <!-- unicode模式，需要加上uni属性 -->
+    <FontIcon icon="&#xe620;" uni />
+    <!-- symbol模式，需要加上svg属性 -->
+    <FontIcon icon="team-iconlogo" svg style="width: 20px; height: 20px" />
+  </div>
+</template>
+

# svg 的引入

# 存放目录

可以看到下图，平台将 svg 放到了 src/assets/svg (opens new window) 文件夹里，该文件夹作为 svg 文件统一存放处

svg

# 基础用法

<script setup lang="ts">
+// svg后面加?component代表将其作为Vue组件引入，以获取更好的类型声明，更多写法请看 https://github.com/jpkleemans/vite-svg-loader#import-params
+import backTop from "@/assets/svg/back_top.svg?component";
+</script>
+
+<template>
+  <backTop />
+</template>
+

# iconify 相关图标的引入

# 分为两个步骤

# 安装本地依赖图标包

比如要使用 element-plus 的图标，就使用如下命令安装 @iconify-icons/ep

    pnpm add @iconify-icons/ep -D
+
    yarn add @iconify-icons/ep -D
+
    npm install @iconify-icons/ep -D
+
    // Make sure to add code blocks to your code group

    安装完成后，来到 package.json 文件，看到如下图出现 @iconify-icons/ep 代表安装成功（当然平台已经内置了，您就不需要安装了）

    温馨提示

    安装完成后，还应该将其引入到 exclude (opens new window) 配置里哦 😊

    ep-icon

    # 基础用法

    <script setup lang="ts">
+// 按需引入
+import Check from "@iconify-icons/ep/check";
+</script>
+
+<template>
+  <IconifyIconOffline :icon="Check" />
+</template>
+

    # 如何找到更多的图标集

    上面提到过 iconify 集成了 100 多个图标集，可以来到这里 iconify (opens new window) 或者 icones (opens new window) 中看到所有的图标集，比如我们想找 ant-design (opens new window) 的图标集（其他图标集类似做法），如下图输入 ant 第一个就是，然后 点进去 (opens new window)

    ant-icon

    接着上面讲，点进去之后，我们应该先安装它，才能引入、使用，安装分为两个小步骤

    ① 点进去之后，随便找个图标点开，然后取冒号前的名字，将其复制一下

    ant-install

    ② 然后来到 npm (opens new window) , 总是以 @iconify-icons/ 开头，然后将刚刚复制的名称放在后面，搜索结果如下图

    ant-install2

    接下来您就可以按照 这里 安装使用啦

    # 在线图标

    在线图标是指可以通过公网访问的图标

    # 基础用法

    <template>
+  <div class="flex">
+    <IconifyIconOnline
+      icon="openmoji:beaming-face-with-smiling-eyes"
+      width="60px"
+      height="60px"
+    />
+    <IconifyIconOnline icon="fxemoji:2hearts" width="60px" height="60px" />
+    <IconifyIconOnline icon="bi:badge-8k-fill" width="60px" height="60px" />
+    <IconifyIconOnline
+      icon="mingcute:alarm-1-line"
+      width="60px"
+      height="60px"
+    />
+    <IconifyIconOnline
+      icon="flat-color-icons:dislike"
+      width="60px"
+      height="60px"
+    />
+    <IconifyIconOnline icon="wpf:shopping-bag" width="60px" height="60px" />
+  </div>
+</template>
+

    icon-online

    如何找到更多的图标集 参考，区别是不需要再安装图标集了，直接复制图标名字就行了，参考下图

    online-click

    图标请求地址

    在线图标走的请求地址是 https://api.iconify.design，第一次加载会走接口，然后默认将图标文件存入 localstorage ，之后加载图标走 localstorage

    # 离线图标

    离线图标是指只能通过内网访问的图标

    因为涉及的知识稍微多了点，不方便以文字的形式展现，所以平台出了个视频教程 离线部署图标方案 (opens new window) 代码地址 (opens new window)

    # 通用图标 useRenderIcon (hooks)

    # 参数

    • 接收二个参数，第一个参数 icon ，第二个参数 attrs ，返回值类型 FunctionalComponent
    参数属性 说明 类型
    icon 图标 FunctionalComponent 、string
    attrs 图标属性、样式配置，拥有十四个属性 查看详情 (opens new window) iconType

    # 基础用法

    点击查看 
    <script setup lang="ts">
+import dayIcon from "@/assets/svg/day.svg?component";
+import Check from "@iconify-icons/ep/check";
+import { useRenderIcon } from "@/components/ReIcon/src/hooks";
+</script>
+
+<template>
+  <div>
+    <!-- 下面的component、el-input、el-button只是举例用，useRenderIcon不局限于这些，它支持任何可以用函数渲染图标的组件或者hooks -->
+
+    <!-- 传svg图标 -->
+    <component :is="useRenderIcon(dayIcon)" />
+
+    <!-- 传iconify图标 -->
+    <el-input :prefix-icon="useRenderIcon(Check)" />
+
+    <!-- 传在线图标 -->
+    <el-input :prefix-icon="useRenderIcon('ep:camera-filled')" />
+
+    <!-- 传自定义的iconfont图标，分font-class、unicode、symbol三种模式，需要注意的是这三种模式都需要在图标名称最前面加上 IF- 以区别它们是iconfont图标 -->
+    <!-- 默认font-class模式 -->
+    <component :is="useRenderIcon('IF-team-iconlogo')" />
+    <!-- unicode模式，需要在图标名称最后空一格然后加上uni字符即可 -->
+    <component :is="useRenderIcon('IF-&#xe620; uni')" />
+    <!-- symbol模式，需要在图标名称最后空一格然后加上svg字符即可 -->
+    <component
+      :is="
+        useRenderIcon('IF-team-iconlogo svg', { width: '20px', height: '20px' })
+      "
+    />
+  </div>
+</template>
+

    # 类型

    点击查看 
    export interface iconType {
+  // iconify (https://docs.iconify.design/icon-components/vue/#properties)
+  inline?: boolean;
+  width?: string | number;
+  height?: string | number;
+  horizontalFlip?: boolean;
+  verticalFlip?: boolean;
+  flip?: string;
+  rotate?: number | string;
+  color?: string;
+  horizontalAlign?: boolean;
+  verticalAlign?: boolean;
+  align?: string;
+  onLoad?: Function;
+  includes?: Function;
+  //  all icon
+  style?: object;
+}
+

    # 导航菜单的 icon 如何配置

    如下图，平台导航菜单的 icon 渲染都是用的 useRenderIcon 函数

    useRenderIcon

    # svg

    svg 模式只支持前端配置菜单 icon，不支持后端返回哦（因为在这里 svg 是函数组件类型，而不是字符串）

    menu-svg

    # iconfont

    推荐使用 font-class (opens new window) 模式

    menu-if

    # 本地图标

    只需要在 src/components/ReIcon/src/offlineIcon.ts 文件引入然后使用 addIcon 注册一下即可使用

    menu-local

    温馨提示

    只要在 src/components/ReIcon/src/offlineIcon.ts 注册过的图标，不仅菜单可以使用，在全局都能直接使用哦，无需引入。比如下面这种用法

    <script setup lang="ts">
+import { useRenderIcon } from "@/components/ReIcon/src/hooks";
+</script>
+
+<template>
+  <IconifyIconOffline icon="homeFilled" />
+  <!-- or -->
+  <el-input :prefix-icon="useRenderIcon('homeFilled')" />
+</template>
+

    但是平台并不推荐把所有图标都引入到该文件，因为该文件会在页面登录进去之后（非首屏加载哦）一次性加载里面的所有图标，所以这里最好只引入菜单相关的图标，至于非菜单图标怎么用您可以查看这里 基础用法

    # 在线图标

    使用非常简单，我们在 icones (opens new window) 找到所需的图标，复制放到 icon 属性里就行，如下图

    注意

    需注意在线图标的共性是都有一个 : 符号，所以这也要求您在使用本地图标时，本地图标名绝对不能存在 : 可以使用驼峰写法 具体逻辑代码 (opens new window)

    # 图标插件

    您可能好奇 vscode 里代码居然可以直接显示图标，如下图

    vscode-iconify

    其实这是一款 vscode 插件，来到 vscode 扩展商店输入 antfu.iconify 搜索安装即可，如下图

    vscode-iconify2

    温馨提示 ❤️

    IconifyIconOffline、IconifyIconOnline、FontIcon 这三个图标组件比较常用，所以均已 全局注册 (opens new window)，可直接在 vue 文件中引入即可，不需要在局部注册了

    上次更新: 2024/04/05, 09:11:09
    打包和部署
    主题和暗黑模式

    + ← + 主题和暗黑模式→ +

    + Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
    + + + diff --git a/pages/introduction/index.html b/pages/introduction/index.html new file mode 100644 index 0000000..ca7b407 --- /dev/null +++ b/pages/introduction/index.html @@ -0,0 +1,43 @@ + + + + + + 介绍 | ronna-admin-doc + + + + + + + + + + +
    ronna-admin-doc
    目录

    介绍

    ronna-admin (opens new window) 是一款开源完全免费且开箱即用的中后台管理系统模版。完全采用 ECMAScript 模块（ESM）规范来编写和组织代码，使用了最新的 Vue3、Vite、Element-Plus、TypeScript、Pinia、Tailwindcss 等主流技术开发

    # 在线预览

    # 完整版本

    # 浏览器支持

    本地开发推荐使用 Chrome、Edge、Firefox 浏览器，作者常用的是最新版 Chrome 浏览器
    +实际使用中感觉 Firefox 在动画上要比别的浏览器更加丝滑，只是作者用 Chrome 已经习惯了，看个人爱好选择吧
    +更详细的浏览器兼容性支持请看 Vue 支持哪些浏览器？ (opens new window) 和 Vite 浏览器兼容性 (opens new window)

    Edge (opens new window)
    IE    		 Edge (opens new window)
    Edge    		 Firefox (opens new window)
    Firefox    		 Chrome (opens new window)
    Chrome    		 Safari (opens new window)
    Safari
    不支持 最后两个版本 最后两个版本 最后两个版本 最后两个版本

    # 维护者

    kunlong-luo (opens new window)、suzilong666 (opens new window)

    上次更新: 2024/04/07, 15:35:23
    快速开始

    快速开始→ +

    + Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
    + + + diff --git a/pages/layout/index.html b/pages/layout/index.html new file mode 100644 index 0000000..36e5bfd --- /dev/null +++ b/pages/layout/index.html @@ -0,0 +1,43 @@ + + + + + + 布局 | ronna-admin-doc + + + + + + + + + + +
    ronna-admin-doc
    目录

    布局

    # 左侧菜单模式

    vertical

    查看介绍

    代码实现 (opens new window)

    vertical-detail

    # 顶部菜单模式

    horizontal

    查看介绍

    代码实现 (opens new window)

    horizontal-detail

    # 综合菜单模式

    mixNav

    查看介绍

    代码实现 (opens new window)

    mixNav-detail

    # 左侧双栏模式

    计划中 (opens new window)

    上次更新: 2024/04/05, 09:11:09
    平台配置
    路由和菜单

    + ← + 路由和菜单→ +

    + Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
    + + + diff --git a/pages/nologin/index.html b/pages/nologin/index.html new file mode 100644 index 0000000..609a8ea --- /dev/null +++ b/pages/nologin/index.html @@ -0,0 +1,43 @@ + + + + + + 自定义免登录 | ronna-admin-doc + + + + + + + + + + +
    ronna-admin-doc
    目录

    自定义免登录

    自定义免登录时长具有一定的应用价值，优化了用户体验

    # 优点

    1. 增强用户体验： 通过提供自定义免登录时长的选项，用户可以根据自己的实际需求和喜好来设置登录频率，以提升使用体验
    2. 提升系统安全性：对于不同的环境和使用场景，用户可以根据自身的安全考虑来设定免登录时长。例如，在私人电脑或手机上，用户可能会选择较长的免登录时间以提升使用便利性。相反，在公共电脑上，用户可能会选择较短的免登录时间或者不使用免登录功能，以避免账号安全风险
    3. 紧密符合业务需求：对于管理员或后台管理人员，他们可能需要频繁地登录系统进行功能操作，允许他们自定义免登录时长可以提升工作效率
    4. 促进个性化服务：自定义免登录时长这样的个性化选项可以在一定程度上增加系统的用户友好性，让用户感觉更为贴心，有助于提高用户满意度和忠诚度

    # 如何操作

    来到登录页勾选 7 天内免登录即可，如下图

    nologin1

    平台提供 1、7、30 三种天数供选择，默认 7 天。您也可查看下面的具体实现，修改少量代码即可自定义所需天数。点击天数即可切换

    # 具体实现

    用户登录后判断是否勾选免登录，来给key为multiple-tabs的数据存储到cookie中，如果勾选就设置对应的过期时间，反之不设置 具体代码 (opens new window)

    自定义所需天数在此处配置 (opens new window)

    上次更新: 2024/04/05, 09:11:09
    单点登录
    打包优化

    + ← + 打包优化→ +

    + Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
    + + + diff --git a/pages/optimize/index.html b/pages/optimize/index.html new file mode 100644 index 0000000..877c808 --- /dev/null +++ b/pages/optimize/index.html @@ -0,0 +1,48 @@ + + + + + + vite预构建 | ronna-admin-doc + + + + + + + + + + +
    ronna-admin-doc
    目录

    vite预构建

    主要介绍下如何在 pure-admin 平台进行正确有效的 vite 预构建配置

    # include

    optimizeDeps.include (opens new window) 配置为需要预构建的模块。vite 启动时会将 optimizeDeps.include 里的模块，编译成 esm 格式并缓存到 node_modules/.vite 文件夹，页面加载到对应模块时如果浏览器有缓存就读取浏览器缓存，如果没有会读取本地缓存并按需加载

    :::

    提示

    1. 尤其当您禁用浏览器缓存时（这种情况只应该发生在调试阶段）必须将对应模块加入到 include 里，否则会遇到开发环境切换页面卡顿的问题（vite 会认为它是一个新的依赖包会重新加载并强制刷新页面），因为它既无法使用浏览器缓存，又没有在本地 node_modules/.vite 里缓存
    2. 如果您使用的第三方库是全局引入，也就是引入到 src/main.ts 文件里，就不需要再添加到 include 里了，因为 vite 会自动将它们缓存到 node_modules/.vite

    # exclude

    optimizeDeps.exclude (opens new window) 配置为排除预构建的模块。需要注意的是平台里所有以 @iconify-icons/ 开头引入的的本地图标模块，都应加入到下面的 exclude 里，因为平台推荐本地图标的使用方式是哪里需要哪里引入而且都是单个的引入，不需要预构建，直接让浏览器加载就好

    下面是精简版 optimizeDeps.exclude 配置

    点击查看 
    const exclude = [
+  "@iconify-icons/ep",
+  "@iconify-icons/ri",
+  "@pureadmin/theme/dist/browser-utils",
+];
+

    推荐阅读

    上次更新: 2024/04/05, 09:11:09
    打包优化
    常见问题

    + ← + 常见问题→ +

    + Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
    + + + diff --git a/pages/recommendation/index.html b/pages/recommendation/index.html new file mode 100644 index 0000000..b42e93a --- /dev/null +++ b/pages/recommendation/index.html @@ -0,0 +1,42 @@ + + + + + + 技术网站推荐 | ronna-admin-doc + + + + + + + + + + +
    ronna-admin-doc

    技术网站推荐

    收集一些 有用、常用、好用 的网站

    vue3 官方中文文档 (opens new window) vite 官方中文文档 (opens new window) element-plus 官方中文文档 (opens new window)
    pinia 官方中文文档 (opens new window) vue-router 官方中文文档 (opens new window) Tailwind CSS 官方文档 (opens new window)
    vitest 官方中文文档 (opens new window) es6 中文文档 (opens new window) axios 官方中文文档 (opens new window)
    vxetable 官方中文文档 (opens new window) lodash 中文文档 (opens new window) echarts 官方中文文档 (opens new window)
    animate.css 官方文档 (opens new window) 设计师必备网站 (opens new window) JavaScript 中文文档 (opens new window)
    JavaScript 风格指南一 (opens new window) JavaScript 风格指南二 (opens new window) rollup 官方中文文档 (opens new window)
    vueuse 文档 (opens new window) dayjs 官方中文文档 (opens new window) typescript 官方中文文档 (opens new window)
    swiper 官方文档 (opens new window) vue-i18n 文档 (opens new window) caniuse 浏览器兼容性查询 (opens new window)
    pnpm 官方中文文档 (opens new window) tauri 中文官方文档 (opens new window) electron 官方中文文档 (opens new window)
    nuxt3 中文文档 (opens new window) vue3 动画库 @vueuse/motion (opens new window) 常用工具函数库 @pureadmin/utils (opens new window)
    Rust 官方文档中文教程 (opens new window) StackBlitz 在线开发工具 (opens new window) React 官方中文文档 (opens new window)
    nodejs 中文文档 (opens new window) ESLint 官方中文文档 (opens new window) Prettier 文档 (opens new window)
    Stylelint 中文文档 (opens new window) Babel 中文文档 (opens new window) esbuild 中文文档 (opens new window)
    tippy.js文档 (opens new window) vue-tippy文档 (opens new window)
    上次更新: 2024/04/05, 09:11:09
    git常用命令

    + ← +

    + Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
    + + + diff --git a/pages/request/index.html b/pages/request/index.html new file mode 100644 index 0000000..62bf3bc --- /dev/null +++ b/pages/request/index.html @@ -0,0 +1,231 @@ + + + + + + http请求 | ronna-admin-doc + + + + + + + + + + +
    ronna-admin-doc
    目录

    http请求

    # Mock

    平台使用 vite-plugin-fake-server (opens new window) 插件并集成了 @faker-js/faker (opens new window)，支持常用的 post、get 请求方式，仅用于本地开发，生产环境请务必删除 mock

    # 基础用法

    ① 来到 mock (opens new window) 文件存放目录，比如添加 login 接口，采用 post 请求，参考下面代码。

    点击查看 
    import { MockMethod } from "vite-plugin-mock";
+
+export default [
+  {
+    url: "/login",
+    method: "post",
+    response: ({ body }) => {
+      return {
+        success: true,
+        data: {},
+      };
+    },
+  },
+] as MockMethod[];
+

    ② 上面我们添加了 login 接口，接着来到 api (opens new window) 目录，比如添加 user.ts 文件，参考下面代码

    点击查看 
    import { http } from "@/utils/http";
+
+// 这里定义返回值类型，使接口拥有良好的类型推导
+export type UserResult = {
+  /** 是否请求成功 */
+  success: boolean;
+  data: {
+    /** 用户名 */
+    username: string;
+    /** 当前登陆用户的角色 */
+    roles: Array<string>;
+    /** `token` */
+    accessToken: string;
+    /** 用于调用刷新`accessToken`的接口时所需的`token` */
+    refreshToken: string;
+    /** `accessToken`的过期时间（格式'xxxx/xx/xx xx:xx:xx'） */
+    expires: Date;
+  };
+};
+
+/** 登录接口 */
+export const getLogin = (data?: object) => {
+  return http.request<UserResult>("post", "/login", { data });
+};
+

    ③ 上面导出了 getLogin 接口，接下来我们来到需要使用这个接口的地方导入，参考下面代码

    点击查看 
    <script setup lang="ts">
+import { getLogin } from "@/api/user";
+
+async function onLogin() {
+  let result = await getLogin({ username: "admin", password: "admin123" });
+  if (result.success) {
+    console.log(result.data);
+  }
+}
+</script>
+
+<template>
+  <el-button @click="onLogin">点击登录</el-button>
+</template>
+

    您可以注意到我们在上面 ② 步骤中定义了接口返回值类型 UserResult，在使用时就会获得良好的类型推导，如下图

    type

    # 如何快速删除 mock

    来到 build/plugins.ts (opens new window) 文件，将 import { viteMockServe } from "vite-plugin-mock"; 注释，最后把 这里选中 (opens new window) 的都注释即可

    # Axios

    # 中文文档

    点击查看中文文档 (opens new window)

    # 基本请求方式

    平台封装了 axios (opens new window)，支持的请求方式请看 具体参考 (opens new window)，下面举例常用的四种请求方式

    # get 请求
    点击查看 
    import { http } from "@/utils/http";
+
+// params传参
+export const textRequest = (params?: object) => {
+  return http.request("get", "/xxx", { params });
+};
+
+// url拼接传参
+export const textRequest = (params?: object) => {
+  return http.request("get", "/xxx?message=" + params);
+};
+
    # post 请求
    点击查看 
    import { http } from "@/utils/http";
+
+// params传参
+export const textRequest = (params?: object) => {
+  return http.request("post", "/xxx", { params });
+};
+
+// data传参
+export const textRequest = (data?: object) => {
+  return http.request("post", "/xxx", { data });
+};
+
    # delete 请求
    点击查看 
    import { http } from "@/utils/http";
+
+// params传参
+export const textRequest = (params?: object) => {
+  return http.request("delete", "/xxx", { params });
+};
+
+// data传参
+export const textRequest = (data?: object) => {
+  return http.request("delete", "/xxx", { data });
+};
+
    # put 请求
    点击查看 
    import { http } from "@/utils/http";
+
+// params传参
+export const textRequest = (params?: object) => {
+  return http.request("put", "/xxx", { params });
+};
+
+// data传参
+export const textRequest = (data?: object) => {
+  return http.request("put", "/xxx", { data });
+};
+
    # http.request 传参解析

    http.request 源码 (opens new window)，参数解析如下

    参数属性 说明 类型
    method 请求方式 RequestMethods
    url 请求地址 string
    param 请求参数 AxiosRequestConfig
    axiosConfig 自定义axios配置 PureHttpRequestConfig

    提示

    当然平台不仅提供了 http.request 方法让您发送请求，还提供两种额外的请求方式 http.post (opens new window)、http.get (opens new window)，当然这两种也是基于 http.request 封装的，也会走请求拦截和响应拦截，如果您需要脱离平台封装的请求，可以直接使用 axios，类似参考 src/views/welcome/index.vue (opens new window)

    # 如何与后台联调

    # 跨域与解决办法
    # 什么是跨域

    跨域本质是浏览器基于同源策略的一种安全手段。同源策略（Sameoriginpolicy），是一种约定，它是浏览器最核心也最基本的安全功能。当协议（protocol）、主机（host）、端口（port）其中一项不相同的时候就会产生跨域。跨域只产生在浏览器，这也是为什么您用 postman 请求接口时不会有跨域问题的原因

    # 解决办法

    ① 本地开发的话，我们来到 vite.config.ts (opens new window)，参考下面代码配置本地跨域代理即可

    proxy: {
+  "/api": {
+    // 这里填写后端地址
+    target: "http://127.0.0.1:3000",
+    changeOrigin: true,
+    rewrite: path => path.replace(/^\/api/, "")
+  }
+}
+

    ② 配置好上面的跨域代理后，来到 src/api (opens new window) 目录，这里我们先新建一个 utils.ts 文件用来配置环境，参考下面代码

    注意：这里又分两种写法

    第一种（也是最常用的一种，满足大多数场景，首选这种写法哦）：比如后端使用 spring cloud 微服务架构，不同服务可能会部署在不同机器上，这时候前端必定产生跨域，推荐部署前端项目首选 nginx (opens new window)，可以利用 nginx 的代理转发功能来解决跨域问题

    utils.ts

    export const baseUrlApi = (url: string) => `/api/${url}`;
+

    第二种：前端打包直接丢给后端，放到后端项目里一起部署，协议、主机、端口都相同了，就没有跨域问题

    utils.ts

    export const baseUrlApi = (url: string) =>
+  process.env.NODE_ENV === "development"
+    ? `/api/${url}`
+    : `http://127.0.0.1:3000/${url}`;
+

    ③ 写完上面的 utils.ts 后，继续在 src/api (opens new window) 目录，我们再建一个 user.ts 文件，导出这个接口，供页面调用，参考下面代码

    user.ts

    import { http } from "@/utils/http";
+import { baseUrlApi } from "./utils";
+
+/** 登录 */
+export const getLogin = (data?: object) => {
+  return http.request<any>("post", baseUrlApi("login"), { data });
+};
+

    ④ 上面都完成后，我们在需要调用该接口的地方调用即可，参考 src/store/modules/user.ts (opens new window)

    # 多个后端地址如何联调

    大致步骤和上面差不多，这里我们就简单写一下，具体对比上面的就行

    ① 在 vite.config.ts 写入下面代码

    proxy: {
+  // 第一个代理后端地址
+  "/api": {
+    target: "http://127.0.0.1:3000",
+    changeOrigin: true,
+    rewrite: path => path.replace(/^\/api/, "")
+  },
+  // 第二个代理后端地址
+  "/otherApi": {
+    target: "http://127.0.0.1:3290",
+    changeOrigin: true,
+    rewrite: path => path.replace(/^\/otherApi/, "")
+  },
+  // websocket地址（知识点：wss只能在https安全协议下使用）
+  // "/wsApi": {
+  //   target: "ws://localhost:3000",
+  //   ws: true,
+  // },
+  // ...依此类推，有几个后端地址就写几个后端地址
+}
+

    ② 在 utils.ts 里我们采用第一种写法，参考下面代码

    utils.ts

    // 第一个代理后端地址
+export const baseUrlApi = (url: string) => `/api/${url}`;
+// 第二个代理后端地址
+export const baseUrlOtherApi = (url: string) => `/otherApi/${url}`;
+

    ③ 第一个代理后端地址上面建的是 user.ts 文件，那么第二个代理后端地址我们就建个 other.ts 文件吧，参考下面代码

    other.ts

    import { http } from "@/utils/http";
+import { baseUrlOtherApi } from "./utils";
+
+/** 该接口采用 http://127.0.0.1:3290 后端地址 */
+export const getOther = (data?: object) => {
+  return http.request<any>("get", baseUrlOtherApi("other"), { data });
+};
+

    最后，需要在哪里调用，引入使用即可

    # 如何声明接口返回值类型

    可以看到上面的写法 http.request 后面跟的都是 any，这很不友好，参考下面友好类型写法即可

    import { http } from "@/utils/http";
+import { baseUrlApi } from "./utils";
+
+// 定义 login 接口返回值类型为 UserResult
+export type UserResult = {
+  /** 是否请求成功 */
+  success: boolean;
+  data: {
+    /** 用户名 */
+    username: string;
+    /** 当前登陆用户的角色 */
+    roles: Array<string>;
+    /** `token` */
+    accessToken: string;
+    /** 用于调用刷新`accessToken`的接口时所需的`token` */
+    refreshToken: string;
+    /** `accessToken`的过期时间（格式'xxxx/xx/xx xx:xx:xx'） */
+    expires: Date;
+  };
+};
+
+/** 登录 */
+export const getLogin = (data?: object) => {
+  return http.request<UserResult>("post", baseUrlApi("login"), { data });
+};
+

    # 平台封装的请求可以设置额外的 axios 配置吗

    当然可以。点击查看这里，可以看到自定义 axios 配置中 axiosConfig 作为最后一个参数

    import { http } from "@/utils/http";
+import { baseUrlApi } from "./utils";
+
+export const testRequest = (data?: object) => {
+  return http.request<any>(
+    "post",
+    baseUrlApi("login"),
+    { data },
+    // 自定义的axios配置在下面对象填写即可
+    {
+      headers: {
+        "Content-Type": "application/x-www-form-urlencoded",
+      },
+    }
+  );
+};
+

    # JWT Token（内置无感刷新 token 解决方案）

    实现原理：后端返回两个 token（一个用来请求，一个用来刷新）和过期时间，前端将其进行本地存储，每当接口请求时，把本地存储的过期时间与本地当前时间对比，如果 token 过期就把当前请求暂存，然后去请求刷新 token 接口，获取到新 token 后，再 触发 (opens new window) 暂存的请求

    # 信息存储

    具体看 src/utils/auth (opens new window) 文件，里面有很详细的备注

    # 细节处理

    ① 不需要携带 token 的接口我们设置了 请求白名单 (opens new window)

    ② 当 token 过期后，平台会暂存请求，直到拿到新 token 才会请求，避免了当页面有多个请求会重复刷新 token 的问题。核心代码有三处：一 (opens new window)、二 (opens new window)、三 (opens new window)

    生产环境 Mock 可以和真实接口共存吗？

    当然可以共存，不过可能会遇到 Mock 干扰真实接口的问题。如果您在开发环境接口没问题，但是到生产环境出问题了，在排除后端问题前提下可以尝试 删除 Mock

    上次更新: 2024/04/05, 09:11:09
    路由和菜单
    打包和部署

    + ← + 打包和部署→ +

    + Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
    + + + diff --git a/pages/routerMenu/index.html b/pages/routerMenu/index.html new file mode 100644 index 0000000..7b3ebff --- /dev/null +++ b/pages/routerMenu/index.html @@ -0,0 +1,689 @@ + + + + + + 路由和菜单 | ronna-admin-doc + + + + + + + + + + +
    ronna-admin-doc
    目录

    路由和菜单

    路由和菜单是极为重要的，配置正确很关键，平台尽最大可能详细描述

    # 路由和菜单配置

    点击查看完整路由和菜单配置 
    interface RouteConfigsTable {
+  // 路由路径
+  path: string;
+  // 路由名称（必须保持唯一）
+  name: string;
+  // 路由重定向（默认跳转地址）
+  redirect: string;
+  // 路由元信息，通俗来说就是路由上的额外信息 https://router.vuejs.org/zh/guide/advanced/meta.html#%E8%B7%AF%E7%94%B1%E5%85%83%E4%BF%A1%E6%81%AF
+  meta: {
+    // 菜单名称（兼容国际化、非国际化，如果用国际化的写法就必须在根目录的locales文件夹下对应添加）
+    title: string;
+    // 菜单图标
+    icon: string | FunctionalComponent | IconifyIcon;
+    // 是否在菜单中显示
+    showLink: boolean;
+    // 菜单排序，值越高排的越后（只针对顶级路由）
+    rank: number;
+  };
+  // 子路由配置项
+  children: [
+    {
+      // 路由路径
+      path: string;
+      // 路由名称（必须唯一并且和当前路由component字段对应的页面里用defineOptions包起来的name保持一致）
+      name: string;
+      // 路由重定向
+      redirect: string;
+      // 按需加载需要展示的页面
+      component: RouteComponent;
+      // 路由元信息
+      meta: {
+        // 菜单名称（兼容国际化、非国际化，如果用国际化的写法就必须在根目录的locales文件夹下对应添加）
+        title: string;
+        // 菜单图标
+        icon: string | FunctionalComponent | IconifyIcon;
+        // 菜单名称右侧的额外图标
+        extraIcon: string | FunctionalComponent | IconifyIcon;
+        // 是否显示该菜单
+        showLink: boolean;
+        // 是否显示父级菜单
+        showParent: boolean;
+        // 页面级别权限设置
+        roles: Array<string>;
+        // 按钮级别权限设置
+        auths: Array<string>;
+        // 是否缓存该路由页面（开启后，会保存该页面的整体状态，刷新后会清空状态）
+        keepAlive: boolean;
+        // 需要内嵌的iframe链接地址
+        frameSrc: string;
+        // 内嵌的iframe页面是否开启首次加载动画
+        frameLoading: boolean;
+        // 页面加载动画（两种模式，第二种权重更高，第一种直接采用vue内置的transitions动画，第二种是使用animate.css编写进、离场动画，平台更推荐使用第二种模式，已经内置了animate.css，直接写对应的动画名即可）
+        transition: {
+          // 当前页面动画，这里是第一种模式，比如 name: "fade" 更具体看后面链接 https://cn.vuejs.org/api/built-in-components.html#transition
+          name: string;
+          // 当前页面进场动画，这里是第二种模式，比如 enterTransition: "animate__fadeInLeft"
+          enterTransition: string;
+          // 当前页面离场动画，这里是第二种模式，比如 leaveTransition: "animate__fadeOutRight"
+          leaveTransition: string;
+        };
+        // 当前菜单名称或自定义信息禁止添加到标签页
+        hiddenTag: boolean;
+        // 显示在标签页的最大数量，需满足后面的条件：不显示在菜单中的路由并且是通过query或params传参模式打开的页面。在完整版全局搜dynamicLevel即可查看代码演示
+        dynamicLevel: number;
+        // 将某个菜单激活（主要用于通过query或params传参的路由，当它们通过配置showLink: false后不在菜单中显示，就不会有任何菜单高亮，而通过设置activePath指定激活菜单即可获得高亮，activePath为指定激活菜单的path）
+        activePath: string;
+      };
+    },
+  ],
+};
+

    # 静态路由

    在前端代码里写上固定的路由即静态路由。平台支持任意层级菜单格式，下面列举最常用的菜单层级模式，更深层级按照下面格式即可

    阅读前须知

    一般来说一级菜单代表无任何子菜单的菜单，二级菜单代表一级菜单下面有子菜单，三级菜单代表二级菜单下面有子菜单 以此类推

    # 如何生成一级菜单

    点击查看

    比如我们要生成一个名为 加油 的菜单

    1. 新建 src/router/modules/welcome.ts 文件，加入如下代码

    fighting.ts

    // 最简代码，也就是这些字段必须有
+export default {
+  path: "/",
+  name: "Home",
+  component: Layout,
+  redirect: "/welcome",
+  meta: {
+    icon: "ep:home-filled",
+    title: $t("menus.hshome"),
+    rank: home
+  },
+  children: [
+    {
+      path: "/welcome",
+      name: "Welcome",
+      component: () => import("@/views/welcome/index.vue"),
+      meta: {
+        title: $t("menus.hshome"),
+        showLink: VITE_HIDE_HOME === "true" ? false : true
+      }
+    }
+  ]
+} satisfies RouteConfigsTable;
+
    1. 新建 src/views/fighting/index.vue 文件，加入如下代码

    index.vue

    <script setup lang="ts">
+defineOptions({
+  // name 作为一种规范最好必须写上并且和路由的name保持一致
+  name: "Welcome"
+});
+</script>
+
+<template>
+  <h1>Welcome</h1>
+</template>
+

    上面所写代码如下图效果

    static1

    # 如何生成二级菜单（两种模式）

    # 第一种（该模式针对父级菜单下只有一个子菜单的情况，在子菜单的 meta 属性中加上 showParent: true 即可）

    点击查看 
    // 最简代码，也就是这些字段必须有
+export default {
+  path: "/fighting",
+  meta: {
+    title: "励志"
+  },
+  children: [
+    {
+      path: "/fighting/index",
+      name: "Fighting",
+      component: () => import("@/views/fighting/index.vue"),
+      meta: {
+        title: "加油",
+        // 通过设置showParent为true，显示父级
+        showParent: true
+      }
+    }
+  ]
+};
+

    如下图效果

    static2

    # 第二种（该模式针对父级菜单下有大于或等于两个子菜单的情况）

    点击查看 
    // 最简代码，也就是这些字段必须有
+export default {
+  path: "/fighting",
+  meta: {
+    title: "励志"
+  },
+  children: [
+    {
+      path: "/fighting/index",
+      name: "Fighting",
+      component: () => import("@/views/fighting/index.vue"),
+      meta: {
+        title: "加油"
+      }
+    },
+    {
+      path: "/fighting/effort",
+      name: "Effort",
+      component: () => import("@/views/fighting/effort.vue"),
+      meta: {
+        title: "努力"
+      }
+    }
+  ]
+};
+

    如下图效果

    static3

    # 如何生成三级菜单（两种模式）

    # 第一种（该模式针对父级菜单下只有一个子菜单的情况，在子菜单的 meta 属性中加上 showParent: true 即可）

    点击查看 
    // 最简代码，也就是这些字段必须有
+export default {
+  path: "/nested",
+  meta: {
+    title: "多级菜单"
+  },
+  children: [
+    {
+      path: "/nested/menu1",
+      meta: {
+        title: "菜单1"
+      },
+      children: [
+        {
+          path: "/nested/menu1/menu1-1",
+          component: () => import("@/views/nested/menu1/menu1-1/index.vue"),
+          name: "Menu1-1",
+          meta: {
+            title: "菜单1-1",
+            // 通过设置showParent为true，显示父级
+            showParent: true
+          }
+        }
+      ]
+    }
+  ]
+};
+

    如下图效果

    static4

    # 第二种（该模式针对父级菜单下有大于或等于两个子菜单的情况）

    点击查看 
    // 最简代码，也就是这些字段必须有
+export default {
+  path: "/nested",
+  meta: {
+    title: "多级菜单"
+  },
+  children: [
+    {
+      path: "/nested/menu1",
+      meta: {
+        title: "菜单1"
+      },
+      children: [
+        {
+          path: "/nested/menu1/menu1-1",
+          component: () => import("@/views/nested/menu1/menu1-1/index.vue"),
+          name: "Menu1-1",
+          meta: {
+            title: "菜单1-1"
+          }
+        },
+        {
+          path: "/nested/menu1/menu1-2",
+          component: () => import("@/views/nested/menu1/menu1-2/index.vue"),
+          name: "Menu1-2",
+          meta: {
+            title: "菜单1-2"
+          }
+        }
+      ]
+    }
+  ]
+};
+

    如下图效果

    static5

    # 如何生成四级菜单（两种模式）

    # 第一种（该模式针对父级菜单下只有一个子菜单的情况，在子菜单的 meta 属性中加上 showParent: true 即可）

    点击查看 
    // 最简代码，也就是这些字段必须有
+export default {
+  path: "/nested",
+  meta: {
+    title: "多级菜单"
+  },
+  children: [
+    {
+      path: "/nested/menu1",
+      meta: {
+        title: "菜单1"
+      },
+      children: [
+        {
+          path: "/nested/menu1/menu1-1",
+          meta: {
+            title: "菜单1-1"
+          },
+          children: [
+            {
+              path: "/nested/menu1/menu1-1/menu1-1-1",
+              component: () =>
+                import("@/views/nested/menu1/menu1-1/menu1-1-1/index.vue"),
+              name: "Menu1-1-1",
+              meta: {
+                title: "菜单1-1-1",
+                // 通过设置showParent为true，显示父级
+                showParent: true
+              }
+            }
+          ]
+        }
+      ]
+    }
+  ]
+};
+

    如下图效果

    static6

    # 第二种（该模式针对父级菜单下有大于或等于两个子菜单的情况）

    点击查看 
    // 最简代码，也就是这些字段必须有
+export default {
+  path: "/nested",
+  meta: {
+    title: "多级菜单"
+  },
+  children: [
+    {
+      path: "/nested/menu1",
+      meta: {
+        title: "菜单1"
+      },
+      children: [
+        {
+          path: "/nested/menu1/menu1-1",
+          meta: {
+            title: "菜单1-1"
+          },
+          children: [
+            {
+              path: "/nested/menu1/menu1-1/menu1-1-1",
+              component: () =>
+                import("@/views/nested/menu1/menu1-1/menu1-1-1/index.vue"),
+              name: "Menu1-1-1",
+              meta: {
+                title: "菜单1-1-1"
+              }
+            },
+            {
+              path: "/nested/menu1/menu1-1/menu1-1-2",
+              component: () =>
+                import("@/views/nested/menu1/menu1-1/menu1-1-2/index.vue"),
+              name: "Menu1-1-2",
+              meta: {
+                title: "菜单1-1-2"
+              }
+            }
+          ]
+        }
+      ]
+    }
+  ]
+};
+

    如下图效果

    static7

    # 注意点

    # 国际化

    只需要在路由 meta 的 title 字段中使用国际化写法即可，比如 title: "menus.hsabnormal"
    +这个 menus.hsabnormal 必须在 locales 文件夹下进行配置哦，如下图

    static12

    # 重定向

    可以看到上面生成菜单的路由配置项我并没有加上 redirect 属性，当使用 fighting 路径跳转时，就会跑到 404 页面

    所以我们最好在写静态路由配置时将父级加上 redirect 属性，redirect 可以填写您想要重定向的 path 即可，具体可以参考 src/router/modules/nested.ts (opens new window)

    # 类型提示

    分两种

    1. export default 后跟 {}，这也是最常用的一种，在路由的配置项最后加上 satisfies RouteConfigsTable 即可获得类型提示，如下图

    static10

    1. export default 后跟 []，在路由的配置项最后加上 as Array<RouteConfigsTable> 即可获得类型提示，如下图

    static11

    您肯定想问 RouteConfigsTable 是哪里来的呢？

    我在这呢，快快点我查看 😊 (opens new window)

    # 添加无 layout 的页面

    使用场景：需要外嵌平台某个页面，不需要展示菜单导航以及额外模块，只需要展示业务内容模块
    +无 layout 页面也就相当于一个全屏空白页面，没有菜单导航以及额外模块

    如何添加？

    1. 在 src/router/modules/remaining.ts 文件添加对应路由 具体参考 (opens new window)

    2. 添加对应业务代码页面 具体参考 (opens new window)

    温馨提示

    必须在 src/router/modules/remaining.ts 文件添加哦

    # 禁止修改或删除的路由

    src/router/modules 文件夹里的 home.ts、remaining.ts、error.ts 这三个文件不可修改或删除，因为平台的某些核心逻辑是根据这三个文件作处理

    static8

    如果不想在页面显示，在顶级路由的 meta 属性加上 showLink: false 即可，如下图

    static9

    # 如何只要静态路由

    平台在登录时默认会走 getAsyncRoutes (opens new window) 接口请求后端返回的动态路由，默认用 mock (opens new window) 模拟返回，如果只要静态路由，按照下面两个步骤修改即可

    1. 在 src/views/login/index.vue 文件作如下改动
    <script setup lang="ts">
+import { setToken } from "@/utils/auth";
+import { addPathMatch } from "@/router/utils";
+import { usePermissionStoreHook } from "@/store/modules/permission";
+
+const onLogin = async (formEl: FormInstance | undefined) => {
+  loading.value = true;
+  if (!formEl) return;
+  await formEl.validate((valid, fields) => {
+    if (valid) {
+      setToken({
+        username: "admin",
+        roles: ["admin"],
+        accessToken: "eyJhbGciOiJIUzUxMiJ9.admin"
+      } as any);
+      // 全部采取静态路由模式
+      usePermissionStoreHook().handleWholeMenus([]);
+      addPathMatch();
+      router.push("/");
+      message("登录成功", { type: "success" });
+    } else {
+      loading.value = false;
+      return fields;
+    }
+  });
+};
+</script>
+

    static13

    1. 在 src/router/index.ts 文件作如下改动
    import { addPathMatch } from "./utils";
+
+// 使用下面方法替换initRouter
+usePermissionStoreHook().handleWholeMenus([]);
+addPathMatch();
+if (!useMultiTagsStoreHook().getMultiTagsCache) {
+  const { path } = to;
+  const route = findRouteByPath(path, router.options.routes[0].children);
+  // query、params模式路由传参数的标签页不在此处处理
+  if (route && route.meta?.title) {
+    useMultiTagsStoreHook().handleTags("push", {
+      path: route.path,
+      name: route.name,
+      meta: route.meta,
+    });
+  }
+}
+

    static15 static16

    # 动态路由

    后端返回的路由即动态路由。平台支持任意层级菜单格式，下面列举最常用的菜单层级模式，更深层级按照下面格式即可

    平台用 mock 模拟后端，下面举例也是用 mock 举例哦，当然和后端返回的路由格式是一模一样的

    阅读前须知

    后端传 path 或传 component，平台对这两种模式都做了兼容 具体实现代码 1 (opens new window) 具体实现代码 2 (opens new window)

    第一种：下面所有生成菜单例子中的 path 都有个规则：如果这个 path 对应的是实际业务 .vue 或 .tsx 代码，就必须跟实际业务 .vue 或 .tsx 代码路径保持一致

    第二种：菜单的 component 对应实际业务 .vue 或 .tsx 代码路径，这时 path 可以随便写啦，但是前面必须有个 / ，比如 path: '/anything' （这种情况我只在 如何生成一级菜单 里举例，多级菜单写法类似）

    点击查看具体实现代码逻辑解析



     









     













     
     
     
     








    // 具体实现代码1高亮处解析：
+// 将/src/views/文件里所有的.vue和.tsx文件塞进modulesRoutes变量
+// 当然这里只匹配了`.vue`和`.tsx`，如果您想匹配别的在下面 {} 加上即可，记得用 , 分开
+const modulesRoutes = import.meta.glob("/src/views/**/*.{vue,tsx}");
+
+// 具体实现代码2高亮处解析：
+// addAsyncRoutes函数作用为过滤后端传来的动态路由，重新生成规范路由，
+// 先读取后端返回的所有路由，从中过滤出component和path字段，然后在modulesRoutesKeys中对应匹配，
+// 如果对应路由同时匹配到component和path，优先以component为主，这样您的path路径就可以随便写啦，
+// 如果匹配到path未匹配到component，path必须按上面提到的跟实际业务`.vue`或`.tsx`代码路径保持一致，
+// 如果匹配到component未匹配到path或者两个都未匹配到，我想问问您咱能好好玩不😭
+function addAsyncRoutes(arrRoutes: Array<RouteRecordRaw>) {
+  if (!arrRoutes || !arrRoutes.length) return;
+  const modulesRoutesKeys = Object.keys(modulesRoutes);
+  arrRoutes.forEach((v: RouteRecordRaw) => {
+    // 将backstage属性加入meta，标识此路由为后端返回路由
+    v.meta.backstage = true;
+    // 父级的redirect属性取值：如果子级存在且父级的redirect属性不存在，默认取第一个子级的path；如果子级存在且父级的redirect属性存在，取存在的redirect属性，会覆盖默认值
+    if (v?.children && v.children.length && !v.redirect)
+      v.redirect = v.children[0].path;
+    // 父级的name属性取值：如果子级存在且父级的name属性不存在，默认取第一个子级的name；如果子级存在且父级的name属性存在，取存在的name属性，会覆盖默认值（注意：测试中发现父级的name不能和子级name重复，如果重复会造成重定向无效（跳转404），所以这里给父级的name起名的时候后面会自动加上`Parent`，避免重复）
+    if (v?.children && v.children.length && !v.name)
+      v.name = (v.children[0].name as string) + "Parent";
+    if (v.meta?.frameSrc) {
+      v.component = IFrame;
+    } else {
+      // 对后端传component组件路径和不传做兼容（如果后端传component组件路径，那么path可以随便写，如果不传，component组件路径会跟path保持一致）
+      const index = v?.component
+        ? modulesRoutesKeys.findIndex(ev => ev.includes(v.component as any))
+        : modulesRoutesKeys.findIndex(ev => ev.includes(v.path));
+      v.component = modulesRoutes[modulesRoutesKeys[index]];
+    }
+    if (v?.children && v.children.length) {
+      addAsyncRoutes(v.children);
+    }
+  });
+  return arrRoutes;
+}
+

    # 如何生成一级菜单

    # 只传 path 模式

    点击查看

    比如我们要生成一个名为 加油 的菜单

    1. 来到 mock/asyncRoutes.ts 文件，加入如下代码

    asyncRoutes.ts

    // 最简代码，也就是这些字段必须有
+const fightingRouter = {
+  path: "/fighting",
+  meta: {
+    title: "加油"
+  },
+  children: [
+    {
+      path: "/fighting/index",
+      name: "Fighting",
+      meta: {
+        title: "加油"
+      }
+    }
+  ]
+};
+
    1. 新建 src/views/fighting/index.vue 文件，加入如下代码

    index.vue

    <script setup lang="ts">
+defineOptions({
+  // name 作为一种规范最好必须写上并且和路由的name保持一致
+  name: "Fighting"
+});
+</script>
+
+<template>
+  <h1>加油</h1>
+</template>
+

    上面所写代码如下图效果

    async1

    # 传 path 和 component 模式

    点击查看

    比如我们要生成一个名为 加油 的菜单

    1. 来到 mock/asyncRoutes.ts 文件，加入如下代码

    asyncRoutes.ts

    // 最简代码，也就是这些字段必须有
+const fightingRouter = {
+  path: "/fighting",
+  meta: {
+    title: "加油"
+  },
+  children: [
+    {
+      // path随便写，但前面必须有个 `/`
+      path: "/anything",
+      // component对应的值前不需要加 / 值对应的是实际业务 `.vue` 或 `.tsx` 代码路径
+      component: "fighting/index",
+      name: "Fighting",
+      meta: {
+        title: "加油"
+      }
+    }
+  ]
+};
+
    1. 新建 src/views/fighting/index.vue 文件，加入如下代码

    index.vue

    <script setup lang="ts">
+defineOptions({
+  // name 作为一种规范最好必须写上并且和路由的name保持一致
+  name: "Fighting"
+});
+</script>
+
+<template>
+  <h1>加油</h1>
+</template>
+

    上面所写代码如下图效果

    async2

    猜您可能有这种想法 🤔️

    async3

    # 如何生成二级菜单（两种模式）

    # 第一种（该模式针对父级菜单下只有一个子菜单的情况，在子菜单的 meta 属性中加上 showParent: true 即可）

    点击查看 
    // 最简代码，也就是这些字段必须有
+const fightingRouter = {
+  path: "/fighting",
+  meta: {
+    title: "励志"
+  },
+  children: [
+    {
+      path: "/fighting/index",
+      name: "Fighting",
+      meta: {
+        title: "加油",
+        // 通过设置showParent为true，显示父级
+        showParent: true
+      }
+    }
+  ]
+};
+

    如下图效果

    async4

    # 第二种（该模式针对父级菜单下有大于或等于两个子菜单的情况）

    点击查看 
    // 最简代码，也就是这些字段必须有
+const fightingRouter = {
+  path: "/fighting",
+  meta: {
+    title: "励志"
+  },
+  children: [
+    {
+      path: "/fighting/index",
+      name: "Fighting",
+      meta: {
+        title: "加油"
+      }
+    },
+    {
+      path: "/fighting/effort",
+      name: "Effort",
+      meta: {
+        title: "努力"
+      }
+    }
+  ]
+};
+

    如下图效果

    async5

    # 如何生成三级菜单（两种模式）

    # 第一种（该模式针对父级菜单下只有一个子菜单的情况，在子菜单的 meta 属性中加上 showParent: true 即可）

    点击查看 
    // 最简代码，也就是这些字段必须有
+const nestedRouter = {
+  path: "/nested",
+  meta: {
+    title: "多级菜单"
+  },
+  children: [
+    {
+      path: "/nested/menu1",
+      meta: {
+        title: "菜单1"
+      },
+      children: [
+        {
+          path: "/nested/menu1/menu1-1/index",
+          name: "Menu1-1",
+          meta: {
+            title: "菜单1-1",
+            // 通过设置showParent为true，显示父级
+            showParent: true
+          }
+        }
+      ]
+    }
+  ]
+};
+

    如下图效果

    async6

    # 第二种（该模式针对父级菜单下有大于或等于两个子菜单的情况）

    点击查看 
    // 最简代码，也就是这些字段必须有
+const nestedRouter = {
+  path: "/nested",
+  meta: {
+    title: "多级菜单"
+  },
+  children: [
+    {
+      path: "/nested/menu1",
+      meta: {
+        title: "菜单1"
+      },
+      children: [
+        {
+          path: "/nested/menu1/menu1-1/index",
+          name: "Menu1-1",
+          meta: {
+            title: "菜单1-1"
+          }
+        },
+        {
+          path: "/nested/menu1/menu1-2/index",
+          name: "Menu1-2",
+          meta: {
+            title: "菜单1-2"
+          }
+        }
+      ]
+    }
+  ]
+};
+

    如下图效果

    async7

    # 如何生成四级菜单（两种模式）

    # 第一种（该模式针对父级菜单下只有一个子菜单的情况，在子菜单的 meta 属性中加上 showParent: true 即可）

    点击查看 
    // 最简代码，也就是这些字段必须有
+const nestedRouter = {
+  path: "/nested",
+  meta: {
+    title: "多级菜单"
+  },
+  children: [
+    {
+      path: "/nested/menu1",
+      meta: {
+        title: "菜单1"
+      },
+      children: [
+        {
+          path: "/nested/menu1/menu1-1",
+          meta: {
+            title: "菜单1-1"
+          },
+          children: [
+            {
+              path: "/nested/menu1/menu1-1/menu1-1-1/index",
+              name: "Menu1-1-1",
+              meta: {
+                title: "菜单1-1-1",
+                // 通过设置showParent为true，显示父级
+                showParent: true
+              }
+            }
+          ]
+        }
+      ]
+    }
+  ]
+};
+

    如下图效果

    async8

    # 第二种（该模式针对父级菜单下有大于或等于两个子菜单的情况）

    点击查看 
    // 最简代码，也就是这些字段必须有
+const nestedRouter = {
+  path: "/nested",
+  meta: {
+    title: "多级菜单"
+  },
+  children: [
+    {
+      path: "/nested/menu1",
+      meta: {
+        title: "菜单1"
+      },
+      children: [
+        {
+          path: "/nested/menu1/menu1-1",
+          meta: {
+            title: "菜单1-1"
+          },
+          children: [
+            {
+              path: "/nested/menu1/menu1-1/menu1-1-1/index",
+              name: "Menu1-1-1",
+              meta: {
+                title: "菜单1-1-1"
+              }
+            },
+            {
+              path: "/nested/menu1/menu1-1/menu1-1-2/index",
+              name: "Menu1-1-2",
+              meta: {
+                title: "菜单1-1-2"
+              }
+            }
+          ]
+        }
+      ]
+    }
+  ]
+};
+

    如下图效果

    async9

    # 注意点

    # 动态路由缓存本地

    平台在 v2.0.0 版本 默认关闭 CachingAsyncRoutes 动态路由缓存本地 (opens new window) 使其在开发环境下调试更方便，不用每次修改动态路由都要先清空本地缓存的动态路由，更推荐在生产环境开启

    开启动态路由缓存本地后会优先读取本地缓存的路由 点击查看具体实现代码 (opens new window) 如果您在开发环境下开启，每次修改动态路由都需要先清空 async-routes 这个键名的 sessionStorage 点击查看参考代码 (opens new window)

    # 国际化

    只需要在路由 meta 的 title 字段中使用国际化写法即可，比如 title: "menus.hssysManagement"
    +这个 menus.hssysManagement 必须在 locales 文件夹下进行配置哦，如下图

    async10

    # 重定向

    动态路由无需填写 redirect 重定向属性 +平台自动处理，逻辑为：如果子级存在且父级的 redirect 属性不存在，默认取第一个子级的 path 作为父级的 redirect

    当然您也可以指定父级的 redirect 重定向属性，平台监测到存在指定父级的 redirect 后，会取指定的属性

    点击查看具体实现代码 (opens new window)

    # 重置路由

    平台的重置路由功能只针对动态路由

    # 常用场景

    用户切换角色或退出登录时需调用重置路由功能，将路由和菜单恢复到初始化状态

    # 基础用法
    import { resetRouter } from "@/router";
+
+resetRouter();
+
    # 具体实现代码

    点击查看具体实现代码 (opens new window)

    # 静态路由、动态路由相同的配置

    下面以动态路由返回举例，静态路由也是相同的配置，区别是静态路由需写在 src/router/modules 里

    # 内嵌 iframe 和外链

    点击查看

    读重点：内嵌 iframe 将地址写进 frameSrc 属性里；外链将地址写进 name 属性里
    +具体代码实现：内嵌 iframe (opens new window) 外链 (opens new window)

    // 最简代码，也就是这些字段必须有
+const frameRouter = {
+  path: "/iframe",
+  meta: {
+    title: "内嵌 iframe 和外链"
+  },
+  children: [
+    // 内嵌 iframe
+    {
+      path: "/iframe/pure",
+      // name必须写，写法随意
+      name: "anything",
+      meta: {
+        title: "内嵌 iframe",
+        // 需要内嵌页面的地址
+        frameSrc: "https://yiming_chang.github.io/pure-admin-doc",
+        // 内嵌的iframe页面是否开启首次加载动画，默认true，下面可以不写，如果内嵌的iframe页面已经存在首加载动画，可以将frameLoading设为false
+        // frameLoading: true
+      }
+    },
+    // 外链
+    {
+      // path必须写，必须以 / 开头，推荐格式 / 后跟随意单词，不同的外链path不要重复哦
+      path: "/anything",
+      // 外链地址写在name属性里
+      name: "https://yiming_chang.github.io/pure-admin-doc",
+      meta: {
+        title: " 外链"
+      }
+    }
+  ]
+};
+

    如下图效果

    same1

    # 菜单排序 rank

    在路由的 meta 里加入 rank 字段即可对菜单进行排序，rank 可不写、可为 null、可为 undefined、可为空值，但是平台推荐 rank 最好加上，对菜单进行有序排列使其看起来整齐，而且还能通过排序把您想要第一眼看到的菜单放到最前面

    点击查看具体实现代码 (opens new window)

    温馨提示

    菜单排序 rank 只对顶级菜单生效 点击查看为何如此设计 (opens new window)

    # 菜单图标 icon

    点击查看如何配置菜单图标

    # 路由页面缓存 keepAlive

    在路由的 meta 里加入 keepAlive: true 即可对当前路由页面进行缓存，被缓存的路由页面不会被销毁

    生效前提：对应页面 name 必须与路由的 name 保持一致

    same4

    虽然 vue-router 官方只支持到二级 keep-alive 缓存，但平台对路由进行了 处理 (opens new window)，只要对当前路由设置了 keepAlive: true，并且对应的页面 name 与路由的 name 保持一致，不管层级多深都会支持 keep-alive 缓存

    # 页面进场、离场动画定制化 transition

    在路由的 meta 里加入下面代码即可定制化单个页面进场、离场动画，平台内置了 Animate.css ，所以您直接在 Animate.css (opens new window) 最右侧复制所需动画即可

    transition: {
+  // 页面进场动画
+  enterTransition: "animate__fadeInRight",
+  // 页面离场动画
+  leaveTransition: "animate__fadeOutDown"
+}
+

    点击查看具体实现代码 (opens new window)

    # 页面和按钮级别权限设置

    平台内置 RBAC 权限模式，无论静态还是动态路由，配置都会生效，点击查看具体 RBAC 权限讲解

    # 常见疑问

    # 为什么路由的 name 必写，而且必须唯一

    1. 没有硬编码的 URL ；params 的自动编码/解码；防止在 url 中出现打字错误；绕过路径排序（如显示一个） 点击了解具体 (opens new window)
    2. 虽然跳转路由有很多方式，但平台只推荐使用 name 跳转，如下面写法。优点：一是写法简单，尤其当 path 稍长时优点更突出，因为 name 只有一个单词；二是规范统一，都用 name 跳转也方便维护。尤其当项目过大时对整体维护起关键作用
    <script setup lang="ts">
+import { useRouter } from "vue-router";
+
+const router = useRouter();
+router.push({ name: 'Fighting' })
+</script>
+
    1. 平台的某些关键模块（路由模块、标签模块等）都依赖 name，所以独一无二的 name 对平台的稳定性起关键作用

    # 为什么路由的 name 需和页面的 name 保持一致？

    正常情况下这并不是硬性要求，而是一种规范，方便维护查找，通过路由 name 全局搜索即可知道对应页面代码位置，通过页面对应的 name 也可知道其对应哪个路由

    当然，如果当前路由页面需要 路由页面缓存 keepAlive 就必须保持一致

    # 更多路由跳转示例代码

    点击查看示例代码 (opens new window)

    效果如下

    more

    上次更新: 2024/04/05, 09:11:09
    布局
    http请求

    + ← + http请求→ +

    + Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
    + + + diff --git a/pages/service/index.html b/pages/service/index.html new file mode 100644 index 0000000..5bbb2c1 --- /dev/null +++ b/pages/service/index.html @@ -0,0 +1,49 @@ + + + + + + 优质服务 | ronna-admin-doc + + + + + + + + + + +
    ronna-admin-doc
    目录

    优质服务

    非常感谢您选择了 ronna-admin。作者每天都在维护它，在保证其稳定的同时将 95% 的依赖包保持最新。所以您不用因为升级依赖包而头疼，因为我们会把坑都踩了。当某些依赖包（如vue、vite、element-plus等）发布版本不久后，我们会跟进升级，让您在快速迭代的前端中时刻享受着最新依赖包带来的便利！

    在代码、文档全部永久免费的基础上，我们还引入了更优质的可选服务，以满足您的各种需求！

    从 2018 年开始搞开源，一直到 2024 年一直维护 ronna-admin (opens new window) 组织中所有项目，把热爱一直持续下去，将开源真正当作一项事业来做，为用户提供更好的解决方案和服务，求各位老板的支持呀 ❤️！

    # 项目重构、项目升级

    价格：根据重构、升级难度进行合理定价
    +服务内容：旧版 ronna-admin 升级最新版（通常需要一天包升级到位）、vue2 项目升级 vue3、自己项目某些依赖包想升级最新或升级时遇到瓶颈等
    +如何获得服务：加最上方作者微信备注 重构升级 即可

    # 技术指导、远程服务、面试指导、自定义服务

    价格：根据问题难度进行合理定价，按次收费
    +服务内容：各种前端问题解答、修复等。如果您还有别的需求尽管提，都会合理定价，包您满意
    +如何获得服务：加最上方作者微信备注 技术指导 即可

    # 页面定制开发（软件开发、项目外包）

    价格：根据页面数量、每页难度、开发周期进行合理定价
    +服务内容：软件开发过程中保证 页面高还原度、代码高质量、全方位多次测试 。软件交付完毕后，不论您的软件工程量是大是小，我们都会提供 一年免费技术支持（免费小修、小改等），绝不辜负您选择了我们！
    +如何获得服务：加最上方作者微信备注 软件开发 即可

    开发范围 范围种类
    网站 后台系统、可视化大屏、企业宣传页、活动推广页等各种只要能在浏览器查看的都能开发
    h5页面 移动端网站、广告推广、电子商务等
    小程序 微信、支付宝、抖音、快手、京东小程序等
    移动应用程序 可安装到安卓Android和苹果iOS系统的手机App软件
    桌面应用程序 可安装到桌面操作系统（如Windows、MacOS、Linux）上的软件，可直接在电脑上运行

    # 企业赞助

    成为赞助商即可获得以下服务

    1. 将贵公司 LOGO 同时展示在 ronna-admin 预览官网 (opens new window) 、ronna-admin 文档官网 (opens new window) 以及 GitHub 仓库 README (opens new window) 页面的明显位置。

    ronna-admin 文档官网 日均约3万 浏览量，更多详情请加最上方微信备注 企业赞助 进行详聊。

    # 个人赞助

    ronnaces (opens new window) 组织一直坚持代码、文档教程全部永久免费开源，如果 ronna-admin 帮助到了您，可以选择任意金额扫下方二维码进行赞助。赞助金额大于 10 元时，可在赞助时备注您的 Github 或 github 或某个博客地址，我们会将其加入下方赞助名单中。您的赞助也会推动我们开发更多优质免费代码、补充更多优质免费文档

    微信赞赏 微信 支付宝
    赞赏码 Wechat QRcode Alipay QRcode

    # 赞助名单

    非常感谢您们的赞助！
    +如果链接备注错了的话 😳，请加我微信联系哈
    +下面的昵称备注是我根据能获得的最大信息量推测的，称呼的不对，别见怪哈 😊
    +最后就是兄弟们进群只需按照上面备注的价格哈，不用多转！！！备注的价格，已经足够把贴心服务做好了哈 ❤️

    赞助人 金额 赞助人备注 作者的回复
    *Alate 感谢你这样的开源人贡献~辛苦了！中国开源不容易。也希望你可以找到盈利模式可以健康持续的运营下去哈~嗯 加油！另外注意身体健康！适当运动。注意久坐就溜达下哈。尽量早睡哈~健康第一~不耽误你了~ 短短几句， 我竟不知如何回答了，非常感谢你们，还有那些默默支持的，非常感谢！
    *呼车 300 花点小钱，省点时间 感谢信任，谢谢我豪爽的大哥 ❤️
    MUCv 298 大佬你好，我是去年毕业的应届生，刚入行程序员不到一年，我是学 C++ 的，刚才公司摸鱼无意间在 B 站看到了大佬的视频，看了视频评论区，然后点开看了下 github 和 ronna-admin 文档，很受感动，虽然我不问项目和前端问题，但就想要买个大佬的服务支持下大佬，在国内这样的开源环境下，坚持在做对的事情 非常感谢哥们的支持，称呼我作者就行哈，嘿嘿。坚持在做热爱的事情，坚持在做对的事情，一起加油！ ✊ ❤️
    **jcx 200 全职开源不易，多的200是个人赞助，愿不忘初心，加油！ 不忘初心！！！非常感谢哥们 ❤️
    **jb 188 希望不忘初心，始终开源下去 👏 好的，大哥。多的不说了哈，一起看实际行动 ❤️
    **豪c 188 加油 一起加油，豪哥 ✊ ❤️
    *贝a 100
    Jung 100 好东西要支持，能力范围之内，不要伤了作者一片至诚的心，哈哈哈哈哈 嘿嘿，非常感谢哥们支持哈 ❤️
    S*hb 100 开源不易，加油 非常感谢哥们，一起加油 ✊
    *凡x 99 加油加油 非常感谢哥们，一起加油 ✊
    *刚q 66.66 精简版终于更新到5版本了，来支持下 非常感谢哥们。emm，深夜还不睡觉，我怀疑你一直盯着我呢，哈哈
    *不a* 66.60 多谢指导 客气啦 😉
    *lang* 30
    *华c 23
    *蓝h 20 欢庆精简版同步发布 嘿嘿，终于发布咯
    f*dj 15
    *羽k 12 ronna-admin 媒体查询+视窗单位
    **明q 10

    赞助金额高达 100 时，请加最上方微信，交个朋友 🤝

    上次更新: 2024/04/07, 15:35:23
    + Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
    + + + diff --git a/pages/sso/index.html b/pages/sso/index.html new file mode 100644 index 0000000..6ec574d --- /dev/null +++ b/pages/sso/index.html @@ -0,0 +1,53 @@ + + + + + + 单点登录 | ronna-admin-doc + + + + + + + + + + +
    ronna-admin-doc
    目录

    单点登录

    单点登录有效减少繁琐的登录操作，优化了用户体验

    # 单点登录

    单点登录主要功能在后端，这里只讲述使用 ronna-admin 前端代码如何实现
    +下面以完整版为例，精简版想要开启单点登录只需将 import "@/utils/sso" (opens new window) 注释解开即可

    # 前端实现步骤划分

    • 先判断是否为单点登录，不为则直接返回不再进行任何逻辑处理，下面是单点登录的处理步骤
    1. 清空本地旧信息 (opens new window)
    2. 获取 url 中的重要参数信息，然后通过 setToken 保存在本地 (opens new window)
    3. 删除不需要显示在 url 的参数，这样做更安全 (opens new window)
    4. 使用 window.location.replace 跳转正确页面，window.location.replace 可以替换浏览器历史记录项 (opens new window)

    # 完整代码

    点击查看完整代码 (opens new window)

    # url 格式

    以平台的预览地址为例
+
+完整地址 https://admin.ronnaces.com/#/welcome?username=sso&roles=admin&accessToken=eyJhbGciOiJIUzUxMiJ9.admin
+
+https://admin.ronnaces.com  域名
+
+/#/welcome  要跳转的页面（这里是hash路由模式，根据实际情况修改即可）
+
+?username=sso&roles=admin&accessToken=eyJhbGciOiJIUzUxMiJ9.admin  需要携带的三个（username、roles、accessToken）必传参数
+
    上次更新: 2024/04/07, 15:35:23
    类型声明
    自定义免登录

    + ← + 自定义免登录→ +

    + Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
    + + + diff --git a/pages/start/index.html b/pages/start/index.html new file mode 100644 index 0000000..5de408e --- /dev/null +++ b/pages/start/index.html @@ -0,0 +1,50 @@ + + + + + + 快速开始 | ronna-admin-doc + + + + + + + + + + +
    ronna-admin-doc
    目录

    快速开始

    # 开发环境

    从 ronna-admin v2.0.0 版本后，规定 node 版本应不小于 18.18.0 （推荐优先安装长期维护LTS版，如下图），pnpm 版本应不小于 8.6.10

    nodejs 官网 (opens new window) 当然也可以安装 .nvmrc (opens new window) 推荐的 node 版本

    nodejs

    如果您还没安装 pnpm，请执行下面命令进行安装（mac 用户遇到安装报错请在命令前加上 sudo）

    npm install -g pnpm
+

    如果您需要安装多个 node 版本环境，请参考 Node.js 版本管理工具

    如果您觉得安装平台依赖慢，请参考 npmmirror

    # IDE

    如果您使用的 IDE 是 vscode (opens new window) （推荐），请点击这里并安装推荐的插件，可提高开发效率

    # 拉取代码

    # 从 GitHub 上拉取

    # 完整版前端代码

    git clone https://github.com/ronnaces/ronna-admin.git
+

    # 本地开发

    # 安装依赖

    pnpm install
+

    # 启动平台

    pnpm dev
+

    # 项目打包

    pnpm build
+

    # 安装一个包

    pnpm add 包名
+

    # 卸载一个包

    pnpm remove 包名
+
    上次更新: 2024/04/05, 09:11:09
    介绍
    目录结构

    + ← + 目录结构→ +

    + Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
    + + + diff --git a/pages/support/index.html b/pages/support/index.html new file mode 100644 index 0000000..76a2b82 --- /dev/null +++ b/pages/support/index.html @@ -0,0 +1,43 @@ + + + + + + 问题反馈 | ronna-admin-doc + + + + + + + + + + +
    ronna-admin-doc
    目录

    问题反馈

    # 网易邮箱

    平台唯一账号 kunlong_luo@163.com

    # Github Issues

    点我进行 bug 反馈 (opens new window)

    上次更新: 2024/04/05, 09:11:09
    非平台问题跟踪记录
    git常用命令

    + ← + git常用命令→ +

    + Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
    + + + diff --git a/pages/tailwindcss/index.html b/pages/tailwindcss/index.html new file mode 100644 index 0000000..236eb2a --- /dev/null +++ b/pages/tailwindcss/index.html @@ -0,0 +1,59 @@ + + + + + + Tailwind CSS | ronna-admin-doc + + + + + + + + + + +
    ronna-admin-doc
    目录

    Tailwind CSS

    平台内置了 Tailwind CSS (opens new window) , 可通过各种 程序类 快速构建自定义用户界面，再也不用写那些 "裹脚布" 似的 css 啦

    # Tailwind CSS 的 vscode 插件

    在 vscode 插件商店搜 bradlc.vscode-tailwindcss 安装后，鼠标覆盖到对应的类名，即可带来智能提示

    # Tailwind CSS 文档

    官方英文文档 (opens new window) Tailwind CSS 最新版本
    非官方中文文档 (opens new window)

    # Tailwind CSS 使用技巧

    # 1. 自定义属性值

    拿最常用的 width 属性来举例，tailwindcss 内置了这些 width#class-reference (opens new window) 类名，有时候用户想写任意宽度值怎么做呢，比如给 div 一个 666px 的宽度 ，只需要按照下面的写法。当然不仅仅是宽度可以自定义，所有属性都支持这种模式，你只需要在自定义的时候用 [ ]包起来即可。

    <div class="w-[666px]" />
+

    # 2. !important 权重，这里我们分为 三 步走

    # 2-1. 单个实用程序类加 !important

    • 比如给 p 标签 一个 black !important 的高权重字体颜色，只需要按照下面的写法。也就是某个属性，你需要加权重，那么就在其前面加上 ! 这个感叹号即可。
    <p class="!text-black">
+  This will be medium even though bold comes later in the CSS.
+</p>
+

    # 2-2. ! 总是在实用程序名称的开头，在任何变体之后，但在任何前缀之前

    • 比如下面的 有效代码 ，解释一下代码的意思，就是当鼠标覆盖上去，字体变成白色。 hover: 代表 变体 ，text-white 代表程序名称（任何前缀）。

      • 有效代码
      <div class="hover:!text-white"></div>
+
      • 无效代码
      <div class="!hover:text-white"></div>
+

    # 2-3. 全局配置!important

    module.exports = {
+  important: true,
+};
+

    温馨提示 ❤️

    全局配置 !important 后，Tailwind 的所有实用程序类都将生成为 !important，当然不推荐这里做，因为在合并向元素添加内联样式的第三方 JS 库时，设置 important 为可能会引入一些问题，Tailwind 的 !important 实用程序会破坏内联样式，这可能会破坏您的预期设计，不过也有解决办法，具体参考 configuration#selector-strategy (opens new window)

    # 3. 悬停、焦点和其他状态

    # 4. 响应式设计

    # 5. 暗黑模式

    • 比如在 非暗黑 模式时给 div 标签一个 白 色背景（ bg-white ），在 暗黑 模式时给 div 标签一个 黑 色背景（ bg-black ），只需要在程序类前面加上 dark: 即可。
    <div class="bg-white dark:bg-black"></div>
+

    # 5. 重用样式

    当项目越来越大时，如果不规范使用 tailwindcss ，很容易造成项目难以维护。这里平台有两点提议，如下：

    @layer components {
+  .flex-c {
+    @apply flex justify-center items-center;
+  }
+}
+

    上面的代码意思是，将 flex 、 justify-center 、 items-center 都提取到自定义的 flex-c 这个程序类里，然后我们可以向下面代码一样使用：

    <div class="flex-c"></div>
+

    # 6. 定制化 Tailwind CSS

    # CSSNANO

    • cssnano 中文文档 (opens new window)
    • 平台集成了 cssnano 集成代码位置 (opens new window) ，它是一款基于 postcss 构建的 css 优化开源工具。cssnano 能为你的 CSS 文件做多方面（多余的空白被删除、标识符被压缩、清理无用的 CSS 代码）的的优化，以确保最终生成的 CSS 文件对生产环境来说体积是最小的。

    # Autoprefixer

    • 平台集成了 Autoprefixer 集成代码位置 (opens new window) ,它是一款自动管理浏览器前缀（-webkit- 、 -moz- 、 -ms-）的插件，它可以解析 CSS 文件并且添加浏览器前缀到 CSS 内容里，也就是说写 CSS 的时候，你不用考虑前缀了，会自动加上前缀。

    # PostCSS

    • postcss 是一款通过 js 插件来转换 css 的开源工具，通过这些插件可以支持变量和混合，可以通过追加浏览器前缀生成兼容性的样式，也可以通过 polyfill (opens new window) 把新的样式特性处理成通用的样式，可以使用 css 模块以及样式的规则校验，关于 postcss 更多的内容点 这里 (opens new window) 去了解。

    CSS 框架选型经历

    平台其实在 CSS 框架 选型中一共经历了三个阶段。

    • 第一阶段：windicss (opens new window) 起初选这个的原因是当时 tailwindcss 还没有升级到 v3.0 版本
    • 第二阶段：unocss (opens new window) 选择这个的原因是 windicss 好久没有维护了，并且 windicss 还有本地开发内存溢出等问题
    • 第三阶段：tailwindcss (opens new window) 选择这个的原因是虽然 unocss 很强大，功能也多，但是可能就是因为功能太多，带来的问题也就越多吧。其实，平台只是需要一个稳定的纯 CSS 框架。tailwindcss 在 vite 中使用不需要安装什么插件，只需要安装 tailwindcss 即可，并且 tailwindcss 未处理的 issues (opens new window) 极少，维护很及时，经过再三考虑和一些实践，最终选择了稳定的 tailwindcss
    上次更新: 2024/04/05, 09:11:09
    国际化
    RBAC权限

    + ← + RBAC权限→ +

    + Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
    + + + diff --git a/pages/theme/index.html b/pages/theme/index.html new file mode 100644 index 0000000..a451173 --- /dev/null +++ b/pages/theme/index.html @@ -0,0 +1,62 @@ + + + + + + 主题和暗黑模式 | ronna-admin-doc + + + + + + + + + + +
    ronna-admin-doc
    目录

    主题和暗黑模式

    内置丰富的主题可供选择，也可自行配置主题并且适配了暗黑模式

    # 内置主题

    theme

    从左往右：道奇蓝（默认） (opens new window) 亮白色 (opens new window) 猩红色 (opens new window) 橙红色 (opens new window) 金色 (opens new window) 绿宝石 (opens new window) 酸橙绿 (opens new window) 深粉色 (opens new window) 深紫罗兰色 (opens new window)

    # 自定义主题

    # 添加自定义主题

    ① 将您需要的主题色加入 themeColors (opens new window) 数组里，color 为主题色值，themeColor 为您给主题色取的别名

    ② 上一步完成后，我们将主题色在 themeColors (opens new window) 对象里进行充分适配，上面的 themeColor 作为当前自定义主题色的 key，然后参考下面的字段解析，进行样式调试即可

    # 字段解析

    // 菜单激活时字体和图标的颜色
+subMenuActiveText;
+// 菜单未激活时的整体背景色
+menuBg;
+// 顶部、综合菜单模式下最右上角 搜索、告警、用户名、设置鼠标覆盖后的背景色
+menuHover;
+// 子菜单未激活时的背景色
+subMenuBg;
+// 子菜单激活时的背景色
+subMenuActiveBg;
+// 菜单未激活时字体和图标的颜色
+menuText;
+// logo 的背景色
+sidebarLogo;
+// 鼠标覆盖到菜单时字体和图标的颜色
+menuTitleHover;
+// 左侧、综合菜单模式下左边菜单 ::before 元素的背景色
+menuActiveBefore;
+

    # element-plus 主题色

    具体实现代码参考 setEpThemeColor (opens new window)

    # 暗黑模式

    # 页面如何打开暗黑模式

    # 具体实现

    具体实现代码参考 dataThemeChange (opens new window)

    # 样式兼容

    ① 如果您想适配自己组件的暗黑样式，只需要在 dark.scss (opens new window) 添加即可，当然这种方法也是当 Tailwind CSS 无法实现或者实现不易的情况下才选用

    ② 使用 Tailwind CSS (推荐)，在需要兼容暗黑模式的类名上加上 dark: 即可，比如下面代码，更具体的可以参考这里 tailwindcss

    <p class="dark:text-white">Fighting!!!</p>
+
    上次更新: 2024/04/05, 09:11:09
    图标
    国际化

    + ← + 国际化→ +

    + Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
    + + + diff --git a/pages/track/index.html b/pages/track/index.html new file mode 100644 index 0000000..c42bcb7 --- /dev/null +++ b/pages/track/index.html @@ -0,0 +1,43 @@ + + + + + + 非平台问题跟踪记录 | ronna-admin-doc + + + + + + + + + + +
    ronna-admin-doc
    目录

    非平台问题跟踪记录

    从 2020年11月16 开发平台到现在，已然忘记踩了多少坑，找了多少 issues、pull requests 以及重构了多少次，但是我并没有做记录，感觉很可惜，当然由于平台使用的技术比较新，也一直在跟随潮流，这也难免会出现一些很令人难以寻味的非平台 bug，从 2022年11月11日 起决定开始记录对平台影响较大的问题，供使用者参考（无任何抨击！感恩开源！）

    # 2022年11月11日（vue、Vue.js devtools）

    # 发现 vue 的 bug

    • vue v3.2.41 及以上版本和 Vue.js devtools v6.4.5 两者一起使用，页面卡顿明显，尤其当页面元素多以及同一时刻操作较多元素是最为明显。解决办法：卸载 Vue.js devtools，毕竟我也不用 😄，断点调试足以（卸载 Vue.js devtools 后，页面比 vue v3.2.41 之前操作还流畅）

    # 排查方法

    • 将 vue 升级到 v3.2.41 版本后，开发环境页面卡顿明显，当我打包后，线上预览很丝滑。然后我把平台的项目很多依赖都升级了个遍还不行，删除 pnpm-lock.yaml 和 node_modules 重新安装也不行，于是我怀疑是 pnpm 的问题，又把 pnpm 从 6 升到 7 但还是不行，接着我把项目放到火狐浏览器运行，很流畅 😭，因为我平时不咋用火狐，没有安装任何插件，这样我就排查到问题出在谷歌浏览器的 Vue.js devtools 插件了，当前之前我在 vue 的 issues 中看到不少 Vue.js devtools 会导致页面崩溃和内存泄露的问题

    # 2022年11月11日（vite）

    2022年11月11日 我将平台的 vite 版本固定到了 3.1.8 ，因为之后的版本问题还是有点多，尤其是这个 issues (opens new window)，说的是 vite v3.1.8 以上版本首次启动在 windows 的表现比 mac 慢两倍。当然 vite v4 快来了，应该会解决很多问题，到时我们在升级。这里大家要注意下，依赖包还是跟着平台的版本去使用，不要随便升级，平台每次升级依赖都会去做测试（开发、生产）

    上次更新: 2024/04/05, 09:11:09
    常见问题
    问题反馈

    + ← + 问题反馈→ +

    + Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
    + + + diff --git a/pages/typescript/index.html b/pages/typescript/index.html new file mode 100644 index 0000000..5ec9094 --- /dev/null +++ b/pages/typescript/index.html @@ -0,0 +1,43 @@ + + + + + + 类型声明 | ronna-admin-doc + + + + + + + + + + +
    ronna-admin-doc
    目录

    类型声明

    TypeScript (opens new window)作为 JavaScript 的超集，拥有强大的类型提示给我们的开发带来了极大的便利，尤其体现在团队合作开发中

    # 全局类型声明

    在 global.d.ts (opens new window) 和 index.d.ts (opens new window) 文件中编写的类型可直接在 .ts、.tsx、.vue 中使用

    whole

    # types/shims-tsx.d.ts

    该文件是为了给 .tsx 文件提供类型支持，在编写时能正确识别语法

    # types/shims-vue.d.ts

    .vue、.scss 文件不是常规的文件类型，typescript 无法识别，所以我们需要通过下图的代码告诉 typescript 这些文件的类型，防止类型报错

    shims-vue

    项目开发，我们可能需要安装一些库或者插件什么的，当它们对 typescript 支持不是很友好的时候，就会出现下图的情况

    shims-vue

    解决办法就是将这些通过 declare module "包名" 的形式添加到 types/shims-vue.d.ts (opens new window) 中去，如下图

    shims-vue

    # 全局导入的组件如何获取类型提示

    # 从 npm (opens new window) 下载的组件库或者第三方库

    也就是您使用 pnpm add 添加的包，比如 vue-router (opens new window)，我们只需要将这个包提供的全局类声明文件导入到 tsconfig.json (opens new window) 的 types 配置项，然后重启编辑器即可，如下图导入前和导入后的效果对比

    导入前，pure-table 无高亮且鼠标覆盖无类型提示

    before

    导入后，pure-table 高亮且鼠标覆盖有类型提示

    after

    提示

    当然这个导入前提是这个组件库或者第三方库是有导出全局类声明文件的。

    # 平台内自定义的全局组件

    拿平台封装的 Auth (opens new window) 组件举例

    ① 我们将 Auth 组件在 main.ts (opens new window) 中进行了全局注册

    ② 然后将 Auth 组件在 global-components.d (opens new window) 中引入，所有的全局组件都应该在 GlobalComponents 下引入才可获得类型支持，如下图

    component

    ③ 最后我们直接写 <Auth>xxx</Auth> 就可以得到类型提示啦，如下图

    component

    上次更新: 2024/04/05, 09:11:09
    RBAC权限
    单点登录

    + ← + 单点登录→ +

    + Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
    + + + diff --git a/pages/vscode/index.html b/pages/vscode/index.html new file mode 100644 index 0000000..f19ab8c --- /dev/null +++ b/pages/vscode/index.html @@ -0,0 +1,43 @@ + + + + + + .vscode文件夹详解 | ronna-admin-doc + + + + + + + + + + +
    ronna-admin-doc
    目录

    .vscode文件夹详解

    平台内置很多实用的 vscode 插件 (opens new window)，为了提高开发效率，您可以选择使用 vscode (opens new window) 编辑器

    # extensions.json

    一键安装平台推荐的 vscode 插件，安装方法如下图

    recommended1

    recommended2

    # settings.json

    设置扩展程序或 vscode 编辑器的一些属性

    # vue3.0.code-snippets

    vue3.0 版本代码片段。在 .vue 文件输入 vue 即可看到如下图的选项，选择 Vue3.0 即可生成

    snip3.0

    # vue3.2.code-snippets

    vue3.2 版本代码片段（支持 <script setup> 语法）。在 .vue 文件输入 vue 即可看到如下图的选项，选择 Vue3.2+ 即可生成

    snip3.2

    # vue3.3.code-snippets

    vue3.3 版本代码片段（支持 <script setup> 以及 defineOptions 语法）。在 .vue 文件输入 vue 即可看到如下图的选项，选择 Vue3.3+ 即可生成

    snip3.3

    提示

    如果输入 vue 没有代码片段提示，请稍等一下 vscode 正在反应，或者您可以来到 .vscode/vue3.0.code-snippets、.vscode/vue3.2.code-snippets、.vscode/vue3.3.code-snippets，将这三个文件都 ctrl+s 保存一下，再回到 .vue 页面，输入 vue 就应该有提示了

    上次更新: 2024/04/05, 09:11:09
    目录结构
    平台配置

    + ← + 平台配置→ +

    + Theme by + Vdoing + | Copyright © 2018-2024 + kunlong-luo | MIT License
    + + + diff --git "a/pdf/Cookie\345\222\214Session\345\214\272\345\210\253\347\224\250\346\263\225.pdf" "b/pdf/Cookie\345\222\214Session\345\214\272\345\210\253\347\224\250\346\263\225.pdf" new file mode 100644 index 0000000..f745f19 Binary files /dev/null and "b/pdf/Cookie\345\222\214Session\345\214\272\345\210\253\347\224\250\346\263\225.pdf" differ diff --git a/video/ep.mov b/video/ep.mov new file mode 100644 index 0000000..6fe6477 Binary files /dev/null and b/video/ep.mov differ diff --git a/video/layout.mov b/video/layout.mov new file mode 100644 index 0000000..0485a4f Binary files /dev/null and b/video/layout.mov differ diff --git a/video/nologin.mov b/video/nologin.mov new file mode 100644 index 0000000..60fb8ee Binary files /dev/null and b/video/nologin.mov differ diff --git a/video/redirect.mov b/video/redirect.mov new file mode 100644 index 0000000..75ea33b Binary files /dev/null and b/video/redirect.mov differ diff --git a/video/same3.mov b/video/same3.mov new file mode 100644 index 0000000..c89eaf9 Binary files /dev/null and b/video/same3.mov differ diff --git a/video/same5.mov b/video/same5.mov new file mode 100644 index 0000000..40c5a22 Binary files /dev/null and b/video/same5.mov differ diff --git a/video/start.mov b/video/start.mov new file mode 100644 index 0000000..e81aad7 Binary files /dev/null and b/video/start.mov differ diff --git a/video/theme.mov b/video/theme.mov new file mode 100644 index 0000000..b9302a0 Binary files /dev/null and b/video/theme.mov differ diff --git a/video/url.mov b/video/url.mov new file mode 100644 index 0000000..e9c1950 Binary files /dev/null and b/video/url.mov differ