JLNTV_IPD/vue-h5-template
4
0
Fork 0
mirror of https://github.com/sunniejs/vue-h5-template.git synced 2025-04-05 07:03:01 +08:00
Code Issues Projects Releases Wiki Activity

deploy: 4dee78d00c96b643833dc940308636bdcb2f9d00

Browse Source
This commit is contained in:
fonghehe 2024-11-11 09:04:53 +00:00
parent 56018b67bd
commit aa21eb5df7
122 changed files with 298 additions and 298 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
404.html
View File

File diff suppressed because one or more lines are too long

2
assets/guide_about_index.md.9cd5ee99.js → assets/guide_about_index.md.3268f72f.js
View File

@ -1 +1 @@
import"./chunks/theme.c4d303ac.js";import{_ as o,o as s,c as a,O as n,Q as c,z as t}from"./chunks/framework.6241eaf2.js";const d=e=>(n("data-v-77d3d7d2"),e=e(),c(),e),p=d(()=>t("p",{style:{"margin-bottom":"50px"}},[t("img",{src:"https://cdn.jsdelivr.net/gh/fonghehe/picture/personal/account.jpg",width:"300"})],-1)),_=d(()=>t("p",null,[t("img",{src:"https://cdn.jsdelivr.net/gh/fonghehe/picture/personal/group.jpg",width:"300"})],-1)),i=[p,_],x=JSON.parse('{"title":"","description":"","frontmatter":{"layout":"page"},"headers":[],"relativePath":"guide/about/index.md","filePath":"guide/about/index.md","lastUpdated":1687776555000}'),r={name:"guide/about/index.md"},l=Object.assign(r,{setup(e){return(u,h)=>(s(),a("div",null,i))}}),f=o(l,[["__scopeId","data-v-77d3d7d2"]]);export{x as __pageData,f as default};
import"./chunks/theme.c4d303ac.js";import{_ as o,o as s,c as d,O as n,Q as c,z as t}from"./chunks/framework.6241eaf2.js";const a=e=>(n("data-v-72ad4494"),e=e(),c(),e),p=a(()=>t("p",{style:{"margin-bottom":"50px"}},[t("img",{src:"https://cdn.jsdelivr.net/gh/fonghehe/picture/personal/account.jpg",width:"300"})],-1)),_=a(()=>t("p",null,[t("img",{src:"https://cdn.jsdelivr.net/gh/fonghehe/picture/personal/group.jpg",width:"300"})],-1)),i=[p,_],x=JSON.parse('{"title":"","description":"","frontmatter":{"layout":"page"},"headers":[],"relativePath":"guide/about/index.md","filePath":"guide/about/index.md","lastUpdated":1731315864000}'),r={name:"guide/about/index.md"},l=Object.assign(r,{setup(e){return(u,h)=>(s(),d("div",null,i))}}),f=o(l,[["__scopeId","data-v-72ad4494"]]);export{x as __pageData,f as default};

2
assets/guide_about_index.md.9cd5ee99.lean.js → assets/guide_about_index.md.3268f72f.lean.js
View File

@ -1 +1 @@
import"./chunks/theme.c4d303ac.js";import{_ as o,o as s,c as a,O as n,Q as c,z as t}from"./chunks/framework.6241eaf2.js";const d=e=>(n("data-v-77d3d7d2"),e=e(),c(),e),p=d(()=>t("p",{style:{"margin-bottom":"50px"}},[t("img",{src:"https://cdn.jsdelivr.net/gh/fonghehe/picture/personal/account.jpg",width:"300"})],-1)),_=d(()=>t("p",null,[t("img",{src:"https://cdn.jsdelivr.net/gh/fonghehe/picture/personal/group.jpg",width:"300"})],-1)),i=[p,_],x=JSON.parse('{"title":"","description":"","frontmatter":{"layout":"page"},"headers":[],"relativePath":"guide/about/index.md","filePath":"guide/about/index.md","lastUpdated":1687776555000}'),r={name:"guide/about/index.md"},l=Object.assign(r,{setup(e){return(u,h)=>(s(),a("div",null,i))}}),f=o(l,[["__scopeId","data-v-77d3d7d2"]]);export{x as __pageData,f as default};
import"./chunks/theme.c4d303ac.js";import{_ as o,o as s,c as d,O as n,Q as c,z as t}from"./chunks/framework.6241eaf2.js";const a=e=>(n("data-v-72ad4494"),e=e(),c(),e),p=a(()=>t("p",{style:{"margin-bottom":"50px"}},[t("img",{src:"https://cdn.jsdelivr.net/gh/fonghehe/picture/personal/account.jpg",width:"300"})],-1)),_=a(()=>t("p",null,[t("img",{src:"https://cdn.jsdelivr.net/gh/fonghehe/picture/personal/group.jpg",width:"300"})],-1)),i=[p,_],x=JSON.parse('{"title":"","description":"","frontmatter":{"layout":"page"},"headers":[],"relativePath":"guide/about/index.md","filePath":"guide/about/index.md","lastUpdated":1731315864000}'),r={name:"guide/about/index.md"},l=Object.assign(r,{setup(e){return(u,h)=>(s(),d("div",null,i))}}),f=o(l,[["__scopeId","data-v-72ad4494"]]);export{x as __pageData,f as default};

11
assets/guide_edit.md.4c959ba5.js
View File

@ -1,11 +0,0 @@
import{_ as s,o as a,c as n,R as e}from"./chunks/framework.6241eaf2.js";const u=JSON.parse('{"title":"参与编辑","description":"","frontmatter":{},"headers":[],"relativePath":"guide/edit.md","filePath":"guide/edit.md","lastUpdated":1687776555000}'),t={name:"guide/edit.md"},l=e(`<h1 id="参与编辑" tabindex="-1">参与编辑 <a class="header-anchor" href="#参与编辑" aria-label="Permalink to &quot;参与编辑&quot;">​</a></h1><p>欢迎有意愿参与到开源的朋友，加入到本文档的编写，书写文档不仅是教会别人知识，更是用自己的表达方式概括自己所学习知识的一种方式，这对个人来说是不可多得的成长机会。</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// 拉取项目</span></span>
<span class="line"><span style="color:#A6ACCD;">git clone </span><span style="color:#FFCB6B;">https</span><span style="color:#89DDFF;">:</span><span style="color:#676E95;font-style:italic;">//github.com/sunniejs/vue-h5-template</span></span>
<span class="line"></span>
<span class="line"><span style="color:#676E95;font-style:italic;">// 切换分支</span></span>
<span class="line"><span style="color:#A6ACCD;">git checkout </span><span style="color:#89DDFF;">-</span><span style="color:#A6ACCD;">b docs origin</span><span style="color:#89DDFF;">/</span><span style="color:#A6ACCD;">docs</span></span>
<span class="line"></span>
<span class="line"><span style="color:#676E95;font-style:italic;">// 安装依赖</span></span>
<span class="line"><span style="color:#A6ACCD;">yarn install</span></span>
<span class="line"></span>
<span class="line"><span style="color:#676E95;font-style:italic;">// 启动项目</span></span>
<span class="line"><span style="color:#A6ACCD;">yarn start</span></span></code></pre></div>`,3),p=[l];function o(c,i,r,d,_,y){return a(),n("div",null,p)}const C=s(t,[["render",o]]);export{u as __pageData,C as default};

1
assets/guide_edit.md.4c959ba5.lean.js
View File

@ -1 +0,0 @@
import{_ as s,o as a,c as n,R as e}from"./chunks/framework.6241eaf2.js";const u=JSON.parse('{"title":"参与编辑","description":"","frontmatter":{},"headers":[],"relativePath":"guide/edit.md","filePath":"guide/edit.md","lastUpdated":1687776555000}'),t={name:"guide/edit.md"},l=e("",3),p=[l];function o(c,i,r,d,_,y){return a(),n("div",null,p)}const C=s(t,[["render",o]]);export{u as __pageData,C as default};

11
assets/guide_edit.md.7944bd49.js Normal file
View File

@ -0,0 +1,11 @@
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const h=JSON.parse('{"title":"参与编辑","description":"","frontmatter":{},"headers":[],"relativePath":"guide/edit.md","filePath":"guide/edit.md","lastUpdated":1731315864000}'),e={name:"guide/edit.md"},t=l(`<h1 id="参与编辑" tabindex="-1">参与编辑 <a class="header-anchor" href="#参与编辑" aria-label="Permalink to &quot;参与编辑&quot;">​</a></h1><p>欢迎有意愿参与到开源的朋友，加入到本文档的编写，书写文档不仅是教会别人知识，更是用自己的表达方式概括自己所学习知识的一种方式，这对个人来说是不可多得的成长机会。</p><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;"># 拉取项目</span></span>
<span class="line"><span style="color:#FFCB6B;">git</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">clone</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">https://github.com/sunniejs/vue-h5-template</span></span>
<span class="line"></span>
<span class="line"><span style="color:#676E95;font-style:italic;"># 切换分支</span></span>
<span class="line"><span style="color:#FFCB6B;">git</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">checkout</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">-b</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">docs</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">origin/docs</span></span>
<span class="line"></span>
<span class="line"><span style="color:#676E95;font-style:italic;"># 安装依赖</span></span>
<span class="line"><span style="color:#FFCB6B;">yarn</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">install</span></span>
<span class="line"></span>
<span class="line"><span style="color:#676E95;font-style:italic;"># 启动项目</span></span>
<span class="line"><span style="color:#FFCB6B;">yarn</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">start</span></span></code></pre></div>`,3),p=[t];function o(c,i,r,d,y,C){return a(),n("div",null,p)}const A=s(e,[["render",o]]);export{h as __pageData,A as default};

1
assets/guide_edit.md.7944bd49.lean.js Normal file
View File

@ -0,0 +1 @@
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const h=JSON.parse('{"title":"参与编辑","description":"","frontmatter":{},"headers":[],"relativePath":"guide/edit.md","filePath":"guide/edit.md","lastUpdated":1731315864000}'),e={name:"guide/edit.md"},t=l("",3),p=[t];function o(c,i,r,d,y,C){return a(),n("div",null,p)}const A=s(e,[["render",o]]);export{h as __pageData,A as default};

2
assets/guide_index.md.3a64f07e.js → assets/guide_index.md.46287c77.js
View File

@ -1 +1 @@
import{_ as e,o as a,c as t,R as i}from"./chunks/framework.6241eaf2.js";const m=JSON.parse('{"title":"Vue-H5-Template","description":"","frontmatter":{},"headers":[],"relativePath":"guide/index.md","filePath":"guide/index.md","lastUpdated":1687776555000}'),r={name:"guide/index.md"},l=i('<h1 id="vue-h5-template" tabindex="-1">Vue-H5-Template <a class="header-anchor" href="#vue-h5-template" aria-label="Permalink to &quot;Vue-H5-Template&quot;">​</a></h1><p><a href="https://github.com/sunniejs/vue-h5-template" target="_blank" rel="noreferrer">Vue-H5-Template</a>，是基于 vite3 + vue3 + pinia + ( Vant or Varlet or NutUI ) + viewport 适配方案 ，构建移动端快速开发脚手架</p><h2 id="特点" tabindex="-1">特点 <a class="header-anchor" href="#特点" aria-label="Permalink to &quot;特点&quot;">​</a></h2><h3 id="最新技术栈" tabindex="-1">最新技术栈 <a class="header-anchor" href="#最新技术栈" aria-label="Permalink to &quot;最新技术栈&quot;">​</a></h3><ul><li>框架选型基于当下流行的 vue + vite + ts 模式，精选社区 star 和满意度均不错的 ui 框架和 vite 插件，并时常进行更新，确保与官方文档一致</li></ul><h3 id="基于-typescript" tabindex="-1">基于 TypeScript <a class="header-anchor" href="#基于-typescript" aria-label="Permalink to &quot;基于 TypeScript&quot;">​</a></h3><ul><li>Typescript 逐渐在各种大型的 js 项目中使用，明确的类型定义可以省下不少的开发和维护成本</li></ul><h3 id="轻量级" tabindex="-1">轻量级 <a class="header-anchor" href="#轻量级" aria-label="Permalink to &quot;轻量级&quot;">​</a></h3><ul><li>不同于集成的脚手架，尽量做到轻量不冗杂，只引入高频次的插件和清晰的示例</li><li>轻装上阵，便于拓展开发，减少学习成本</li></ul><h3 id="通俗易懂的文档" tabindex="-1">通俗易懂的文档 <a class="header-anchor" href="#通俗易懂的文档" aria-label="Permalink to &quot;通俗易懂的文档&quot;">​</a></h3><ul><li>基于最新 VitePress 构建的文档，更快，更便捷</li><li>更快的热更新</li></ul>',11),o=[l];function n(s,h,u,d,c,p){return a(),t("div",null,o)}const f=e(r,[["render",n]]);export{m as __pageData,f as default};
import{_ as e,o as a,c as t,R as i}from"./chunks/framework.6241eaf2.js";const m=JSON.parse('{"title":"Vue-H5-Template","description":"","frontmatter":{},"headers":[],"relativePath":"guide/index.md","filePath":"guide/index.md","lastUpdated":1731315864000}'),r={name:"guide/index.md"},l=i('<h1 id="vue-h5-template" tabindex="-1">Vue-H5-Template <a class="header-anchor" href="#vue-h5-template" aria-label="Permalink to &quot;Vue-H5-Template&quot;">​</a></h1><p><a href="https://github.com/sunniejs/vue-h5-template" target="_blank" rel="noreferrer">Vue-H5-Template</a>，是基于 vite3 + vue3 + pinia + ( Vant or Varlet or NutUI ) + viewport 适配方案 ，构建移动端快速开发脚手架</p><h2 id="特点" tabindex="-1">特点 <a class="header-anchor" href="#特点" aria-label="Permalink to &quot;特点&quot;">​</a></h2><h3 id="最新技术栈" tabindex="-1">最新技术栈 <a class="header-anchor" href="#最新技术栈" aria-label="Permalink to &quot;最新技术栈&quot;">​</a></h3><ul><li>框架选型基于当下流行的 vue + vite + ts 模式，精选社区 star 和满意度均不错的 ui 框架和 vite 插件，并时常进行更新，确保与官方文档一致</li></ul><h3 id="基于-typescript" tabindex="-1">基于 TypeScript <a class="header-anchor" href="#基于-typescript" aria-label="Permalink to &quot;基于 TypeScript&quot;">​</a></h3><ul><li>Typescript 逐渐在各种大型的 js 项目中使用，明确的类型定义可以省下不少的开发和维护成本</li></ul><h3 id="轻量级" tabindex="-1">轻量级 <a class="header-anchor" href="#轻量级" aria-label="Permalink to &quot;轻量级&quot;">​</a></h3><ul><li>不同于集成的脚手架，尽量做到轻量不冗杂，只引入高频次的插件和清晰的示例</li><li>轻装上阵，便于拓展开发，减少学习成本</li></ul><h3 id="通俗易懂的文档" tabindex="-1">通俗易懂的文档 <a class="header-anchor" href="#通俗易懂的文档" aria-label="Permalink to &quot;通俗易懂的文档&quot;">​</a></h3><ul><li>基于最新 VitePress 构建的文档，更快，更便捷</li><li>更快的热更新</li></ul>',11),o=[l];function n(s,h,u,d,c,p){return a(),t("div",null,o)}const f=e(r,[["render",n]]);export{m as __pageData,f as default};

2
assets/guide_index.md.3a64f07e.lean.js → assets/guide_index.md.46287c77.lean.js
View File

@ -1 +1 @@
import{_ as e,o as a,c as t,R as i}from"./chunks/framework.6241eaf2.js";const m=JSON.parse('{"title":"Vue-H5-Template","description":"","frontmatter":{},"headers":[],"relativePath":"guide/index.md","filePath":"guide/index.md","lastUpdated":1687776555000}'),r={name:"guide/index.md"},l=i("",11),o=[l];function n(s,h,u,d,c,p){return a(),t("div",null,o)}const f=e(r,[["render",n]]);export{m as __pageData,f as default};
import{_ as e,o as a,c as t,R as i}from"./chunks/framework.6241eaf2.js";const m=JSON.parse('{"title":"Vue-H5-Template","description":"","frontmatter":{},"headers":[],"relativePath":"guide/index.md","filePath":"guide/index.md","lastUpdated":1731315864000}'),r={name:"guide/index.md"},l=i("",11),o=[l];function n(s,h,u,d,c,p){return a(),t("div",null,o)}const f=e(r,[["render",n]]);export{m as __pageData,f as default};

2
assets/guide_other_index.md.0962dd47.js → assets/guide_other_index.md.5aef07ec.js
View File

@ -1 +1 @@
import{_ as e,o as a,c as t,R as r}from"./chunks/framework.6241eaf2.js";const f=JSON.parse('{"title":"","description":"","frontmatter":{},"headers":[],"relativePath":"guide/other/index.md","filePath":"guide/other/index.md","lastUpdated":1687776555000}'),o={name:"guide/other/index.md"},i=r('<h3 id="_1、为什么有多个组件库" tabindex="-1">1、为什么有多个组件库？ <a class="header-anchor" href="#_1、为什么有多个组件库" aria-label="Permalink to &quot;1、为什么有多个组件库？&quot;">​</a></h3><p>本模版想做到的是尽可能的开箱即用，不用去看别的文档引入相关组件库，毕竟做减法比做加法要容易些，如你不需要某个组件库可以根据<a href="/vue-h5-template/guide/vue3/ui.html">这篇指引</a>去移除某个组件库</p><h3 id="_2、我可以用在个人或公司的项目吗" tabindex="-1">2、我可以用在个人或公司的项目吗？ <a class="header-anchor" href="#_2、我可以用在个人或公司的项目吗" aria-label="Permalink to &quot;2、我可以用在个人或公司的项目吗？&quot;">​</a></h3><p>模版基于 MIT License,你可以根据自己的需求用到不同的项目里，如果对你有帮助点个 star 支持一下呗 🌟</p><h3 id="_3、我是一个新手-有什么好的学习建议吗" tabindex="-1">3、我是一个新手，有什么好的学习建议吗？ <a class="header-anchor" href="#_3、我是一个新手-有什么好的学习建议吗" aria-label="Permalink to &quot;3、我是一个新手，有什么好的学习建议吗？&quot;">​</a></h3><p>过来人的经验就是熟读文档可以少走很多弯路，很多的人文档没读熟就开始动手，出了问题也不知道如何去解决，墙裂建议先把<a href="https://cn.vuejs.org/" target="_blank" rel="noreferrer">文档</a>熟读</p>',6),n=[i];function _(d,s,h,c,l,p){return a(),t("div",null,n)}const m=e(o,[["render",_]]);export{f as __pageData,m as default};
import{_ as e,o as a,c as t,R as r}from"./chunks/framework.6241eaf2.js";const f=JSON.parse('{"title":"","description":"","frontmatter":{},"headers":[],"relativePath":"guide/other/index.md","filePath":"guide/other/index.md","lastUpdated":1731315864000}'),o={name:"guide/other/index.md"},i=r('<h3 id="_1、为什么有多个组件库" tabindex="-1">1、为什么有多个组件库？ <a class="header-anchor" href="#_1、为什么有多个组件库" aria-label="Permalink to &quot;1、为什么有多个组件库？&quot;">​</a></h3><p>本模版想做到的是尽可能的开箱即用，不用去看别的文档引入相关组件库，毕竟做减法比做加法要容易些，如你不需要某个组件库可以根据<a href="/vue-h5-template/guide/vue3/ui.html">这篇指引</a>去移除某个组件库</p><h3 id="_2、我可以用在个人或公司的项目吗" tabindex="-1">2、我可以用在个人或公司的项目吗？ <a class="header-anchor" href="#_2、我可以用在个人或公司的项目吗" aria-label="Permalink to &quot;2、我可以用在个人或公司的项目吗？&quot;">​</a></h3><p>模版基于 MIT License，你可以根据自己的需求用到不同的项目里，如果对你有帮助点个 star 支持一下呗 🌟</p><h3 id="_3、我是一个新手-有什么好的学习建议吗" tabindex="-1">3、我是一个新手，有什么好的学习建议吗？ <a class="header-anchor" href="#_3、我是一个新手-有什么好的学习建议吗" aria-label="Permalink to &quot;3、我是一个新手，有什么好的学习建议吗？&quot;">​</a></h3><p>过来人的经验就是熟读文档可以少走很多弯路，很多的人文档没读熟就开始动手，出了问题也不知道如何去解决，墙裂建议先把<a href="https://cn.vuejs.org/" target="_blank" rel="noreferrer">文档</a>熟读</p>',6),n=[i];function _(d,s,h,c,l,p){return a(),t("div",null,n)}const m=e(o,[["render",_]]);export{f as __pageData,m as default};

2
assets/guide_other_index.md.0962dd47.lean.js → assets/guide_other_index.md.5aef07ec.lean.js
View File

@ -1 +1 @@
import{_ as e,o as a,c as t,R as r}from"./chunks/framework.6241eaf2.js";const f=JSON.parse('{"title":"","description":"","frontmatter":{},"headers":[],"relativePath":"guide/other/index.md","filePath":"guide/other/index.md","lastUpdated":1687776555000}'),o={name:"guide/other/index.md"},i=r("",6),n=[i];function _(d,s,h,c,l,p){return a(),t("div",null,n)}const m=e(o,[["render",_]]);export{f as __pageData,m as default};
import{_ as e,o as a,c as t,R as r}from"./chunks/framework.6241eaf2.js";const f=JSON.parse('{"title":"","description":"","frontmatter":{},"headers":[],"relativePath":"guide/other/index.md","filePath":"guide/other/index.md","lastUpdated":1731315864000}'),o={name:"guide/other/index.md"},i=r("",6),n=[i];function _(d,s,h,c,l,p){return a(),t("div",null,n)}const m=e(o,[["render",_]]);export{f as __pageData,m as default};

2
assets/guide_start.md.18fddbf4.js → assets/guide_start.md.634b98ba.js
View File

@ -1 +1 @@
import{_ as e,o as a,c as t,R as r}from"./chunks/framework.6241eaf2.js";const u=JSON.parse('{"title":"快速上手","description":"","frontmatter":{},"headers":[],"relativePath":"guide/start.md","filePath":"guide/start.md","lastUpdated":1687776555000}'),n={name:"guide/start.md"},o=r('<h1 id="快速上手" tabindex="-1">快速上手 <a class="header-anchor" href="#快速上手" aria-label="Permalink to &quot;快速上手&quot;">​</a></h1><h2 id="node-版本要求" tabindex="-1">node 版本要求 <a class="header-anchor" href="#node-版本要求" aria-label="Permalink to &quot;node 版本要求&quot;">​</a></h2><p>推荐 16.17.0+以上的版本，毕竟 2022 年了，别掐着 12+的版本了，你也可以使用<a href="https://github.com/nvm-sh/nvm" target="_blank" rel="noreferrer">nvm</a>或<a href="https://github.com/coreybutler/nvm-windows" target="_blank" rel="noreferrer">nvm-windows</a>在同一台电脑上管理多个 node 版本。</p><h2 id="包管理器" tabindex="-1">包管理器 <a class="header-anchor" href="#包管理器" aria-label="Permalink to &quot;包管理器&quot;">​</a></h2><p>尽量使用 yarn 或者 pnpm，本项目仅保证在 yarn 或 pnpm 下正确运行，npm 涉及到网络环境等各种情况的限制不做过多考虑。如要使用 npm 请不要切换淘宝镜像，会有各种奇怪的 bug。</p><h2 id="启动项目" tabindex="-1">启动项目 <a class="header-anchor" href="#启动项目" aria-label="Permalink to &quot;启动项目&quot;">​</a></h2><p>项目中包含 vue2 和 vue3 两套模版</p><p>如你使用的是 vue2-template，请参考<a href="./vue2/start.html">vue2 项目启动</a></p><p>如你使用的是 vue3-template，请参考<a href="./vue3/start.html">vue3 项目启动</a></p>',9),s=[o];function d(h,i,l,p,c,_){return a(),t("div",null,s)}const f=e(n,[["render",d]]);export{u as __pageData,f as default};
import{_ as e,o as a,c as t,R as r}from"./chunks/framework.6241eaf2.js";const u=JSON.parse('{"title":"快速上手","description":"","frontmatter":{},"headers":[],"relativePath":"guide/start.md","filePath":"guide/start.md","lastUpdated":1731315864000}'),n={name:"guide/start.md"},o=r('<h1 id="快速上手" tabindex="-1">快速上手 <a class="header-anchor" href="#快速上手" aria-label="Permalink to &quot;快速上手&quot;">​</a></h1><h2 id="node-版本要求" tabindex="-1">node 版本要求 <a class="header-anchor" href="#node-版本要求" aria-label="Permalink to &quot;node 版本要求&quot;">​</a></h2><p>推荐 16.17.0+以上的版本，毕竟 2022 年了，别掐着 12+的版本了，你也可以使用<a href="https://github.com/nvm-sh/nvm" target="_blank" rel="noreferrer">nvm</a>或<a href="https://github.com/coreybutler/nvm-windows" target="_blank" rel="noreferrer">nvm-windows</a>在同一台电脑上管理多个 node 版本。</p><h2 id="包管理器" tabindex="-1">包管理器 <a class="header-anchor" href="#包管理器" aria-label="Permalink to &quot;包管理器&quot;">​</a></h2><p>尽量使用 yarn 或者 pnpm，本项目仅保证在 yarn 或 pnpm 下正确运行，npm 涉及到网络环境等各种情况的限制不做过多考虑。如要使用 npm 请不要切换淘宝镜像，会有各种奇怪的 bug。</p><h2 id="启动项目" tabindex="-1">启动项目 <a class="header-anchor" href="#启动项目" aria-label="Permalink to &quot;启动项目&quot;">​</a></h2><p>项目中包含 vue2 和 vue3 两套模版</p><p>如你使用的是 vue2-template，请参考<a href="./vue2/start.html">vue2 项目启动</a></p><p>如你使用的是 vue3-template，请参考<a href="./vue3/start.html">vue3 项目启动</a></p>',9),s=[o];function d(h,i,l,p,c,_){return a(),t("div",null,s)}const f=e(n,[["render",d]]);export{u as __pageData,f as default};

2
assets/guide_start.md.18fddbf4.lean.js → assets/guide_start.md.634b98ba.lean.js
View File

@ -1 +1 @@
import{_ as e,o as a,c as t,R as r}from"./chunks/framework.6241eaf2.js";const u=JSON.parse('{"title":"快速上手","description":"","frontmatter":{},"headers":[],"relativePath":"guide/start.md","filePath":"guide/start.md","lastUpdated":1687776555000}'),n={name:"guide/start.md"},o=r("",9),s=[o];function d(h,i,l,p,c,_){return a(),t("div",null,s)}const f=e(n,[["render",d]]);export{u as __pageData,f as default};
import{_ as e,o as a,c as t,R as r}from"./chunks/framework.6241eaf2.js";const u=JSON.parse('{"title":"快速上手","description":"","frontmatter":{},"headers":[],"relativePath":"guide/start.md","filePath":"guide/start.md","lastUpdated":1731315864000}'),n={name:"guide/start.md"},o=r("",9),s=[o];function d(h,i,l,p,c,_){return a(),t("div",null,s)}const f=e(n,[["render",d]]);export{u as __pageData,f as default};

2
assets/guide_vue2_alias.md.306b63fa.js → assets/guide_vue2_alias.md.c0d9e31c.js
View File

@ -1,4 +1,4 @@
import{_ as s,o as a,c as n,R as o}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"配置 alias 别名","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/alias.md","filePath":"guide/vue2/alias.md","lastUpdated":1687776555000}'),l={name:"guide/vue2/alias.md"},p=o(`<h1 id="配置-alias-别名" tabindex="-1">配置 alias 别名 <a class="header-anchor" href="#配置-alias-别名" aria-label="Permalink to &quot;配置 alias 别名&quot;">​</a></h1><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#C792EA;">const</span><span style="color:#A6ACCD;"> path </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#82AAFF;">require</span><span style="color:#A6ACCD;">(</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">path</span><span style="color:#89DDFF;">&quot;</span><span style="color:#A6ACCD;">)</span><span style="color:#89DDFF;">;</span></span>
import{_ as s,o as a,c as n,R as o}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"配置 alias 别名","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/alias.md","filePath":"guide/vue2/alias.md","lastUpdated":1731315864000}'),l={name:"guide/vue2/alias.md"},p=o(`<h1 id="配置-alias-别名" tabindex="-1">配置 alias 别名 <a class="header-anchor" href="#配置-alias-别名" aria-label="Permalink to &quot;配置 alias 别名&quot;">​</a></h1><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#C792EA;">const</span><span style="color:#A6ACCD;"> path </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#82AAFF;">require</span><span style="color:#A6ACCD;">(</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">path</span><span style="color:#89DDFF;">&quot;</span><span style="color:#A6ACCD;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#C792EA;">const</span><span style="color:#A6ACCD;"> resolve </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">(</span><span style="color:#A6ACCD;font-style:italic;">dir</span><span style="color:#89DDFF;">)</span><span style="color:#A6ACCD;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#A6ACCD;"> path</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">join</span><span style="color:#A6ACCD;">(__dirname</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> dir)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#C792EA;">const</span><span style="color:#A6ACCD;"> IS_PROD </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> [</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">production</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">prod</span><span style="color:#89DDFF;">&quot;</span><span style="color:#A6ACCD;">]</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">includes</span><span style="color:#A6ACCD;">(process</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">env</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">NODE_ENV)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"></span>

2
assets/guide_vue2_alias.md.306b63fa.lean.js → assets/guide_vue2_alias.md.c0d9e31c.lean.js
View File

@ -1 +1 @@
import{_ as s,o as a,c as n,R as o}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"配置 alias 别名","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/alias.md","filePath":"guide/vue2/alias.md","lastUpdated":1687776555000}'),l={name:"guide/vue2/alias.md"},p=o("",2),e=[p];function t(c,r,F,D,y,A){return a(),n("div",null,e)}const u=s(l,[["render",t]]);export{i as __pageData,u as default};
import{_ as s,o as a,c as n,R as o}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"配置 alias 别名","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/alias.md","filePath":"guide/vue2/alias.md","lastUpdated":1731315864000}'),l={name:"guide/vue2/alias.md"},p=o("",2),e=[p];function t(c,r,F,D,y,A){return a(),n("div",null,e)}const u=s(l,[["render",t]]);export{i as __pageData,u as default};

4
assets/guide_vue2_axios.md.a682218e.js → assets/guide_vue2_axios.md.f273628e.js
View File

@ -1,4 +1,4 @@
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const C=JSON.parse('{"title":"Axios 封装及接口管理","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/axios.md","filePath":"guide/vue2/axios.md","lastUpdated":1687776555000}'),o={name:"guide/vue2/axios.md"},p=l(`<h1 id="axios-封装及接口管理" tabindex="-1">Axios 封装及接口管理 <a class="header-anchor" href="#axios-封装及接口管理" aria-label="Permalink to &quot;Axios 封装及接口管理&quot;">​</a></h1><p><code>utils/request.js</code> 封装 axios ,开发者需要根据后台接口做修改。</p><ul><li><code>service.interceptors.request.use</code> 里可以设置请求头，比如设置 <code>token</code></li><li><code>config.hideloading</code> 是在 api 文件夹下的接口参数里设置，下文会讲</li><li><code>service.interceptors.response.use</code> 里可以对接口返回数据处理，比如 401 删除本地信息，重新登录</li></ul><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> axios </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">axios</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const C=JSON.parse('{"title":"Axios 封装及接口管理","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/axios.md","filePath":"guide/vue2/axios.md","lastUpdated":1731315864000}'),o={name:"guide/vue2/axios.md"},p=l(`<h1 id="axios-封装及接口管理" tabindex="-1">Axios 封装及接口管理 <a class="header-anchor" href="#axios-封装及接口管理" aria-label="Permalink to &quot;Axios 封装及接口管理&quot;">​</a></h1><p><code>utils/request.js</code> 封装 axios ，开发者需要根据后台接口做修改。</p><ul><li><code>service.interceptors.request.use</code> 里可以设置请求头，比如设置 <code>token</code></li><li><code>config.hideloading</code> 是在 api 文件夹下的接口参数里设置，下文会讲</li><li><code>service.interceptors.response.use</code> 里可以对接口返回数据处理，比如 401 删除本地信息，重新登录</li></ul><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> axios </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">axios</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> store </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">@/store</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">Toast</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">}</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">vant</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#676E95;font-style:italic;">// 根据环境不同引入不同api地址</span></span>
@ -54,7 +54,7 @@ import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const C=
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;font-style:italic;">return</span><span style="color:#F07178;"> </span><span style="color:#FFCB6B;">Promise</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">reject</span><span style="color:#F07178;">(</span><span style="color:#A6ACCD;">error</span><span style="color:#F07178;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">}</span></span>
<span class="line"><span style="color:#A6ACCD;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;font-style:italic;">export</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;font-style:italic;">default</span><span style="color:#A6ACCD;"> service</span><span style="color:#89DDFF;">;</span></span></code></pre></div><h4 id="接口管理" tabindex="-1">接口管理 <a class="header-anchor" href="#接口管理" aria-label="Permalink to &quot;接口管理&quot;">​</a></h4><p>在<code>src/api</code> 文件夹下统一管理接口</p><ul><li>你可以建立多个模块对接接口, 比如 <code>home.js</code> 里是首页的接口这里讲解 <code>user.js</code></li><li><code>url</code> 接口地址，请求的时候会拼接上 <code>config</code> 下的 <code>baseApi</code></li><li><code>method</code> 请求方法</li><li><code>data</code> 请求参数 <code>qs.stringify(params)</code> 是对数据系列化操作</li><li><code>hideloading</code> 默认 <code>false</code>,设置为 <code>true</code> 后，不显示 loading ui 交互中有些接口不需要让用户感知</li></ul><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> qs </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">qs</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;font-style:italic;">export</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;font-style:italic;">default</span><span style="color:#A6ACCD;"> service</span><span style="color:#89DDFF;">;</span></span></code></pre></div><h4 id="接口管理" tabindex="-1">接口管理 <a class="header-anchor" href="#接口管理" aria-label="Permalink to &quot;接口管理&quot;">​</a></h4><p>在<code>src/api</code> 文件夹下统一管理接口</p><ul><li>你可以建立多个模块对接接口, 比如 <code>home.js</code> 里是首页的接口这里讲解 <code>user.js</code></li><li><code>url</code> 接口地址，请求的时候会拼接上 <code>config</code> 下的 <code>baseApi</code></li><li><code>method</code> 请求方法</li><li><code>data</code> 请求参数 <code>qs.stringify(params)</code> 是对数据系列化操作</li><li><code>hideloading</code> 默认 <code>false</code>，设置为 <code>true</code> 后，不显示 loading ui 交互中有些接口不需要让用户感知</li></ul><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> qs </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">qs</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#676E95;font-style:italic;">// axios</span></span>
<span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> request </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">@/utils/request</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#676E95;font-style:italic;">//user api</span></span>

2
assets/guide_vue2_axios.md.a682218e.lean.js → assets/guide_vue2_axios.md.f273628e.lean.js
View File

@ -1 +1 @@
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const C=JSON.parse('{"title":"Axios 封装及接口管理","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/axios.md","filePath":"guide/vue2/axios.md","lastUpdated":1687776555000}'),o={name:"guide/vue2/axios.md"},p=l("",10),e=[p];function t(c,r,F,y,D,i){return n(),a("div",null,e)}const u=s(o,[["render",t]]);export{C as __pageData,u as default};
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const C=JSON.parse('{"title":"Axios 封装及接口管理","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/axios.md","filePath":"guide/vue2/axios.md","lastUpdated":1731315864000}'),o={name:"guide/vue2/axios.md"},p=l("",10),e=[p];function t(c,r,F,y,D,i){return n(),a("div",null,e)}const u=s(o,[["render",t]]);export{C as __pageData,u as default};

2
assets/guide_vue2_base.md.7d4266ed.js → assets/guide_vue2_base.md.bd933227.js
View File

@ -1,4 +1,4 @@
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"Webpack 4 vue.config.js 基础配置","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/base.md","filePath":"guide/vue2/base.md","lastUpdated":1687776555000}'),p={name:"guide/vue2/base.md"},o=l(`<h1 id="webpack-4-vue-config-js-基础配置" tabindex="-1">Webpack 4 vue.config.js 基础配置 <a class="header-anchor" href="#webpack-4-vue-config-js-基础配置" aria-label="Permalink to &quot;Webpack 4 vue.config.js 基础配置&quot;">​</a></h1><p>如果你的 <code>Vue Router</code> 模式是 hash</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">publicPath</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">./</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span></code></pre></div><p>如果你的 <code>Vue Router</code> 模式是 history 这里的 publicPath 和你的 <code>Vue Router</code> <code>base</code> <strong>保持一致</strong></p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">publicPath</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">/app/</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span></code></pre></div><p>配置如下</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">createVitePlugins</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">}</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">./config/vite/plugins</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"Webpack 4 vue.config.js 基础配置","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/base.md","filePath":"guide/vue2/base.md","lastUpdated":1731315864000}'),p={name:"guide/vue2/base.md"},o=l(`<h1 id="webpack-4-vue-config-js-基础配置" tabindex="-1">Webpack 4 vue.config.js 基础配置 <a class="header-anchor" href="#webpack-4-vue-config-js-基础配置" aria-label="Permalink to &quot;Webpack 4 vue.config.js 基础配置&quot;">​</a></h1><p>如果你的 <code>Vue Router</code> 模式是 hash</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">publicPath</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">./</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span></code></pre></div><p>如果你的 <code>Vue Router</code> 模式是 history 这里的 publicPath 和你的 <code>Vue Router</code> <code>base</code> <strong>保持一致</strong></p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">publicPath</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">/app/</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span></code></pre></div><p>配置如下</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">createVitePlugins</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">}</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">./config/vite/plugins</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">resolve</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">}</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">path</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">ConfigEnv</span><span style="color:#89DDFF;">,</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">UserConfigExport</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">}</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">vite</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"></span>

2
assets/guide_vue2_base.md.7d4266ed.lean.js → assets/guide_vue2_base.md.bd933227.lean.js
View File

@ -1 +1 @@
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"Webpack 4 vue.config.js 基础配置","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/base.md","filePath":"guide/vue2/base.md","lastUpdated":1687776555000}'),p={name:"guide/vue2/base.md"},o=l("",7),e=[o];function t(c,r,F,D,y,i){return n(),a("div",null,e)}const u=s(p,[["render",t]]);export{A as __pageData,u as default};
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"Webpack 4 vue.config.js 基础配置","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/base.md","filePath":"guide/vue2/base.md","lastUpdated":1731315864000}'),p={name:"guide/vue2/base.md"},o=l("",7),e=[o];function t(c,r,F,D,y,i){return n(),a("div",null,e)}const u=s(p,[["render",t]]);export{A as __pageData,u as default};

2
assets/guide_vue2_bundle.md.2fe1a9fb.js → assets/guide_vue2_bundle.md.73aeb293.js
View File

@ -1,4 +1,4 @@
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const C=JSON.parse('{"title":"配置打包分析","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/bundle.md","filePath":"guide/vue2/bundle.md","lastUpdated":1687776555000}'),p={name:"guide/vue2/bundle.md"},o=l(`<h1 id="配置打包分析" tabindex="-1">配置打包分析 <a class="header-anchor" href="#配置打包分析" aria-label="Permalink to &quot;配置打包分析&quot;">​</a></h1><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#C792EA;">const</span><span style="color:#A6ACCD;"> BundleAnalyzerPlugin </span><span style="color:#89DDFF;">=</span></span>
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const C=JSON.parse('{"title":"配置打包分析","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/bundle.md","filePath":"guide/vue2/bundle.md","lastUpdated":1731315864000}'),p={name:"guide/vue2/bundle.md"},o=l(`<h1 id="配置打包分析" tabindex="-1">配置打包分析 <a class="header-anchor" href="#配置打包分析" aria-label="Permalink to &quot;配置打包分析&quot;">​</a></h1><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#C792EA;">const</span><span style="color:#A6ACCD;"> BundleAnalyzerPlugin </span><span style="color:#89DDFF;">=</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#82AAFF;">require</span><span style="color:#A6ACCD;">(</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">webpack-bundle-analyzer</span><span style="color:#89DDFF;">&quot;</span><span style="color:#A6ACCD;">)</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">BundleAnalyzerPlugin</span><span style="color:#89DDFF;">;</span></span>
<span class="line"></span>
<span class="line"><span style="color:#89DDFF;">module.exports</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>

2
assets/guide_vue2_bundle.md.2fe1a9fb.lean.js → assets/guide_vue2_bundle.md.73aeb293.lean.js
View File

@ -1 +1 @@
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const C=JSON.parse('{"title":"配置打包分析","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/bundle.md","filePath":"guide/vue2/bundle.md","lastUpdated":1687776555000}'),p={name:"guide/vue2/bundle.md"},o=l("",3),e=[o];function t(c,r,y,D,F,i){return a(),n("div",null,e)}const d=s(p,[["render",t]]);export{C as __pageData,d as default};
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const C=JSON.parse('{"title":"配置打包分析","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/bundle.md","filePath":"guide/vue2/bundle.md","lastUpdated":1731315864000}'),p={name:"guide/vue2/bundle.md"},o=l("",3),e=[o];function t(c,r,y,D,F,i){return a(),n("div",null,e)}const d=s(p,[["render",t]]);export{C as __pageData,d as default};

2
assets/guide_vue2_chunks.md.0130f8b3.js → assets/guide_vue2_chunks.md.93504c3d.js
View File

@ -1,4 +1,4 @@
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const u=JSON.parse('{"title":"splitChunks 单独打包第三方模块","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/chunks.md","filePath":"guide/vue2/chunks.md","lastUpdated":1687776555000}'),p={name:"guide/vue2/chunks.md"},o=l(`<h1 id="splitchunks-单独打包第三方模块" tabindex="-1">splitChunks 单独打包第三方模块 <a class="header-anchor" href="#splitchunks-单独打包第三方模块" aria-label="Permalink to &quot;splitChunks 单独打包第三方模块&quot;">​</a></h1><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;">module.exports</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const u=JSON.parse('{"title":"splitChunks 单独打包第三方模块","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/chunks.md","filePath":"guide/vue2/chunks.md","lastUpdated":1731315864000}'),p={name:"guide/vue2/chunks.md"},o=l(`<h1 id="splitchunks-单独打包第三方模块" tabindex="-1">splitChunks 单独打包第三方模块 <a class="header-anchor" href="#splitchunks-单独打包第三方模块" aria-label="Permalink to &quot;splitChunks 单独打包第三方模块&quot;">​</a></h1><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;">module.exports</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#82AAFF;">chainWebpack</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">(</span><span style="color:#A6ACCD;font-style:italic;">config</span><span style="color:#89DDFF;">)</span><span style="color:#A6ACCD;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">config</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">when</span><span style="color:#F07178;">(</span><span style="color:#A6ACCD;">IS_PROD</span><span style="color:#89DDFF;">,</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">(</span><span style="color:#A6ACCD;font-style:italic;">config</span><span style="color:#89DDFF;">)</span><span style="color:#F07178;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">config</span></span>

2
assets/guide_vue2_chunks.md.0130f8b3.lean.js → assets/guide_vue2_chunks.md.93504c3d.lean.js
View File

@ -1 +1 @@
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const u=JSON.parse('{"title":"splitChunks 单独打包第三方模块","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/chunks.md","filePath":"guide/vue2/chunks.md","lastUpdated":1687776555000}'),p={name:"guide/vue2/chunks.md"},o=l("",2),t=[o];function e(c,F,r,y,D,i){return n(),a("div",null,t)}const A=s(p,[["render",e]]);export{u as __pageData,A as default};
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const u=JSON.parse('{"title":"splitChunks 单独打包第三方模块","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/chunks.md","filePath":"guide/vue2/chunks.md","lastUpdated":1731315864000}'),p={name:"guide/vue2/chunks.md"},o=l("",2),t=[o];function e(c,F,r,y,D,i){return n(),a("div",null,t)}const A=s(p,[["render",e]]);export{u as __pageData,A as default};

2
assets/guide_vue2_console.md.51b49cb0.js → assets/guide_vue2_console.md.68673d37.js
View File

@ -1,4 +1,4 @@
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"去掉 console.log","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/console.md","filePath":"guide/vue2/console.md","lastUpdated":1687776555000}'),o={name:"guide/vue2/console.md"},p=l(`<h1 id="去掉-console-log" tabindex="-1">去掉 console.log <a class="header-anchor" href="#去掉-console-log" aria-label="Permalink to &quot;去掉 console.log&quot;">​</a></h1><p>保留了测试环境和本地环境的 <code>console.log</code></p><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">npm</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">i</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">-D</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">babel-plugin-transform-remove-console</span></span></code></pre></div><p>在 babel.config.js 中配置</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// 获取 VUE_APP_ENV 非 NODE_ENV，测试环境依然 console</span></span>
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"去掉 console.log","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/console.md","filePath":"guide/vue2/console.md","lastUpdated":1731315864000}'),o={name:"guide/vue2/console.md"},p=l(`<h1 id="去掉-console-log" tabindex="-1">去掉 console.log <a class="header-anchor" href="#去掉-console-log" aria-label="Permalink to &quot;去掉 console.log&quot;">​</a></h1><p>保留了测试环境和本地环境的 <code>console.log</code></p><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">npm</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">i</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">-D</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">babel-plugin-transform-remove-console</span></span></code></pre></div><p>在 babel.config.js 中配置</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// 获取 VUE_APP_ENV 非 NODE_ENV，测试环境依然 console</span></span>
<span class="line"><span style="color:#C792EA;">const</span><span style="color:#A6ACCD;"> IS_PROD </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> [</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">production</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">prod</span><span style="color:#89DDFF;">&quot;</span><span style="color:#A6ACCD;">]</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">includes</span><span style="color:#A6ACCD;">(process</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">env</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">VUE_APP_ENV)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#C792EA;">const</span><span style="color:#A6ACCD;"> plugins </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> [</span></span>
<span class="line"><span style="color:#A6ACCD;"> [</span></span>

2
assets/guide_vue2_console.md.51b49cb0.lean.js → assets/guide_vue2_console.md.68673d37.lean.js
View File

@ -1 +1 @@
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"去掉 console.log","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/console.md","filePath":"guide/vue2/console.md","lastUpdated":1687776555000}'),o={name:"guide/vue2/console.md"},p=l("",5),e=[p];function t(c,r,D,y,F,C){return n(),a("div",null,e)}const u=s(o,[["render",t]]);export{i as __pageData,u as default};
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"去掉 console.log","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/console.md","filePath":"guide/vue2/console.md","lastUpdated":1731315864000}'),o={name:"guide/vue2/console.md"},p=l("",5),e=[p];function t(c,r,D,y,F,C){return n(),a("div",null,e)}const u=s(o,[["render",t]]);export{i as __pageData,u as default};

6
assets/guide_vue2_env.md.c800a293.js → assets/guide_vue2_env.md.71078dec.js
View File

@ -1,14 +1,14 @@
import{_ as s,o as a,c as n,R as o}from"./chunks/framework.6241eaf2.js";const C=JSON.parse('{"title":"配置多环境变量","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/env.md","filePath":"guide/vue2/env.md","lastUpdated":1687776555000}'),l={name:"guide/vue2/env.md"},p=o(`<h1 id="配置多环境变量" tabindex="-1">配置多环境变量 <a class="header-anchor" href="#配置多环境变量" aria-label="Permalink to &quot;配置多环境变量&quot;">​</a></h1><p><code>package.json</code> 里的 <code>scripts</code> 配置 <code>serve</code> <code>stage</code> <code>build</code>，通过 <code>--mode xxx</code> 来执行不同环境</p><ul><li>通过 <code>npm run serve</code> 启动本地 , 执行 <code>development</code></li><li>通过 <code>npm run stage</code> 打包测试 , 执行 <code>staging</code></li><li>通过 <code>npm run build</code> 打包正式 , 执行 <code>production</code></li></ul><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">scripts</span><span style="color:#89DDFF;">&quot;</span><span style="color:#A6ACCD;">: </span><span style="color:#89DDFF;">{</span></span>
import{_ as s,o as a,c as n,R as o}from"./chunks/framework.6241eaf2.js";const C=JSON.parse('{"title":"配置多环境变量","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/env.md","filePath":"guide/vue2/env.md","lastUpdated":1731315864000}'),l={name:"guide/vue2/env.md"},p=o(`<h1 id="配置多环境变量" tabindex="-1">配置多环境变量 <a class="header-anchor" href="#配置多环境变量" aria-label="Permalink to &quot;配置多环境变量&quot;">​</a></h1><p><code>package.json</code> 里的 <code>scripts</code> 配置 <code>serve</code> <code>stage</code> <code>build</code>，通过 <code>--mode xxx</code> 来执行不同环境</p><ul><li>通过 <code>npm run serve</code> 启动本地 , 执行 <code>development</code></li><li>通过 <code>npm run stage</code> 打包测试 , 执行 <code>staging</code></li><li>通过 <code>npm run build</code> 打包正式 , 执行 <code>production</code></li></ul><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">scripts</span><span style="color:#89DDFF;">&quot;</span><span style="color:#A6ACCD;">: </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#F07178;">serve</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">vue-cli-service serve --open</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#F07178;">stage</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">vue-cli-service build --mode staging</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#F07178;">build</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">vue-cli-service build</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#89DDFF;">}</span></span></code></pre></div><h5 id="配置介绍" tabindex="-1">配置介绍 <a class="header-anchor" href="#配置介绍" aria-label="Permalink to &quot;配置介绍&quot;">​</a></h5><p>  以 <code>VUE_APP_</code> 开头的变量，在代码中可以通过 <code>p<wbr>rocess.env.VUE_APP_</code> 访问。<br>   比如,<code>VUE_APP_ENV = &#39;development&#39;</code> 通过<code>p<wbr>rocess.env.VUE_APP_ENV</code> 访问。<br>   除了 <code>VUE_APP_*</code> 变量之外，在你的应用代码中始终可用的还有两个特殊的变量<code>NODE_ENV</code> 和<code>BASE_URL</code></p><p>在项目根目录中新建<code>.env.*</code></p><ul><li>.env.development 本地开发环境配置</li></ul><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#A6ACCD;">NODE_ENV</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">development</span><span style="color:#89DDFF;">&#39;</span></span>
<span class="line"><span style="color:#89DDFF;">}</span></span></code></pre></div><h5 id="配置介绍" tabindex="-1">配置介绍 <a class="header-anchor" href="#配置介绍" aria-label="Permalink to &quot;配置介绍&quot;">​</a></h5><p>  以 <code>VUE_APP_</code> 开头的变量，在代码中可以通过 <code>p<wbr>rocess.env.VUE_APP_</code> 访问。   比如：<code>VUE_APP_ENV = &#39;development&#39;</code> 通过 <code>p<wbr>rocess.env.VUE_APP_ENV</code> 访问。   当然，除了 <code>VUE_APP_*</code> 变量之外，在你的应用代码中始终可用的还有两个特殊的变量<code>NODE_ENV</code> 和<code>BASE_URL</code></p><p>在项目根目录中新建<code>.env.*</code></p><ul><li>.env.development 本地开发环境配置</li></ul><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#A6ACCD;">NODE_ENV</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">development</span><span style="color:#89DDFF;">&#39;</span></span>
<span class="line"><span style="color:#676E95;font-style:italic;"># must start with VUE_APP_</span></span>
<span class="line"><span style="color:#FFCB6B;">VUE_APP_ENV</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">development</span><span style="color:#89DDFF;">&#39;</span></span></code></pre></div><ul><li>.env.staging 测试环境配置</li></ul><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#A6ACCD;">NODE_ENV</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">production</span><span style="color:#89DDFF;">&#39;</span></span>
<span class="line"><span style="color:#676E95;font-style:italic;"># must start with VUE_APP_</span></span>
<span class="line"><span style="color:#FFCB6B;">VUE_APP_ENV</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">staging</span><span style="color:#89DDFF;">&#39;</span></span></code></pre></div><ul><li>.env.production 正式环境配置</li></ul><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#A6ACCD;">NODE_ENV</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">production</span><span style="color:#89DDFF;">&#39;</span></span>
<span class="line"><span style="color:#676E95;font-style:italic;"># must start with VUE_APP_</span></span>
<span class="line"><span style="color:#FFCB6B;">VUE_APP_ENV</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">production</span><span style="color:#89DDFF;">&#39;</span></span></code></pre></div><p>这里我们并没有定义很多变量，只定义了基础的 VUE_APP_ENV <code>development</code> <code>staging</code> <code>production</code><br> 变量我们统一在 <code>src/config/env.*.js</code> 里进行管理。</p><p>这里有个问题，既然这里有了根据不同环境设置变量的文件，为什么还要去 config 下新建三个对应的文件呢？<br><strong>修改起来方便，不需 要重启项目，符合开发习惯。</strong></p><p>config/index.js</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// 根据环境引入不同配置 p<wbr>rocess.env.NODE_ENV</span></span>
<span class="line"><span style="color:#FFCB6B;">VUE_APP_ENV</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">production</span><span style="color:#89DDFF;">&#39;</span></span></code></pre></div><p>这里我们并没有定义很多变量，只定义了基础的 VUE_APP_ENV <code>development</code> <code>staging</code> <code>production</code> 变量我们统一在 <code>src/config/env.*.js</code> 里进行管理。</p><p>这里有个问题，既然这里有了根据不同环境设置变量的文件，为什么还要去 config 下新建三个对应的文件呢？ <strong>修改起来方便，不需 要重启项目，符合开发习惯。</strong></p><p>config/index.js</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// 根据环境引入不同配置 p<wbr>rocess.env.NODE_ENV</span></span>
<span class="line"><span style="color:#C792EA;">const</span><span style="color:#A6ACCD;"> config </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#82AAFF;">require</span><span style="color:#A6ACCD;">(</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">./env.</span><span style="color:#89DDFF;">&quot;</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">+</span><span style="color:#A6ACCD;"> process</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">env</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">VUE_APP_ENV)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;">module.exports</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> config</span><span style="color:#89DDFF;">;</span></span></code></pre></div><p>配置对应环境的变量，拿本地环境文件 <code>env.development.js</code> 举例，用户可以根据需求修改</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// 本地环境配置</span></span>
<span class="line"><span style="color:#89DDFF;">module.exports</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>

2
assets/guide_vue2_env.md.c800a293.lean.js → assets/guide_vue2_env.md.71078dec.lean.js
View File

@ -1 +1 @@
import{_ as s,o as a,c as n,R as o}from"./chunks/framework.6241eaf2.js";const C=JSON.parse('{"title":"配置多环境变量","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/env.md","filePath":"guide/vue2/env.md","lastUpdated":1687776555000}'),l={name:"guide/vue2/env.md"},p=o("",21),e=[p];function t(c,r,D,y,i,F){return a(),n("div",null,e)}const A=s(l,[["render",t]]);export{C as __pageData,A as default};
import{_ as s,o as a,c as n,R as o}from"./chunks/framework.6241eaf2.js";const C=JSON.parse('{"title":"配置多环境变量","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/env.md","filePath":"guide/vue2/env.md","lastUpdated":1731315864000}'),l={name:"guide/vue2/env.md"},p=o("",21),e=[p];function t(c,r,D,y,i,F){return a(),n("div",null,e)}const A=s(l,[["render",t]]);export{C as __pageData,A as default};

2
assets/guide_vue2_externals.md.69c0669f.js → assets/guide_vue2_externals.md.6744fb41.js
View File

@ -1,4 +1,4 @@
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"配置 externals 引入 cdn 资源","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/externals.md","filePath":"guide/vue2/externals.md","lastUpdated":1687776555000}'),p={name:"guide/vue2/externals.md"},o=l(`<h1 id="配置-externals-引入-cdn-资源" tabindex="-1">配置 externals 引入 cdn 资源 <a class="header-anchor" href="#配置-externals-引入-cdn-资源" aria-label="Permalink to &quot;配置 externals 引入 cdn 资源&quot;">​</a></h1><p>这个版本 CDN 不再引入，我测试了一下使用引入 CDN 和不使用,不使用会比使用时间少。网上不少文章测试 CDN 速度块，这个开发者可 以实际测试一下。</p><p>另外项目中使用的是公共 CDN 不稳定，域名解析也是需要时间的（如果你要使用请尽量使用同一个域名）</p><p>因为页面每次遇到<code>&lt;script&gt;</code>标签都会停下来解析执行，所以应该尽可能减少<code>&lt;script&gt;</code>标签的数量 <code>HTTP</code>请求存在一定的开销，100K 的文件比 5 个 20K 的文件下载的更快，所以较少脚本数量也是很有必要的</p><p>暂时还没有研究放到自己的 cdn 服务器上。</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#C792EA;">const</span><span style="color:#A6ACCD;"> defaultSettings </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#82AAFF;">require</span><span style="color:#A6ACCD;">(</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">./src/config/index.js</span><span style="color:#89DDFF;">&quot;</span><span style="color:#A6ACCD;">)</span><span style="color:#89DDFF;">;</span></span>
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"配置 externals 引入 cdn 资源","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/externals.md","filePath":"guide/vue2/externals.md","lastUpdated":1731315864000}'),p={name:"guide/vue2/externals.md"},o=l(`<h1 id="配置-externals-引入-cdn-资源" tabindex="-1">配置 externals 引入 cdn 资源 <a class="header-anchor" href="#配置-externals-引入-cdn-资源" aria-label="Permalink to &quot;配置 externals 引入 cdn 资源&quot;">​</a></h1><p>这个版本 CDN 不再引入，我测试了一下使用引入 CDN 和不使用，不使用会比使用时间少。网上不少文章测试 CDN 速度块，这个开发者可 以实际测试一下。</p><p>另外项目中使用的是公共 CDN 不稳定，域名解析也是需要时间的（如果你要使用请尽量使用同一个域名）</p><p>因为页面每次遇到<code>&lt;script&gt;</code>标签都会停下来解析执行，所以应该尽可能减少<code>&lt;script&gt;</code>标签的数量 <code>HTTP</code>请求存在一定的开销，100K 的文件比 5 个 20K 的文件下载的更快，所以较少脚本数量也是很有必要的</p><p>暂时还没有研究放到自己的 cdn 服务器上。</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#C792EA;">const</span><span style="color:#A6ACCD;"> defaultSettings </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#82AAFF;">require</span><span style="color:#A6ACCD;">(</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">./src/config/index.js</span><span style="color:#89DDFF;">&quot;</span><span style="color:#A6ACCD;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#C792EA;">const</span><span style="color:#A6ACCD;"> name </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> defaultSettings</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">title </span><span style="color:#89DDFF;">||</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">vue mobile template</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#C792EA;">const</span><span style="color:#A6ACCD;"> IS_PROD </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> [</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">production</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">prod</span><span style="color:#89DDFF;">&quot;</span><span style="color:#A6ACCD;">]</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">includes</span><span style="color:#A6ACCD;">(process</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">env</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">NODE_ENV)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"></span>

2
assets/guide_vue2_externals.md.69c0669f.lean.js → assets/guide_vue2_externals.md.6744fb41.lean.js
View File

@ -1 +1 @@
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"配置 externals 引入 cdn 资源","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/externals.md","filePath":"guide/vue2/externals.md","lastUpdated":1687776555000}'),p={name:"guide/vue2/externals.md"},o=l("",8),t=[o];function e(c,D,r,F,y,C){return n(),a("div",null,t)}const u=s(p,[["render",e]]);export{i as __pageData,u as default};
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"配置 externals 引入 cdn 资源","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/externals.md","filePath":"guide/vue2/externals.md","lastUpdated":1731315864000}'),p={name:"guide/vue2/externals.md"},o=l("",8),t=[o];function e(c,D,r,F,y,C){return n(),a("div",null,t)}const u=s(p,[["render",e]]);export{i as __pageData,u as default};

2
assets/guide_vue2_ie.md.83d021b7.js → assets/guide_vue2_ie.md.f5d567e9.js
View File

@ -1,4 +1,4 @@
import{_ as s,o as a,c as n,R as e}from"./chunks/framework.6241eaf2.js";const d=JSON.parse('{"title":"添加 IE 兼容","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/ie.md","filePath":"guide/vue2/ie.md","lastUpdated":1687776555000}'),o={name:"guide/vue2/ie.md"},l=e(`<h1 id="添加-ie-兼容" tabindex="-1">添加 IE 兼容 <a class="header-anchor" href="#添加-ie-兼容" aria-label="Permalink to &quot;添加 IE 兼容&quot;">​</a></h1><p>之前的方式 会报 <code>@babel/polyfill</code> is deprecated. Please, use required parts of <code>core-js</code> and <code>regenerator-runtime/runtime</code> separately</p><p><code>@babel/polyfill</code> 废弃，使用 <code>core-js</code> 和 <code>regenerator-runtime</code></p><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">npm</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">i</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">--save</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">core-js</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">regenerator-runtime</span></span></code></pre></div><p>在 <code>main.js</code> 中添加</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// 兼容 IE</span></span>
import{_ as s,o as a,c as n,R as e}from"./chunks/framework.6241eaf2.js";const d=JSON.parse('{"title":"添加 IE 兼容","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/ie.md","filePath":"guide/vue2/ie.md","lastUpdated":1731315864000}'),o={name:"guide/vue2/ie.md"},l=e(`<h1 id="添加-ie-兼容" tabindex="-1">添加 IE 兼容 <a class="header-anchor" href="#添加-ie-兼容" aria-label="Permalink to &quot;添加 IE 兼容&quot;">​</a></h1><p>之前的方式 会报 <code>@babel/polyfill</code> is deprecated. Please, use required parts of <code>core-js</code> and <code>regenerator-runtime/runtime</code> separately</p><p><code>@babel/polyfill</code> 废弃，使用 <code>core-js</code> 和 <code>regenerator-runtime</code></p><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">npm</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">i</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">--save</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">core-js</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">regenerator-runtime</span></span></code></pre></div><p>在 <code>main.js</code> 中添加</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// 兼容 IE</span></span>
<span class="line"><span style="color:#676E95;font-style:italic;">// https://github.com/zloirock/core-js/blob/master/docs/2019-03-19-core-js-3-babel-and-a-look-into-the-future.md#babelpolyfill</span></span>
<span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">core-js/stable</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">regenerator-runtime/runtime</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span></code></pre></div><p>配置 <code>babel.config.js</code></p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#C792EA;">const</span><span style="color:#A6ACCD;"> plugins </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> []</span><span style="color:#89DDFF;">;</span></span>

2
assets/guide_vue2_ie.md.83d021b7.lean.js → assets/guide_vue2_ie.md.f5d567e9.lean.js
View File

@ -1 +1 @@
import{_ as s,o as a,c as n,R as e}from"./chunks/framework.6241eaf2.js";const d=JSON.parse('{"title":"添加 IE 兼容","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/ie.md","filePath":"guide/vue2/ie.md","lastUpdated":1687776555000}'),o={name:"guide/vue2/ie.md"},l=e("",8),p=[l];function t(c,r,i,D,y,C){return a(),n("div",null,p)}const u=s(o,[["render",t]]);export{d as __pageData,u as default};
import{_ as s,o as a,c as n,R as e}from"./chunks/framework.6241eaf2.js";const d=JSON.parse('{"title":"添加 IE 兼容","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/ie.md","filePath":"guide/vue2/ie.md","lastUpdated":1731315864000}'),o={name:"guide/vue2/ie.md"},l=e("",8),p=[l];function t(c,r,i,D,y,C){return a(),n("div",null,p)}const u=s(o,[["render",t]]);export{d as __pageData,u as default};

2
assets/guide_vue2_lint.md.d5070d4f.js → assets/guide_vue2_lint.md.94bcc728.js
View File

@ -1,4 +1,4 @@
import{_ as s,o as n,c as a,R as o}from"./chunks/framework.6241eaf2.js";const u=JSON.parse('{"title":"Eslint + Pettier 统一开发规范","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/lint.md","filePath":"guide/vue2/lint.md","lastUpdated":1687776555000}'),l={name:"guide/vue2/lint.md"},p=o(`<h1 id="eslint-pettier-统一开发规范" tabindex="-1">Eslint + Pettier 统一开发规范 <a class="header-anchor" href="#eslint-pettier-统一开发规范" aria-label="Permalink to &quot;Eslint + Pettier 统一开发规范&quot;">​</a></h1><p>VScode （版本 1.47.3）安装 <code>eslint</code> <code>prettier</code> <code>vetur</code> 插件 <code>.vue</code> 文件使用 vetur 进行格式化，其他使用<code>prettier</code>,后面会 专门写个如何使用配合使用这三个玩意</p><p>在文件 <code>.prettierrc</code> 里写 属于你的 pettier 规则</p><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;">{</span></span>
import{_ as s,o as n,c as a,R as o}from"./chunks/framework.6241eaf2.js";const u=JSON.parse('{"title":"Eslint + Pettier 统一开发规范","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/lint.md","filePath":"guide/vue2/lint.md","lastUpdated":1731315864000}'),l={name:"guide/vue2/lint.md"},p=o(`<h1 id="eslint-pettier-统一开发规范" tabindex="-1">Eslint + Pettier 统一开发规范 <a class="header-anchor" href="#eslint-pettier-统一开发规范" aria-label="Permalink to &quot;Eslint + Pettier 统一开发规范&quot;">​</a></h1><p>VScode （版本 1.47.3）安装 <code>eslint</code> <code>prettier</code> <code>vetur</code> 插件 <code>.vue</code> 文件使用 vetur 进行格式化，其他使用<code>prettier</code>，后面会专门写个如何使用配合使用这三个玩意儿</p><p>在文件 <code>.prettierrc</code> 里写 属于你的 pettier 规则</p><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#FFCB6B;">&quot;printWidth&quot;</span><span style="color:#82AAFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#F78C6C;">120</span><span style="color:#C3E88D;">,</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#FFCB6B;">&quot;tabWidth&quot;</span><span style="color:#82AAFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#F78C6C;">2</span><span style="color:#C3E88D;">,</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#FFCB6B;">&quot;singleQuote&quot;</span><span style="color:#82AAFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">true</span><span style="color:#C3E88D;">,</span></span>

2
assets/guide_vue2_lint.md.d5070d4f.lean.js → assets/guide_vue2_lint.md.94bcc728.lean.js
View File

@ -1 +1 @@
import{_ as s,o as n,c as a,R as o}from"./chunks/framework.6241eaf2.js";const u=JSON.parse('{"title":"Eslint + Pettier 统一开发规范","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/lint.md","filePath":"guide/vue2/lint.md","lastUpdated":1687776555000}'),l={name:"guide/vue2/lint.md"},p=o("",6),t=[p];function e(c,r,C,y,A,F){return n(),a("div",null,t)}const i=s(l,[["render",e]]);export{u as __pageData,i as default};
import{_ as s,o as n,c as a,R as o}from"./chunks/framework.6241eaf2.js";const u=JSON.parse('{"title":"Eslint + Pettier 统一开发规范","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/lint.md","filePath":"guide/vue2/lint.md","lastUpdated":1731315864000}'),l={name:"guide/vue2/lint.md"},p=o("",6),t=[p];function e(c,r,C,y,A,F){return n(),a("div",null,t)}const i=s(l,[["render",e]]);export{u as __pageData,i as default};

2
assets/guide_vue2_proxy.md.f5f5a403.js → assets/guide_vue2_proxy.md.0d483f53.js
View File

@ -1,4 +1,4 @@
import{_ as s,o as a,c as n,R as p}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"配置 proxy 跨域","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/proxy.md","filePath":"guide/vue2/proxy.md","lastUpdated":1687776555000}'),l={name:"guide/vue2/proxy.md"},o=p(`<h1 id="配置-proxy-跨域" tabindex="-1">配置 proxy 跨域 <a class="header-anchor" href="#配置-proxy-跨域" aria-label="Permalink to &quot;配置 proxy 跨域&quot;">​</a></h1><p>如果你的项目需要跨域设置，你需要打来 <code>vue.config.js</code> <code>proxy</code> 注释 并且配置相应参数</p><p><u><strong>!!!注意：你还需要将 <code>src/config/env.development.js</code> 里的 <code>baseApi</code> 设置成 &#39;/&#39;</strong></u></p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;">module.exports</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
import{_ as s,o as a,c as n,R as p}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"配置 proxy 跨域","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/proxy.md","filePath":"guide/vue2/proxy.md","lastUpdated":1731315864000}'),l={name:"guide/vue2/proxy.md"},o=p(`<h1 id="配置-proxy-跨域" tabindex="-1">配置 proxy 跨域 <a class="header-anchor" href="#配置-proxy-跨域" aria-label="Permalink to &quot;配置 proxy 跨域&quot;">​</a></h1><p>如果你的项目需要跨域设置，你需要打来 <code>vue.config.js</code> <code>proxy</code> 注释 并且配置相应参数</p><p><u><strong>!!!注意：你还需要将 <code>src/config/env.development.js</code> 里的 <code>baseApi</code> 设置成 &#39;/&#39;</strong></u></p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;">module.exports</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#F07178;">devServer</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#89DDFF;"> </span><span style="color:#676E95;font-style:italic;">// ....</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#F07178;">proxy</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>

2
assets/guide_vue2_proxy.md.f5f5a403.lean.js → assets/guide_vue2_proxy.md.0d483f53.lean.js
View File

@ -1 +1 @@
import{_ as s,o as a,c as n,R as p}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"配置 proxy 跨域","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/proxy.md","filePath":"guide/vue2/proxy.md","lastUpdated":1687776555000}'),l={name:"guide/vue2/proxy.md"},o=p("",6),e=[o];function t(c,r,D,y,F,i){return a(),n("div",null,e)}const d=s(l,[["render",t]]);export{A as __pageData,d as default};
import{_ as s,o as a,c as n,R as p}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"配置 proxy 跨域","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/proxy.md","filePath":"guide/vue2/proxy.md","lastUpdated":1731315864000}'),l={name:"guide/vue2/proxy.md"},o=p("",6),e=[o];function t(c,r,D,y,F,i){return a(),n("div",null,e)}const d=s(l,[["render",t]]);export{A as __pageData,d as default};

4
assets/guide_vue2_rem.md.769a5fda.js → assets/guide_vue2_rem.md.05f1a99e.js
View File

@ -1,4 +1,4 @@
import{_ as s,o as a,c as n,R as o}from"./chunks/framework.6241eaf2.js";const d=JSON.parse('{"title":"rem 适配方案","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/rem.md","filePath":"guide/vue2/rem.md","lastUpdated":1687776555000}'),l={name:"guide/vue2/rem.md"},p=o(`<h1 id="rem-适配方案" tabindex="-1">rem 适配方案 <a class="header-anchor" href="#rem-适配方案" aria-label="Permalink to &quot;rem 适配方案&quot;">​</a></h1><p>不用担心，项目已经配置好了 <code>rem</code> 适配, 下面仅做介绍：</p><p>Vant 中的样式默认使用<code>px</code>作为单位，如果需要使用<code>rem</code>单位，推荐使用以下两个工具:</p><ul><li><a href="https://github.com/cuth/postcss-pxtorem" target="_blank" rel="noreferrer">postcss-pxtorem</a> 是一款 <code>postcss</code> 插件，用于将单位转化为 <code>rem</code></li><li><a href="https://github.com/amfe/lib-flexible" target="_blank" rel="noreferrer">lib-flexible</a> 用于设置 <code>rem</code> 基准值</li></ul><h5 id="postcss-配置" tabindex="-1">PostCSS 配置 <a class="header-anchor" href="#postcss-配置" aria-label="Permalink to &quot;PostCSS 配置&quot;">​</a></h5><p>下面提供了一份基本的 <code>postcss</code> 配置，可以在此配置的基础上根据项目需求进行修改</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// https://github.com/michael-ciniawsky/postcss-load-config</span></span>
import{_ as s,o as a,c as n,R as o}from"./chunks/framework.6241eaf2.js";const d=JSON.parse('{"title":"rem 适配方案","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/rem.md","filePath":"guide/vue2/rem.md","lastUpdated":1731315864000}'),l={name:"guide/vue2/rem.md"},p=o(`<h1 id="rem-适配方案" tabindex="-1">rem 适配方案 <a class="header-anchor" href="#rem-适配方案" aria-label="Permalink to &quot;rem 适配方案&quot;">​</a></h1><p>不用担心，项目已经配置好了 <code>rem</code> 适配, 下面仅做介绍：</p><p>Vant 中的样式默认使用<code>px</code>作为单位，如果需要使用<code>rem</code>单位，推荐使用以下两个工具:</p><ul><li><a href="https://github.com/cuth/postcss-pxtorem" target="_blank" rel="noreferrer">postcss-pxtorem</a> 是一款 <code>postcss</code> 插件，用于将单位转化为 <code>rem</code></li><li><a href="https://github.com/amfe/lib-flexible" target="_blank" rel="noreferrer">lib-flexible</a> 用于设置 <code>rem</code> 基准值</li></ul><h5 id="postcss-配置" tabindex="-1">PostCSS 配置 <a class="header-anchor" href="#postcss-配置" aria-label="Permalink to &quot;PostCSS 配置&quot;">​</a></h5><p>下面提供了一份基本的 <code>postcss</code> 配置，可以在此配置的基础上根据项目需求进行修改</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// https://github.com/michael-ciniawsky/postcss-load-config</span></span>
<span class="line"><span style="color:#89DDFF;">module.exports</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#F07178;">plugins</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#F07178;">autoprefixer</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
@ -15,7 +15,7 @@ import{_ as s,o as a,c as n,R as o}from"./chunks/framework.6241eaf2.js";const d=
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#F07178;">propList</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> [</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">*</span><span style="color:#89DDFF;">&quot;</span><span style="color:#A6ACCD;">]</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#89DDFF;">};</span></span></code></pre></div><p>更多详细信息： <a href="https://youzan.github.io/vant/#/zh-CN/quickstart#jin-jie-yong-fa" target="_blank" rel="noreferrer">vant</a></p><p><strong>新手必看，老鸟跳过</strong></p><p>很多小伙伴会问我，适配的问题,因为我们使用的是 Vant UI，所以必须根据 Vant UI 375 的设计规范走，一般我们的设计会将 UI 图上传到蓝湖，我们就可以需要的尺寸了。下面就大概普及一下 rem。</p><p>我们知道 <code>1rem</code> 等于<code>html</code> 根元素设定的 <code>font-size</code> 的 <code>px</code> 值。Vant UI 设置 <code>rootValue: 37.5</code>,你可以看到在 iPhone 6 下看到 （<code>1rem 等于 37.5px</code>）：</p><div class="language-html"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;">&lt;</span><span style="color:#F07178;">html</span><span style="color:#89DDFF;"> </span><span style="color:#C792EA;">data-dpr</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">1</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;"> </span><span style="color:#C792EA;">style</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">font-size: 37.5px;</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">&gt;&lt;/</span><span style="color:#F07178;">html</span><span style="color:#89DDFF;">&gt;</span></span></code></pre></div><p>切换不同的机型，根元素可能会有不同的<code>font-size</code>。当你写 css px 样式时，会被程序换算成 <code>rem</code> 达到适配。</p><p>因为我们用了 Vant 的组件，需要按照 <code>rootValue: 37.5</code> 来写样式。</p><p>举个例子：设计给了你一张 750px * 1334px 图片，在 iPhone6 上铺满屏幕,其他机型适配。</p><ul><li>当<code>rootValue: 70</code> , 样式 <code>width: 750px;height: 1334px;</code> 图片会撑满 iPhone6 屏幕，这个时候切换其他机型，图片也会跟着撑满。</li><li>当<code>rootValue: 37.5</code> 的时候，样式 <code>width: 375px;height: 667px;</code> 图片会撑满 iPhone6 屏幕。</li></ul><p>也就是 iphone 6 下 375px 宽度写 CSS。其他的你就可以根据你设计图，去写对应的样式就可以了。</p><p>当然，想要撑满屏幕你可以使用 100%，这里只是举例说明。</p><div class="language-html"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;">&lt;</span><span style="color:#F07178;">img</span><span style="color:#89DDFF;"> </span><span style="color:#C792EA;">class</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">image</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;"> </span><span style="color:#C792EA;">src</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">https://www.sunniejs.cn/static/weapp/logo.png</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;"> /&gt;</span></span>
<span class="line"><span style="color:#89DDFF;">};</span></span></code></pre></div><p>更多详细信息： <a href="https://youzan.github.io/vant/#/zh-CN/quickstart#jin-jie-yong-fa" target="_blank" rel="noreferrer">vant</a></p><p><strong>新手必看，老鸟跳过</strong></p><p>很多小伙伴会问我，适配的问题，因为我们使用的是 Vant UI，所以必须根据 Vant UI 375 的设计规范走，一般我们的设计会将 UI 图上传到蓝湖，我们就可以得到需要的尺寸了。下面就简单普及一下 rem 适配的原理。</p><p>我们知道 <code>1rem</code> 等于<code>html</code> 根元素设定的 <code>font-size</code> 的 <code>px</code> 值。Vant UI 设置 <code>rootValue: 37.5</code>，你可以看到在 iPhone 6 下看到 （<code>1rem 等于 37.5px</code>）：</p><div class="language-html"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;">&lt;</span><span style="color:#F07178;">html</span><span style="color:#89DDFF;"> </span><span style="color:#C792EA;">data-dpr</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">1</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;"> </span><span style="color:#C792EA;">style</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">font-size: 37.5px;</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">&gt;&lt;/</span><span style="color:#F07178;">html</span><span style="color:#89DDFF;">&gt;</span></span></code></pre></div><p>切换不同的机型，根元素可能会有不同的<code>font-size</code>。当你写 css px 样式时，会被程序换算成 <code>rem</code> 达到适配。</p><p>因为我们用了 Vant 的组件，需要按照 <code>rootValue: 37.5</code> 来写样式。</p><p>举个例子：设计给了你一张 750px * 1334px 图片，在 iPhone6 上铺满屏幕，其他机型适配。</p><ul><li>当<code>rootValue: 70</code> , 样式 <code>width: 750px;height: 1334px;</code> 图片会撑满 iPhone6 屏幕，这个时候切换其他机型，图片也会跟着撑满。</li><li>当<code>rootValue: 37.5</code> 的时候，样式 <code>width: 375px;height: 667px;</code> 图片会撑满 iPhone6 屏幕。</li></ul><p>也就是 iphone 6 下 375px 宽度写 CSS。其他的你就可以根据你设计图，去写对应的样式就可以了。</p><p>当然，想要撑满屏幕你可以使用 100%，这里只是举例说明。</p><div class="language-html"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;">&lt;</span><span style="color:#F07178;">img</span><span style="color:#89DDFF;"> </span><span style="color:#C792EA;">class</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">image</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;"> </span><span style="color:#C792EA;">src</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">https://www.sunniejs.cn/static/weapp/logo.png</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;"> /&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color:#89DDFF;">&lt;</span><span style="color:#F07178;">style</span><span style="color:#89DDFF;">&gt;</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#676E95;font-style:italic;">/* rootValue: 75 */</span></span>

2
assets/guide_vue2_rem.md.769a5fda.lean.js → assets/guide_vue2_rem.md.05f1a99e.lean.js
View File

@ -1 +1 @@
import{_ as s,o as a,c as n,R as o}from"./chunks/framework.6241eaf2.js";const d=JSON.parse('{"title":"rem 适配方案","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/rem.md","filePath":"guide/vue2/rem.md","lastUpdated":1687776555000}'),l={name:"guide/vue2/rem.md"},p=o("",19),e=[p];function t(c,r,D,F,y,i){return a(),n("div",null,e)}const A=s(l,[["render",t]]);export{d as __pageData,A as default};
import{_ as s,o as a,c as n,R as o}from"./chunks/framework.6241eaf2.js";const d=JSON.parse('{"title":"rem 适配方案","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/rem.md","filePath":"guide/vue2/rem.md","lastUpdated":1731315864000}'),l={name:"guide/vue2/rem.md"},p=o("",19),e=[p];function t(c,r,D,F,y,i){return a(),n("div",null,e)}const A=s(l,[["render",t]]);export{d as __pageData,A as default};

2
assets/guide_vue2_router.md.d35b25e7.js → assets/guide_vue2_router.md.369637ff.js
View File

@ -1,4 +1,4 @@
import{_ as s,o as a,c as n,R as o}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"Vue-router","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/router.md","filePath":"guide/vue2/router.md","lastUpdated":1687776555000}'),l={name:"guide/vue2/router.md"},p=o(`<h1 id="vue-router" tabindex="-1">Vue-router <a class="header-anchor" href="#vue-router" aria-label="Permalink to &quot;Vue-router&quot;">​</a></h1><p>本案例采用 <code>hash</code> 模式，开发者根据需求修改 <code>mode</code> <code>base</code></p><p><strong>注意</strong>：如果你使用了 <code>history</code> 模式，<code>vue.config.js</code> 中的 <code>publicPath</code> 要做对应的<strong>修改</strong></p><p>前往:<a href="#base">vue.config.js 基础配置</a></p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> Vue </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">vue</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
import{_ as s,o as a,c as n,R as o}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"Vue-router","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/router.md","filePath":"guide/vue2/router.md","lastUpdated":1731315864000}'),l={name:"guide/vue2/router.md"},p=o(`<h1 id="vue-router" tabindex="-1">Vue-router <a class="header-anchor" href="#vue-router" aria-label="Permalink to &quot;Vue-router&quot;">​</a></h1><p>本案例采用 <code>hash</code> 模式，开发者根据需求修改 <code>mode</code> <code>base</code></p><p><strong>注意</strong>：如果你使用了 <code>history</code> 模式，<code>vue.config.js</code> 中的 <code>publicPath</code> 要做对应的<strong>修改</strong></p><p>前往: <a href="#base">vue.config.js 基础配置</a></p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> Vue </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">vue</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> Router </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">vue-router</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"></span>
<span class="line"><span style="color:#A6ACCD;">Vue</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">use</span><span style="color:#A6ACCD;">(Router)</span><span style="color:#89DDFF;">;</span></span>

2
assets/guide_vue2_router.md.d35b25e7.lean.js → assets/guide_vue2_router.md.369637ff.lean.js
View File

@ -1 +1 @@
import{_ as s,o as a,c as n,R as o}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"Vue-router","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/router.md","filePath":"guide/vue2/router.md","lastUpdated":1687776555000}'),l={name:"guide/vue2/router.md"},p=o("",5),e=[p];function t(c,r,D,y,F,A){return a(),n("div",null,e)}const u=s(l,[["render",t]]);export{i as __pageData,u as default};
import{_ as s,o as a,c as n,R as o}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"Vue-router","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/router.md","filePath":"guide/vue2/router.md","lastUpdated":1731315864000}'),l={name:"guide/vue2/router.md"},p=o("",5),e=[p];function t(c,r,D,y,F,A){return a(),n("div",null,e)}const u=s(l,[["render",t]]);export{i as __pageData,u as default};

6
assets/guide_vue2_sass.md.723a4859.js → assets/guide_vue2_sass.md.3616d11c.js
View File

@ -1,4 +1,4 @@
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"Sass 全局样式","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/sass.md","filePath":"guide/vue2/sass.md","lastUpdated":1687776555000}'),p={name:"guide/vue2/sass.md"},o=l(`<h1 id="sass-全局样式" tabindex="-1">Sass 全局样式 <a class="header-anchor" href="#sass-全局样式" aria-label="Permalink to &quot;Sass 全局样式&quot;">​</a></h1><p>首先 你可能会遇到 <code>node-sass</code> 安装不成功，别放弃多试几次！！！</p><p>每个页面自己对应的样式都写在自己的 .vue 文件之中 <code>scoped</code> 它顾名思义给 css 加了一个域的概念。</p><div class="language-html"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;">&lt;</span><span style="color:#F07178;">style</span><span style="color:#89DDFF;"> </span><span style="color:#C792EA;">lang</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">scss</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">&gt;</span></span>
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"Sass 全局样式","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/sass.md","filePath":"guide/vue2/sass.md","lastUpdated":1731315864000}'),p={name:"guide/vue2/sass.md"},o=l(`<h1 id="sass-全局样式" tabindex="-1">Sass 全局样式 <a class="header-anchor" href="#sass-全局样式" aria-label="Permalink to &quot;Sass 全局样式&quot;">​</a></h1><p>首先 你可能会遇到 <code>node-sass</code> 安装不成功，别放弃多试几次！！！</p><p>每个页面自己对应的样式都写在自己的 .vue 文件之中 <code>scoped</code> 它顾名思义给 css 加了一个域的概念。</p><div class="language-html"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;">&lt;</span><span style="color:#F07178;">style</span><span style="color:#89DDFF;"> </span><span style="color:#C792EA;">lang</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">scss</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">&gt;</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#676E95;font-style:italic;">/* global styles */</span></span>
<span class="line"><span style="color:#89DDFF;">&lt;/</span><span style="color:#F07178;">style</span><span style="color:#89DDFF;">&gt;</span></span>
<span class="line"></span>
@ -16,7 +16,7 @@ import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const A=
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">}</span></span>
<span class="line"><span style="color:#A6ACCD;">}</span></span></code></pre></div><h4 id="父组件改变子组件样式-深度选择器" tabindex="-1">父组件改变子组件样式 深度选择器 <a class="header-anchor" href="#父组件改变子组件样式-深度选择器" aria-label="Permalink to &quot;父组件改变子组件样式 深度选择器&quot;">​</a></h4><p>当你子组件使用了 <code>scoped</code> 但在父组件又想修改子组件的样式可以 通过 <code>&gt;&gt;&gt;</code> 来实现：</p><div class="language-css"><button title="Copy Code" class="copy"></button><span class="lang">css</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#A6ACCD;">&lt;</span><span style="color:#FFCB6B;">style</span><span style="color:#A6ACCD;"> scoped</span><span style="color:#89DDFF;">&gt;</span></span>
<span class="line"><span style="color:#89DDFF;">.</span><span style="color:#FFCB6B;">a</span><span style="color:#A6ACCD;"> &gt;&gt;&gt; </span><span style="color:#89DDFF;">.</span><span style="color:#FFCB6B;">b</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span><span style="color:#A6ACCD;"> </span><span style="color:#676E95;font-style:italic;">/* ... */</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">}</span></span>
<span class="line"><span style="color:#A6ACCD;">&lt;/</span><span style="color:#FFCB6B;">style</span><span style="color:#89DDFF;">&gt;</span></span></code></pre></div><h4 id="全局变量" tabindex="-1">全局变量 <a class="header-anchor" href="#全局变量" aria-label="Permalink to &quot;全局变量&quot;">​</a></h4><p><code>vue.config.js</code> 配置使用 <code>css.loaderOptions</code> 选项,注入 <code>sass</code> 的 <code>mixin</code> <code>variables</code> 到全局，不需要手动引入 ,配置<code>$cdn</code>通过变量形式引入 cdn 地址,这样向所有 Sass/Less 样式传入共享的全局变量：</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#C792EA;">const</span><span style="color:#A6ACCD;"> IS_PROD </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> [</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">production</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">prod</span><span style="color:#89DDFF;">&quot;</span><span style="color:#A6ACCD;">]</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">includes</span><span style="color:#A6ACCD;">(process</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">env</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">NODE_ENV)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#A6ACCD;">&lt;/</span><span style="color:#FFCB6B;">style</span><span style="color:#89DDFF;">&gt;</span></span></code></pre></div><h4 id="全局变量" tabindex="-1">全局变量 <a class="header-anchor" href="#全局变量" aria-label="Permalink to &quot;全局变量&quot;">​</a></h4><p><code>vue.config.js</code> 配置使用 <code>css.loaderOptions</code> 选项，注入 <code>sass</code> 的 <code>mixin</code> <code>variables</code> 到全局，不需要手动引入，配置<code>$cdn</code>通过变量形式引入 cdn 地址，这样向所有 Sass/Less 样式传入共享的全局变量：</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#C792EA;">const</span><span style="color:#A6ACCD;"> IS_PROD </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> [</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">production</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">prod</span><span style="color:#89DDFF;">&quot;</span><span style="color:#A6ACCD;">]</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">includes</span><span style="color:#A6ACCD;">(process</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">env</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">NODE_ENV)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#C792EA;">const</span><span style="color:#A6ACCD;"> defaultSettings </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#82AAFF;">require</span><span style="color:#A6ACCD;">(</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">./src/config/index.js</span><span style="color:#89DDFF;">&quot;</span><span style="color:#A6ACCD;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;">module.exports</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#F07178;">css</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
@ -35,7 +35,7 @@ import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const A=
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#89DDFF;">};</span></span></code></pre></div><p>设置 js 中可以访问 <code>$cdn</code>,<code>.vue</code> 文件中使用<code>this.$cdn</code>访问</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// 引入全局样式</span></span>
<span class="line"><span style="color:#89DDFF;">};</span></span></code></pre></div><p>设置 js 中可以访问 <code>$cdn</code>，<code>.vue</code> 文件中使用<code>this.$cdn</code>访问</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// 引入全局样式</span></span>
<span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">@/assets/css/index.scss</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"></span>
<span class="line"><span style="color:#676E95;font-style:italic;">// 设置 js中可以访问 $cdn</span></span>

2
assets/guide_vue2_sass.md.723a4859.lean.js → assets/guide_vue2_sass.md.3616d11c.lean.js
View File

@ -1 +1 @@
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"Sass 全局样式","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/sass.md","filePath":"guide/vue2/sass.md","lastUpdated":1687776555000}'),p={name:"guide/vue2/sass.md"},o=l("",20),e=[o];function t(c,r,D,y,F,C){return a(),n("div",null,e)}const d=s(p,[["render",t]]);export{A as __pageData,d as default};
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"Sass 全局样式","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/sass.md","filePath":"guide/vue2/sass.md","lastUpdated":1731315864000}'),p={name:"guide/vue2/sass.md"},o=l("",20),e=[o];function t(c,r,D,y,F,C){return a(),n("div",null,e)}const d=s(p,[["render",t]]);export{A as __pageData,d as default};

11
assets/guide_vue2_start.md.e13e8546.js
View File

@ -1,11 +0,0 @@
import{_ as s,o as a,c as n,R as e}from"./chunks/framework.6241eaf2.js";const C=JSON.parse('{"title":"启动项目","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/start.md","filePath":"guide/vue2/start.md","lastUpdated":1687776555000}'),l={name:"guide/vue2/start.md"},t=e(`<h1 id="启动项目" tabindex="-1">启动项目 <a class="header-anchor" href="#启动项目" aria-label="Permalink to &quot;启动项目&quot;">​</a></h1><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// 拉取项目</span></span>
<span class="line"><span style="color:#A6ACCD;">git clone </span><span style="color:#FFCB6B;">https</span><span style="color:#89DDFF;">:</span><span style="color:#676E95;font-style:italic;">//github.com/sunniejs/vue-h5-template</span></span>
<span class="line"></span>
<span class="line"><span style="color:#676E95;font-style:italic;">// 切换分支</span></span>
<span class="line"><span style="color:#A6ACCD;">git checkout </span><span style="color:#89DDFF;">-</span><span style="color:#A6ACCD;">b vue2</span><span style="color:#89DDFF;">-</span><span style="color:#A6ACCD;">h5</span><span style="color:#89DDFF;">-</span><span style="color:#A6ACCD;">template origin</span><span style="color:#89DDFF;">/</span><span style="color:#A6ACCD;">vue2</span><span style="color:#89DDFF;">-</span><span style="color:#A6ACCD;">h5</span><span style="color:#89DDFF;">-</span><span style="color:#A6ACCD;">template</span></span>
<span class="line"></span>
<span class="line"><span style="color:#676E95;font-style:italic;">// 安装依赖</span></span>
<span class="line"><span style="color:#A6ACCD;">yarn install</span></span>
<span class="line"></span>
<span class="line"><span style="color:#676E95;font-style:italic;">// 启动项目</span></span>
<span class="line"><span style="color:#A6ACCD;">yarn serve</span></span></code></pre></div>`,2),p=[t];function o(c,r,i,y,_,d){return a(),n("div",null,p)}const A=s(l,[["render",o]]);export{C as __pageData,A as default};

1
assets/guide_vue2_start.md.e13e8546.lean.js
View File

@ -1 +0,0 @@
import{_ as s,o as a,c as n,R as e}from"./chunks/framework.6241eaf2.js";const C=JSON.parse('{"title":"启动项目","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/start.md","filePath":"guide/vue2/start.md","lastUpdated":1687776555000}'),l={name:"guide/vue2/start.md"},t=e("",2),p=[t];function o(c,r,i,y,_,d){return a(),n("div",null,p)}const A=s(l,[["render",o]]);export{C as __pageData,A as default};

11
assets/guide_vue2_start.md.f6e40312.js Normal file
View File

@ -0,0 +1,11 @@
import{_ as s,o as a,c as n,R as e}from"./chunks/framework.6241eaf2.js";const h=JSON.parse('{"title":"启动项目","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/start.md","filePath":"guide/vue2/start.md","lastUpdated":1731315864000}'),l={name:"guide/vue2/start.md"},t=e(`<h1 id="启动项目" tabindex="-1">启动项目 <a class="header-anchor" href="#启动项目" aria-label="Permalink to &quot;启动项目&quot;">​</a></h1><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;"># 拉取项目</span></span>
<span class="line"><span style="color:#FFCB6B;">git</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">clone</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">https://github.com/sunniejs/vue-h5-template</span></span>
<span class="line"></span>
<span class="line"><span style="color:#676E95;font-style:italic;"># 切换分支</span></span>
<span class="line"><span style="color:#FFCB6B;">git</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">checkout</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">-b</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">vue2-h5-template</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">origin/vue2-h5-template</span></span>
<span class="line"></span>
<span class="line"><span style="color:#676E95;font-style:italic;"># 安装依赖</span></span>
<span class="line"><span style="color:#FFCB6B;">yarn</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">install</span></span>
<span class="line"></span>
<span class="line"><span style="color:#676E95;font-style:italic;"># 启动项目</span></span>
<span class="line"><span style="color:#FFCB6B;">yarn</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">serve</span></span></code></pre></div>`,2),p=[t];function o(c,r,i,y,C,_){return a(),n("div",null,p)}const u=s(l,[["render",o]]);export{h as __pageData,u as default};

1
assets/guide_vue2_start.md.f6e40312.lean.js Normal file
View File

@ -0,0 +1 @@
import{_ as s,o as a,c as n,R as e}from"./chunks/framework.6241eaf2.js";const h=JSON.parse('{"title":"启动项目","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/start.md","filePath":"guide/vue2/start.md","lastUpdated":1731315864000}'),l={name:"guide/vue2/start.md"},t=e("",2),p=[t];function o(c,r,i,y,C,_){return a(),n("div",null,p)}const u=s(l,[["render",o]]);export{h as __pageData,u as default};

2
assets/guide_vue2_vant.md.9252795d.js → assets/guide_vue2_vant.md.4ed27c84.js
View File

@ -1,4 +1,4 @@
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"VantUI 组件按需加载","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/vant.md","filePath":"guide/vue2/vant.md","lastUpdated":1687776555000}'),p={name:"guide/vue2/vant.md"},o=l(`<h1 id="vantui-组件按需加载" tabindex="-1">VantUI 组件按需加载 <a class="header-anchor" href="#vantui-组件按需加载" aria-label="Permalink to &quot;VantUI 组件按需加载&quot;">​</a></h1><p>项目采 用<a href="https://youzan.github.io/vant/#/zh-CN/quickstart#fang-shi-yi.-zi-dong-an-xu-yin-ru-zu-jian-tui-jian" target="_blank" rel="noreferrer">Vant 自动按需引入组件 (推荐)</a>下 面安装插件介绍：</p><p><a href="https://github.com/ant-design/babel-plugin-import" target="_blank" rel="noreferrer">babel-plugin-import</a> 是一款 <code>babel</code> 插件，它会在编译过程中将 <code>import</code> 的写法自动转换为按需引入的方式</p><h2 id="安装插件" tabindex="-1">安装插件 <a class="header-anchor" href="#安装插件" aria-label="Permalink to &quot;安装插件&quot;">​</a></h2><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">npm</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">i</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">babel-plugin-import</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">-D</span></span></code></pre></div><p>在<code>babel.config.js</code> 设置</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// 对于使用 babel7 的用户，可以在 babel.config.js 中配置</span></span>
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"VantUI 组件按需加载","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/vant.md","filePath":"guide/vue2/vant.md","lastUpdated":1731315864000}'),p={name:"guide/vue2/vant.md"},o=l(`<h1 id="vantui-组件按需加载" tabindex="-1">VantUI 组件按需加载 <a class="header-anchor" href="#vantui-组件按需加载" aria-label="Permalink to &quot;VantUI 组件按需加载&quot;">​</a></h1><p>项目采 用<a href="https://youzan.github.io/vant/#/zh-CN/quickstart#fang-shi-yi.-zi-dong-an-xu-yin-ru-zu-jian-tui-jian" target="_blank" rel="noreferrer">Vant 自动按需引入组件 (推荐)</a>下 面安装插件介绍：</p><p><a href="https://github.com/ant-design/babel-plugin-import" target="_blank" rel="noreferrer">babel-plugin-import</a> 是一款 <code>babel</code> 插件，它会在编译过程中将 <code>import</code> 的写法自动转换为按需引入的方式</p><h2 id="安装插件" tabindex="-1">安装插件 <a class="header-anchor" href="#安装插件" aria-label="Permalink to &quot;安装插件&quot;">​</a></h2><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">npm</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">i</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">babel-plugin-import</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">-D</span></span></code></pre></div><p>在<code>babel.config.js</code> 设置</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// 对于使用 babel7 的用户，可以在 babel.config.js 中配置</span></span>
<span class="line"><span style="color:#C792EA;">const</span><span style="color:#A6ACCD;"> plugins </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> [</span></span>
<span class="line"><span style="color:#A6ACCD;"> [</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">import</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">,</span></span>

2
assets/guide_vue2_vant.md.9252795d.lean.js → assets/guide_vue2_vant.md.4ed27c84.lean.js
View File

@ -1 +1 @@
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"VantUI 组件按需加载","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/vant.md","filePath":"guide/vue2/vant.md","lastUpdated":1687776555000}'),p={name:"guide/vue2/vant.md"},o=l("",10),e=[o];function t(c,r,D,y,F,C){return a(),n("div",null,e)}const u=s(p,[["render",t]]);export{A as __pageData,u as default};
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"VantUI 组件按需加载","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/vant.md","filePath":"guide/vue2/vant.md","lastUpdated":1731315864000}'),p={name:"guide/vue2/vant.md"},o=l("",10),e=[o];function t(c,r,D,y,F,C){return a(),n("div",null,e)}const u=s(p,[["render",t]]);export{A as __pageData,u as default};

2
assets/guide_vue2_vuex.md.618230b5.js → assets/guide_vue2_vuex.md.399839b6.js
View File

@ -1,4 +1,4 @@
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"Vuex 状态管理","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/vuex.md","filePath":"guide/vue2/vuex.md","lastUpdated":1687776555000}'),p={name:"guide/vue2/vuex.md"},o=l(`<h1 id="vuex-状态管理" tabindex="-1">Vuex 状态管理 <a class="header-anchor" href="#vuex-状态管理" aria-label="Permalink to &quot;Vuex 状态管理&quot;">​</a></h1><p>目录结构</p><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">├──</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">store</span></span>
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"Vuex 状态管理","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/vuex.md","filePath":"guide/vue2/vuex.md","lastUpdated":1731315864000}'),p={name:"guide/vue2/vuex.md"},o=l(`<h1 id="vuex-状态管理" tabindex="-1">Vuex 状态管理 <a class="header-anchor" href="#vuex-状态管理" aria-label="Permalink to &quot;Vuex 状态管理&quot;">​</a></h1><p>目录结构</p><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">├──</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">store</span></span>
<span class="line"><span style="color:#FFCB6B;">│</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">├──</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">modules</span></span>
<span class="line"><span style="color:#FFCB6B;">│</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">│</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">└──</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">app.js</span></span>
<span class="line"><span style="color:#FFCB6B;">│</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">├──</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">index.js</span></span>

2
assets/guide_vue2_vuex.md.618230b5.lean.js → assets/guide_vue2_vuex.md.399839b6.lean.js
View File

@ -1 +1 @@
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"Vuex 状态管理","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/vuex.md","filePath":"guide/vue2/vuex.md","lastUpdated":1687776555000}'),p={name:"guide/vue2/vuex.md"},o=l("",7),e=[o];function t(c,r,D,y,F,C){return a(),n("div",null,e)}const u=s(p,[["render",t]]);export{i as __pageData,u as default};
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"Vuex 状态管理","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/vuex.md","filePath":"guide/vue2/vuex.md","lastUpdated":1731315864000}'),p={name:"guide/vue2/vuex.md"},o=l("",7),e=[o];function t(c,r,D,y,F,C){return a(),n("div",null,e)}const u=s(p,[["render",t]]);export{i as __pageData,u as default};

2
assets/guide_vue2_vw.md.ca9fc79f.js → assets/guide_vue2_vw.md.f3d8795c.js
View File

@ -1,4 +1,4 @@
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"vm 适配方案","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/vw.md","filePath":"guide/vue2/vw.md","lastUpdated":1687776555000}'),o={name:"guide/vue2/vw.md"},p=l(`<h1 id="vm-适配方案" tabindex="-1">vm 适配方案 <a class="header-anchor" href="#vm-适配方案" aria-label="Permalink to &quot;vm 适配方案&quot;">​</a></h1><p>本项目使用的是 <code>rem</code> 的 适配方案，其实无论你使用哪种方案，都不需要你去计算 12px 是多少 <code>rem</code> 或者 <code>vw</code>, 会有专门的工具去帮你做 。如果你想用 <code>vw</code>,你可以按照下面的方式切换。</p><h2 id="_1-安装依赖" tabindex="-1">1.安装依赖 <a class="header-anchor" href="#_1-安装依赖" aria-label="Permalink to &quot;1.安装依赖&quot;">​</a></h2><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">npm</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">install</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">postcss-px-to-viewport</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">-D</span></span></code></pre></div><h2 id="_2-修改-postcssrc-js" tabindex="-1">2.修改 .postcssrc.js <a class="header-anchor" href="#_2-修改-postcssrc-js" aria-label="Permalink to &quot;2.修改 .postcssrc.js&quot;">​</a></h2><p>将根目录下 .postcssrc.js 文件修改如下</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// https://github.com/michael-ciniawsky/postcss-load-config</span></span>
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"vm 适配方案","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/vw.md","filePath":"guide/vue2/vw.md","lastUpdated":1731315864000}'),o={name:"guide/vue2/vw.md"},p=l(`<h1 id="vm-适配方案" tabindex="-1">vm 适配方案 <a class="header-anchor" href="#vm-适配方案" aria-label="Permalink to &quot;vm 适配方案&quot;">​</a></h1><p>本项目使用的是 <code>rem</code> 的 适配方案，其实无论你使用哪种方案，都不需要你去计算 12px 是多少 <code>rem</code> 或者 <code>vw</code>, 会有专门的工具去帮你做 。如果你想用 <code>vw</code>，你可以按照下面的方式切换。</p><h2 id="_1-安装依赖" tabindex="-1">1.安装依赖 <a class="header-anchor" href="#_1-安装依赖" aria-label="Permalink to &quot;1.安装依赖&quot;">​</a></h2><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">npm</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">install</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">postcss-px-to-viewport</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">-D</span></span></code></pre></div><h2 id="_2-修改-postcssrc-js" tabindex="-1">2.修改 .postcssrc.js <a class="header-anchor" href="#_2-修改-postcssrc-js" aria-label="Permalink to &quot;2.修改 .postcssrc.js&quot;">​</a></h2><p>将根目录下 .postcssrc.js 文件修改如下</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// https://github.com/michael-ciniawsky/postcss-load-config</span></span>
<span class="line"><span style="color:#89DDFF;">module.exports</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#F07178;">plugins</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#F07178;">autoprefixer</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>

2
assets/guide_vue2_vw.md.ca9fc79f.lean.js → assets/guide_vue2_vw.md.f3d8795c.lean.js
View File

@ -1 +1 @@
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"vm 适配方案","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/vw.md","filePath":"guide/vue2/vw.md","lastUpdated":1687776555000}'),o={name:"guide/vue2/vw.md"},p=l("",13),e=[p];function t(c,r,D,y,F,i){return a(),n("div",null,e)}const u=s(o,[["render",t]]);export{A as __pageData,u as default};
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"vm 适配方案","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue2/vw.md","filePath":"guide/vue2/vw.md","lastUpdated":1731315864000}'),o={name:"guide/vue2/vw.md"},p=l("",13),e=[p];function t(c,r,D,y,F,i){return a(),n("div",null,e)}const u=s(o,[["render",t]]);export{A as __pageData,u as default};

2
assets/guide_vue3_alias.md.d777bc16.js → assets/guide_vue3_alias.md.6e50bff0.js
View File

@ -1,4 +1,4 @@
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const _=JSON.parse('{"title":"alias","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/alias.md","filePath":"guide/vue3/alias.md","lastUpdated":1687776555000}'),p={name:"guide/vue3/alias.md"},o=l(`<h1 id="alias" tabindex="-1">alias <a class="header-anchor" href="#alias" aria-label="Permalink to &quot;alias&quot;">​</a></h1><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">resolve</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const _=JSON.parse('{"title":"alias","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/alias.md","filePath":"guide/vue3/alias.md","lastUpdated":1731315864000}'),p={name:"guide/vue3/alias.md"},o=l(`<h1 id="alias" tabindex="-1">alias <a class="header-anchor" href="#alias" aria-label="Permalink to &quot;alias&quot;">​</a></h1><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">resolve</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#FFCB6B;">alias</span><span style="color:#89DDFF;">:</span><span style="color:#F07178;"> [</span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> find</span><span style="color:#89DDFF;">:</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">vue-i18n</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#F07178;"> replacement</span><span style="color:#89DDFF;">:</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">vue-i18n/dist/vue-i18n.cjs.js</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span>

2
assets/guide_vue3_alias.md.d777bc16.lean.js → assets/guide_vue3_alias.md.6e50bff0.lean.js
View File

@ -1 +1 @@
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const _=JSON.parse('{"title":"alias","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/alias.md","filePath":"guide/vue3/alias.md","lastUpdated":1687776555000}'),p={name:"guide/vue3/alias.md"},o=l("",2),e=[o];function t(c,r,F,D,y,i){return a(),n("div",null,e)}const C=s(p,[["render",t]]);export{_ as __pageData,C as default};
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const _=JSON.parse('{"title":"alias","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/alias.md","filePath":"guide/vue3/alias.md","lastUpdated":1731315864000}'),p={name:"guide/vue3/alias.md"},o=l("",2),e=[o];function t(c,r,F,D,y,i){return a(),n("div",null,e)}const C=s(p,[["render",t]]);export{_ as __pageData,C as default};

2
assets/guide_vue3_axios.md.cd29cfa2.js → assets/guide_vue3_axios.md.0778382b.js
View File

@ -1,4 +1,4 @@
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const C=JSON.parse('{"title":"axios 封装及接口管理","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/axios.md","filePath":"guide/vue3/axios.md","lastUpdated":1687776555000}'),o={name:"guide/vue3/axios.md"},p=l(`<h1 id="axios-封装及接口管理" tabindex="-1">axios 封装及接口管理 <a class="header-anchor" href="#axios-封装及接口管理" aria-label="Permalink to &quot;axios 封装及接口管理&quot;">​</a></h1><p><code>utils/request.js</code> 封装 axios , 开发者需要根据后台接口做修改。</p><ul><li><code>service.interceptors.request.use</code> 里可以设置请求头，比如设置 <code>token</code></li><li><code>config.hideloading</code> 是在 api 文件夹下的接口参数里设置，下文会讲</li><li><code>service.interceptors.response.use</code> 里可以对接口返回数据处理，比如 401 删除本地信息，重新登录</li></ul><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> axios </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">axios</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const C=JSON.parse('{"title":"axios 封装及接口管理","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/axios.md","filePath":"guide/vue3/axios.md","lastUpdated":1731315864000}'),o={name:"guide/vue3/axios.md"},p=l(`<h1 id="axios-封装及接口管理" tabindex="-1">axios 封装及接口管理 <a class="header-anchor" href="#axios-封装及接口管理" aria-label="Permalink to &quot;axios 封装及接口管理&quot;">​</a></h1><p><code>utils/request.js</code> 封装 axios , 开发者需要根据后台接口做修改。</p><ul><li><code>service.interceptors.request.use</code> 里可以设置请求头，比如设置 <code>token</code></li><li><code>config.hideloading</code> 是在 api 文件夹下的接口参数里设置，下文会讲</li><li><code>service.interceptors.response.use</code> 里可以对接口返回数据处理，比如 401 删除本地信息，重新登录</li></ul><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> axios </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">axios</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> store </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">@/store</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">Toast</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">}</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">vant</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#676E95;font-style:italic;">// 根据环境不同引入不同api地址</span></span>

2
assets/guide_vue3_axios.md.cd29cfa2.lean.js → assets/guide_vue3_axios.md.0778382b.lean.js
View File

@ -1 +1 @@
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const C=JSON.parse('{"title":"axios 封装及接口管理","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/axios.md","filePath":"guide/vue3/axios.md","lastUpdated":1687776555000}'),o={name:"guide/vue3/axios.md"},p=l("",4),e=[p];function t(c,r,F,y,D,i){return n(),a("div",null,e)}const u=s(o,[["render",t]]);export{C as __pageData,u as default};
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const C=JSON.parse('{"title":"axios 封装及接口管理","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/axios.md","filePath":"guide/vue3/axios.md","lastUpdated":1731315864000}'),o={name:"guide/vue3/axios.md"},p=l("",4),e=[p];function t(c,r,F,y,D,i){return n(),a("div",null,e)}const u=s(o,[["render",t]]);export{C as __pageData,u as default};

2
assets/guide_vue3_base.md.732de433.js → assets/guide_vue3_base.md.462dbdb9.js
View File

@ -1,4 +1,4 @@
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const d=JSON.parse('{"title":"vite.config.ts 基础配置","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/base.md","filePath":"guide/vue3/base.md","lastUpdated":1687776555000}'),p={name:"guide/vue3/base.md"},o=l(`<h1 id="vite-config-ts-基础配置" tabindex="-1">vite.config.ts 基础配置 <a class="header-anchor" href="#vite-config-ts-基础配置" aria-label="Permalink to &quot;vite.config.ts 基础配置&quot;">​</a></h1><p>如果你的 <code>Vue Router</code> 模式是 hash</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">publicPath</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">./</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span></code></pre></div><p>如果你的 <code>Vue Router</code> 模式是 history 这里的 publicPath 和你的 <code>Vue Router</code> <code>base</code> <strong>保持一致</strong></p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">publicPath</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">/app/</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span></code></pre></div><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;font-style:italic;">export</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;font-style:italic;">default</span><span style="color:#A6ACCD;"> </span><span style="color:#C792EA;">function</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">({</span><span style="color:#A6ACCD;"> </span><span style="color:#A6ACCD;font-style:italic;">command</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">}:</span><span style="color:#A6ACCD;"> </span><span style="color:#FFCB6B;">ConfigEnv</span><span style="color:#89DDFF;">):</span><span style="color:#A6ACCD;"> </span><span style="color:#FFCB6B;">UserConfigExport</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const d=JSON.parse('{"title":"vite.config.ts 基础配置","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/base.md","filePath":"guide/vue3/base.md","lastUpdated":1731315864000}'),p={name:"guide/vue3/base.md"},o=l(`<h1 id="vite-config-ts-基础配置" tabindex="-1">vite.config.ts 基础配置 <a class="header-anchor" href="#vite-config-ts-基础配置" aria-label="Permalink to &quot;vite.config.ts 基础配置&quot;">​</a></h1><p>如果你的 <code>Vue Router</code> 模式是 hash</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">base</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">./</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span></code></pre></div><p>如果你的 <code>Vue Router</code> 模式是 history 这里的 publicPath 和你的 <code>Vue Router</code> <code>base</code> <strong>保持一致</strong></p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">base</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">/app/</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span></code></pre></div><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;font-style:italic;">export</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;font-style:italic;">default</span><span style="color:#A6ACCD;"> </span><span style="color:#C792EA;">function</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">({</span><span style="color:#A6ACCD;"> </span><span style="color:#A6ACCD;font-style:italic;">command</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">}:</span><span style="color:#A6ACCD;"> </span><span style="color:#FFCB6B;">ConfigEnv</span><span style="color:#89DDFF;">):</span><span style="color:#A6ACCD;"> </span><span style="color:#FFCB6B;">UserConfigExport</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#C792EA;">const</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">isProduction</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">=</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">command</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">===</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">build</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;font-style:italic;">return</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> server</span><span style="color:#89DDFF;">:</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">{</span></span>

2
assets/guide_vue3_base.md.732de433.lean.js → assets/guide_vue3_base.md.462dbdb9.lean.js
View File

@ -1 +1 @@
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const d=JSON.parse('{"title":"vite.config.ts 基础配置","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/base.md","filePath":"guide/vue3/base.md","lastUpdated":1687776555000}'),p={name:"guide/vue3/base.md"},o=l("",6),e=[o];function t(c,r,F,y,D,i){return a(),n("div",null,e)}const C=s(p,[["render",t]]);export{d as __pageData,C as default};
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const d=JSON.parse('{"title":"vite.config.ts 基础配置","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/base.md","filePath":"guide/vue3/base.md","lastUpdated":1731315864000}'),p={name:"guide/vue3/base.md"},o=l("",6),e=[o];function t(c,r,F,y,D,i){return a(),n("div",null,e)}const C=s(p,[["render",t]]);export{d as __pageData,C as default};

2
assets/guide_vue3_env.md.83cf2a7e.js → assets/guide_vue3_env.md.b928542e.js
View File

@ -1,4 +1,4 @@
import{_ as s,o,c as e,R as a}from"./chunks/framework.6241eaf2.js";const u=JSON.parse('{"title":"","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/env.md","filePath":"guide/vue3/env.md","lastUpdated":1687776555000}'),n={name:"guide/vue3/env.md"},p=a(`<p><code>package.json</code> 里的 <code>scripts</code> 配置 <code>dev</code> <code>dev:test</code> <code>dev:prod</code> ，通过 <code>--mode xxx</code> 来执行不同环境</p><ul><li>通过 <code>yarn dev</code> 启动本地环境参数 , 执行 <code>development</code></li><li>通过 <code>yarn dev:test</code> 启动测试环境参数 , 执行 <code>test</code></li><li>通过 <code>yarn dev:prod</code> 启动正式环境参数 , 执行 <code>prod</code></li></ul><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">scripts</span><span style="color:#89DDFF;">&quot;</span><span style="color:#A6ACCD;">: </span><span style="color:#89DDFF;">{</span></span>
import{_ as s,o,c as e,R as a}from"./chunks/framework.6241eaf2.js";const u=JSON.parse('{"title":"","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/env.md","filePath":"guide/vue3/env.md","lastUpdated":1731315864000}'),n={name:"guide/vue3/env.md"},p=a(`<p><code>package.json</code> 里的 <code>scripts</code> 配置 <code>dev</code> <code>dev:test</code> <code>dev:prod</code> ，通过 <code>--mode xxx</code> 来执行不同环境</p><ul><li>通过 <code>yarn dev</code> 启动本地环境参数 , 执行 <code>development</code></li><li>通过 <code>yarn dev:test</code> 启动测试环境参数 , 执行 <code>test</code></li><li>通过 <code>yarn dev:prod</code> 启动正式环境参数 , 执行 <code>prod</code></li></ul><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">scripts</span><span style="color:#89DDFF;">&quot;</span><span style="color:#A6ACCD;">: </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#F07178;">dev</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">vite</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#F07178;">dev:test</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">vite --mode test</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#F07178;">dev:prod</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">vite --mode production</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">,</span></span>

2
assets/guide_vue3_env.md.83cf2a7e.lean.js → assets/guide_vue3_env.md.b928542e.lean.js
View File

@ -1 +1 @@
import{_ as s,o,c as e,R as a}from"./chunks/framework.6241eaf2.js";const u=JSON.parse('{"title":"","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/env.md","filePath":"guide/vue3/env.md","lastUpdated":1687776555000}'),n={name:"guide/vue3/env.md"},p=a("",3),t=[p];function l(c,r,d,D,F,i){return o(),e("div",null,t)}const _=s(n,[["render",l]]);export{u as __pageData,_ as default};
import{_ as s,o,c as e,R as a}from"./chunks/framework.6241eaf2.js";const u=JSON.parse('{"title":"","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/env.md","filePath":"guide/vue3/env.md","lastUpdated":1731315864000}'),n={name:"guide/vue3/env.md"},p=a("",3),t=[p];function l(c,r,d,D,F,i){return o(),e("div",null,t)}const _=s(n,[["render",l]]);export{u as __pageData,_ as default};

4
assets/guide_vue3_i18n.md.0436062d.js → assets/guide_vue3_i18n.md.51f27eff.js
View File

@ -1,4 +1,4 @@
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"i18n 文本多语言解决方案","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/i18n.md","filePath":"guide/vue3/i18n.md","lastUpdated":1687776555000}'),p={name:"guide/vue3/i18n.md"},o=l(`<h1 id="i18n-文本多语言解决方案" tabindex="-1">i18n 文本多语言解决方案 <a class="header-anchor" href="#i18n-文本多语言解决方案" aria-label="Permalink to &quot;i18n 文本多语言解决方案&quot;">​</a></h1><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">createI18n</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">}</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">vue-i18n</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">;</span><span style="color:#A6ACCD;"> </span><span style="color:#676E95;font-style:italic;">// 引入第三方最新的i18n注意版本</span></span>
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"i18n 文本多语言解决方案","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/i18n.md","filePath":"guide/vue3/i18n.md","lastUpdated":1731315864000}'),p={name:"guide/vue3/i18n.md"},o=l(`<h1 id="i18n-文本多语言解决方案" tabindex="-1">i18n 文本多语言解决方案 <a class="header-anchor" href="#i18n-文本多语言解决方案" aria-label="Permalink to &quot;i18n 文本多语言解决方案&quot;">​</a></h1><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">createI18n</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">}</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">vue-i18n</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">;</span><span style="color:#A6ACCD;"> </span><span style="color:#676E95;font-style:italic;">// 引入第三方最新的i18n注意版本</span></span>
<span class="line"></span>
<span class="line"><span style="color:#676E95;font-style:italic;">/**</span></span>
<span class="line"><span style="color:#676E95;font-style:italic;"> * </span><span style="color:#89DDFF;font-style:italic;">@</span><span style="color:#C792EA;font-style:italic;">description</span><span style="color:#676E95;font-style:italic;">: 加载当前配置的语言配置目录，随意添加</span></span>
@ -30,7 +30,7 @@ import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const A=
<span class="line"><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">localStorage</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">setItem</span><span style="color:#F07178;">(</span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">lang</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">locale</span><span style="color:#F07178;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">}</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">i18n</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">global</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">locale</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">=</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">locale</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">||</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">localStorage</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">getItem</span><span style="color:#F07178;">(</span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">lang</span><span style="color:#89DDFF;">&#39;</span><span style="color:#F07178;">) </span><span style="color:#89DDFF;">||</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">&#39;&#39;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;">}</span></span></code></pre></div><h1 id="css图片解决方案" tabindex="-1">css图片解决方案 <a class="header-anchor" href="#css图片解决方案" aria-label="Permalink to &quot;css图片解决方案&quot;">​</a></h1><p>目前在业务开发中,css的样式多语言也会经常用到，可能一些图片的字体比较复杂，代码很难实现。或者我们为了减少多语言的配置，加快开发效率也会使用多语言的配置,目前这里提供scss的图片多语言的方案</p><div class="language-css"><button title="Copy Code" class="copy"></button><span class="lang">css</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;font-style:italic;">@mixin</span><span style="color:#A6ACCD;"> main-lang-bg($width, $height, $preUrl, $posUrl) </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#89DDFF;">}</span></span></code></pre></div><h1 id="css图片解决方案" tabindex="-1">css图片解决方案 <a class="header-anchor" href="#css图片解决方案" aria-label="Permalink to &quot;css图片解决方案&quot;">​</a></h1><p>目前在业务开发中，CSS 的样式多语言也会经常用到，可能一些图片的字体比较复杂，代码很难实现。或者我们为了减少多语言的配置，加快开发效率也会使用多语言的配置，目前这里提供 scss 的图片多语言的方案</p><div class="language-css"><button title="Copy Code" class="copy"></button><span class="lang">css</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;font-style:italic;">@mixin</span><span style="color:#A6ACCD;"> main-lang-bg($width, $height, $preUrl, $posUrl) </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#A6ACCD;"> width: $width;</span></span>
<span class="line"><span style="color:#A6ACCD;"> height: $height;</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#FFCB6B;">background-repeat</span><span style="color:#A6ACCD;">: </span><span style="color:#FFCB6B;">no-repeat</span><span style="color:#A6ACCD;">;</span></span>

2
assets/guide_vue3_i18n.md.0436062d.lean.js → assets/guide_vue3_i18n.md.51f27eff.lean.js
View File

@ -1 +1 @@
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"i18n 文本多语言解决方案","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/i18n.md","filePath":"guide/vue3/i18n.md","lastUpdated":1687776555000}'),p={name:"guide/vue3/i18n.md"},o=l("",9),t=[o];function e(c,r,y,F,D,C){return n(),a("div",null,t)}const g=s(p,[["render",e]]);export{A as __pageData,g as default};
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"i18n 文本多语言解决方案","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/i18n.md","filePath":"guide/vue3/i18n.md","lastUpdated":1731315864000}'),p={name:"guide/vue3/i18n.md"},o=l("",9),t=[o];function e(c,r,y,F,D,C){return n(),a("div",null,t)}const g=s(p,[["render",e]]);export{A as __pageData,g as default};

1
assets/guide_vue3_lint.md.18663aed.js Normal file
View File

@ -0,0 +1 @@
import{_ as i,o as l,c as n,z as e,a as t}from"./chunks/framework.6241eaf2.js";const g=JSON.parse('{"title":"Eslint + Pettier + Stylelint 统一开发规范","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/lint.md","filePath":"guide/vue3/lint.md","lastUpdated":1731315864000}'),s={name:"guide/vue3/lint.md"},a=e("h1",{id:"eslint-pettier-stylelint-统一开发规范",tabindex:"-1"},[t("Eslint + Pettier + Stylelint 统一开发规范 "),e("a",{class:"header-anchor",href:"#eslint-pettier-stylelint-统一开发规范","aria-label":'Permalink to "Eslint + Pettier + Stylelint 统一开发规范"'},"​")],-1),r=e("p",null,[t("根目录下的 "),e("code",null,".eslintrc.js"),t("、"),e("code",null,".stylelint.config.js"),t("、"),e("code",null,".prettier.config.js"),t(" 内置了 lint 规则，帮助你规范地开发代码，有助于提高团队的代码质量和协作性，可以根据团队的规则进行修改")],-1),o=[a,r];function c(d,_,p,u,f,h){return l(),n("div",null,o)}const y=i(s,[["render",c]]);export{g as __pageData,y as default};

1
assets/guide_vue3_lint.md.18663aed.lean.js Normal file
View File

@ -0,0 +1 @@
import{_ as i,o as l,c as n,z as e,a as t}from"./chunks/framework.6241eaf2.js";const g=JSON.parse('{"title":"Eslint + Pettier + Stylelint 统一开发规范","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/lint.md","filePath":"guide/vue3/lint.md","lastUpdated":1731315864000}'),s={name:"guide/vue3/lint.md"},a=e("h1",{id:"eslint-pettier-stylelint-统一开发规范",tabindex:"-1"},[t("Eslint + Pettier + Stylelint 统一开发规范 "),e("a",{class:"header-anchor",href:"#eslint-pettier-stylelint-统一开发规范","aria-label":'Permalink to "Eslint + Pettier + Stylelint 统一开发规范"'},"​")],-1),r=e("p",null,[t("根目录下的 "),e("code",null,".eslintrc.js"),t("、"),e("code",null,".stylelint.config.js"),t("、"),e("code",null,".prettier.config.js"),t(" 内置了 lint 规则，帮助你规范地开发代码，有助于提高团队的代码质量和协作性，可以根据团队的规则进行修改")],-1),o=[a,r];function c(d,_,p,u,f,h){return l(),n("div",null,o)}const y=i(s,[["render",c]]);export{g as __pageData,y as default};

1
assets/guide_vue3_lint.md.b9504b63.js
View File

@ -1 +0,0 @@
import{_ as e,o as i,c as s,z as t,a as n}from"./chunks/framework.6241eaf2.js";const g=JSON.parse('{"title":"Eslint+Pettier+stylelint 统一开发规范","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/lint.md","filePath":"guide/vue3/lint.md","lastUpdated":1687776555000}'),l={name:"guide/vue3/lint.md"},a=t("h1",{id:"eslint-pettier-stylelint-统一开发规范",tabindex:"-1"},[n("Eslint+Pettier+stylelint 统一开发规范 "),t("a",{class:"header-anchor",href:"#eslint-pettier-stylelint-统一开发规范","aria-label":'Permalink to "Eslint+Pettier+stylelint 统一开发规范"'},"​")],-1),r=t("p",null,"根目录下的.eslintrc.js、.stylelint.config.js、.prettier.config.js 内置了 lint 规则，帮助你规范地开发代码，有助于提高团队的代码质量和协作性，可以根据团队的规则进行修改",-1),o=[a,r];function c(d,_,p,u,f,h){return i(),s("div",null,o)}const y=e(l,[["render",c]]);export{g as __pageData,y as default};

1
assets/guide_vue3_lint.md.b9504b63.lean.js
View File

@ -1 +0,0 @@
import{_ as e,o as i,c as s,z as t,a as n}from"./chunks/framework.6241eaf2.js";const g=JSON.parse('{"title":"Eslint+Pettier+stylelint 统一开发规范","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/lint.md","filePath":"guide/vue3/lint.md","lastUpdated":1687776555000}'),l={name:"guide/vue3/lint.md"},a=t("h1",{id:"eslint-pettier-stylelint-统一开发规范",tabindex:"-1"},[n("Eslint+Pettier+stylelint 统一开发规范 "),t("a",{class:"header-anchor",href:"#eslint-pettier-stylelint-统一开发规范","aria-label":'Permalink to "Eslint+Pettier+stylelint 统一开发规范"'},"​")],-1),r=t("p",null,"根目录下的.eslintrc.js、.stylelint.config.js、.prettier.config.js 内置了 lint 规则，帮助你规范地开发代码，有助于提高团队的代码质量和协作性，可以根据团队的规则进行修改",-1),o=[a,r];function c(d,_,p,u,f,h){return i(),s("div",null,o)}const y=e(l,[["render",c]]);export{g as __pageData,y as default};

4
assets/guide_vue3_pinia.md.4c51a07c.js → assets/guide_vue3_pinia.md.0d738d45.js
View File

@ -1,7 +1,7 @@
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"Pinia 状态管理","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/pinia.md","filePath":"guide/vue3/pinia.md","lastUpdated":1687776555000}'),p={name:"guide/vue3/pinia.md"},o=l(`<h1 id="pinia-状态管理" tabindex="-1">Pinia 状态管理 <a class="header-anchor" href="#pinia-状态管理" aria-label="Permalink to &quot;Pinia 状态管理&quot;">​</a></h1><p>下一代 vuex，使用极其方便，ts 兼容好</p><p>目录结构</p><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">├──</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">store</span></span>
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"Pinia 状态管理","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/pinia.md","filePath":"guide/vue3/pinia.md","lastUpdated":1731315864000}'),p={name:"guide/vue3/pinia.md"},o=l(`<h1 id="pinia-状态管理" tabindex="-1">Pinia 状态管理 <a class="header-anchor" href="#pinia-状态管理" aria-label="Permalink to &quot;Pinia 状态管理&quot;">​</a></h1><p>下一代 vuex，使用极其方便，ts 兼容好</p><p>目录结构</p><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">├──</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">store</span></span>
<span class="line"><span style="color:#FFCB6B;">│</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">├──</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">modules</span></span>
<span class="line"><span style="color:#FFCB6B;">│</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">│</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">└──</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">user.js</span></span>
<span class="line"><span style="color:#FFCB6B;">│</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">├──</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">index.js</span></span></code></pre></div><p>目前pinia分为两种编程模式,options API和 Composition API，我们这边都会列举出来实现的业务逻辑效果是一样的，提供大家思路</p><h3 id="options-api" tabindex="-1">options API: <a class="header-anchor" href="#options-api" aria-label="Permalink to &quot;options API:&quot;">​</a></h3><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#C792EA;">interface</span><span style="color:#A6ACCD;"> </span><span style="color:#FFCB6B;">StoreUser</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#FFCB6B;">│</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">├──</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">index.js</span></span></code></pre></div><p>目前pinia分为两种编程模式，Options API 和 Composition API，我们这边都会列举出来实现的业务逻辑效果是一样的，提供大家思路</p><h3 id="options-api" tabindex="-1">Options API: <a class="header-anchor" href="#options-api" aria-label="Permalink to &quot;Options API:&quot;">​</a></h3><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#C792EA;">interface</span><span style="color:#A6ACCD;"> </span><span style="color:#FFCB6B;">StoreUser</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#F07178;">token</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#FFCB6B;">string</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#F07178;">info</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#FFCB6B;">Record</span><span style="color:#89DDFF;">&lt;</span><span style="color:#FFCB6B;">any</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#FFCB6B;">any</span><span style="color:#89DDFF;">&gt;;</span></span>
<span class="line"><span style="color:#89DDFF;">}</span></span>

2
assets/guide_vue3_pinia.md.4c51a07c.lean.js → assets/guide_vue3_pinia.md.0d738d45.lean.js
View File

@ -1 +1 @@
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"Pinia 状态管理","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/pinia.md","filePath":"guide/vue3/pinia.md","lastUpdated":1687776555000}'),p={name:"guide/vue3/pinia.md"},o=l("",11),e=[o];function t(c,r,F,y,D,C){return n(),a("div",null,e)}const d=s(p,[["render",t]]);export{i as __pageData,d as default};
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"Pinia 状态管理","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/pinia.md","filePath":"guide/vue3/pinia.md","lastUpdated":1731315864000}'),p={name:"guide/vue3/pinia.md"},o=l("",11),e=[o];function t(c,r,F,y,D,C){return n(),a("div",null,e)}const d=s(p,[["render",t]]);export{i as __pageData,d as default};

2
assets/guide_vue3_proxy.md.b05cbab3.js → assets/guide_vue3_proxy.md.94d7124b.js
View File

@ -1,4 +1,4 @@
import{_ as s,o as a,c as n,R as p}from"./chunks/framework.6241eaf2.js";const _=JSON.parse('{"title":"proxy 跨域","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/proxy.md","filePath":"guide/vue3/proxy.md","lastUpdated":1687776555000}'),l={name:"guide/vue3/proxy.md"},o=p(`<h1 id="proxy-跨域" tabindex="-1">proxy 跨域 <a class="header-anchor" href="#proxy-跨域" aria-label="Permalink to &quot;proxy 跨域&quot;">​</a></h1><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">server</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
import{_ as s,o as a,c as n,R as p}from"./chunks/framework.6241eaf2.js";const _=JSON.parse('{"title":"proxy 跨域","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/proxy.md","filePath":"guide/vue3/proxy.md","lastUpdated":1731315864000}'),l={name:"guide/vue3/proxy.md"},o=p(`<h1 id="proxy-跨域" tabindex="-1">proxy 跨域 <a class="header-anchor" href="#proxy-跨域" aria-label="Permalink to &quot;proxy 跨域&quot;">​</a></h1><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">server</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#FFCB6B;">proxy</span><span style="color:#89DDFF;">:</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">/api</span><span style="color:#89DDFF;">&#39;</span><span style="color:#F07178;">: </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> target</span><span style="color:#89DDFF;">:</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">https://baidu.com</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span>

2
assets/guide_vue3_proxy.md.b05cbab3.lean.js → assets/guide_vue3_proxy.md.94d7124b.lean.js
View File

@ -1 +1 @@
import{_ as s,o as a,c as n,R as p}from"./chunks/framework.6241eaf2.js";const _=JSON.parse('{"title":"proxy 跨域","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/proxy.md","filePath":"guide/vue3/proxy.md","lastUpdated":1687776555000}'),l={name:"guide/vue3/proxy.md"},o=p("",2),e=[o];function t(r,c,F,y,D,i){return a(),n("div",null,e)}const C=s(l,[["render",t]]);export{_ as __pageData,C as default};
import{_ as s,o as a,c as n,R as p}from"./chunks/framework.6241eaf2.js";const _=JSON.parse('{"title":"proxy 跨域","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/proxy.md","filePath":"guide/vue3/proxy.md","lastUpdated":1731315864000}'),l={name:"guide/vue3/proxy.md"},o=p("",2),e=[o];function t(r,c,F,y,D,i){return a(),n("div",null,e)}const C=s(l,[["render",t]]);export{_ as __pageData,C as default};

2
assets/guide_vue3_router.md.bf1ddfb2.js → assets/guide_vue3_router.md.84936a90.js
View File

@ -1,4 +1,4 @@
import{_ as s,o as a,c as n,R as o}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"vue-router","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/router.md","filePath":"guide/vue3/router.md","lastUpdated":1687776555000}'),l={name:"guide/vue3/router.md"},p=o(`<h1 id="vue-router" tabindex="-1">vue-router <a class="header-anchor" href="#vue-router" aria-label="Permalink to &quot;vue-router&quot;">​</a></h1><p>本案例采用 <code>hash</code> 模式，开发者根据需求修改 <code>mode</code> <code>base</code></p><p><strong>注意</strong>：如果你使用了 <code>history</code> 模式， <code>vue.config.js</code> 中的 <code>publicPath</code> 要做对应的<strong>修改</strong></p><p>前往:<a href="#base">vue.config.js 基础配置</a></p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> Vue </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">vue</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
import{_ as s,o as a,c as n,R as o}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"vue-router","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/router.md","filePath":"guide/vue3/router.md","lastUpdated":1731315864000}'),l={name:"guide/vue3/router.md"},p=o(`<h1 id="vue-router" tabindex="-1">vue-router <a class="header-anchor" href="#vue-router" aria-label="Permalink to &quot;vue-router&quot;">​</a></h1><p>本案例采用 <code>hash</code> 模式，开发者根据需求修改 <code>mode</code> <code>base</code></p><p><strong>注意</strong>：如果你使用了 <code>history</code> 模式， <code>vue.config.js</code> 中的 <code>publicPath</code> 要做对应的<strong>修改</strong></p><p>前往: <a href="#base">vite.config.js 基础配置</a></p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> Vue </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">vue</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">createRouter</span><span style="color:#89DDFF;">,</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">createWebHistory</span><span style="color:#89DDFF;">,</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">Router</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">}</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">vue-router</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"></span>
<span class="line"><span style="color:#A6ACCD;">Vue</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">use</span><span style="color:#A6ACCD;">(Router)</span><span style="color:#89DDFF;">;</span></span>

2
assets/guide_vue3_router.md.bf1ddfb2.lean.js → assets/guide_vue3_router.md.84936a90.lean.js
View File

@ -1 +1 @@
import{_ as s,o as a,c as n,R as o}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"vue-router","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/router.md","filePath":"guide/vue3/router.md","lastUpdated":1687776555000}'),l={name:"guide/vue3/router.md"},p=o("",5),e=[p];function t(r,c,D,y,F,A){return a(),n("div",null,e)}const u=s(l,[["render",t]]);export{i as __pageData,u as default};
import{_ as s,o as a,c as n,R as o}from"./chunks/framework.6241eaf2.js";const i=JSON.parse('{"title":"vue-router","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/router.md","filePath":"guide/vue3/router.md","lastUpdated":1731315864000}'),l={name:"guide/vue3/router.md"},p=o("",5),e=[p];function t(r,c,D,y,F,A){return a(),n("div",null,e)}const u=s(l,[["render",t]]);export{i as __pageData,u as default};

8
assets/guide_vue3_start.md.6f88b41c.js Normal file
View File

@ -0,0 +1,8 @@
import{_ as s,o as a,c as n,R as e}from"./chunks/framework.6241eaf2.js";const u=JSON.parse('{"title":"启动项目","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/start.md","filePath":"guide/vue3/start.md","lastUpdated":1731315864000}'),t={name:"guide/vue3/start.md"},l=e(`<h1 id="启动项目" tabindex="-1">启动项目 <a class="header-anchor" href="#启动项目" aria-label="Permalink to &quot;启动项目&quot;">​</a></h1><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;"># 拉取项目</span></span>
<span class="line"><span style="color:#FFCB6B;">git</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">clone</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">https://github.com/sunniejs/vue-h5-template</span></span>
<span class="line"></span>
<span class="line"><span style="color:#676E95;font-style:italic;"># 安装依赖</span></span>
<span class="line"><span style="color:#FFCB6B;">yarn</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">install</span></span>
<span class="line"></span>
<span class="line"><span style="color:#676E95;font-style:italic;"># 启动项目</span></span>
<span class="line"><span style="color:#FFCB6B;">yarn</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">dev</span></span></code></pre></div>`,2),o=[l];function p(c,r,i,d,_,y){return a(),n("div",null,o)}const C=s(t,[["render",p]]);export{u as __pageData,C as default};

1
assets/guide_vue3_start.md.6f88b41c.lean.js Normal file
View File

@ -0,0 +1 @@
import{_ as s,o as a,c as n,R as e}from"./chunks/framework.6241eaf2.js";const u=JSON.parse('{"title":"启动项目","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/start.md","filePath":"guide/vue3/start.md","lastUpdated":1731315864000}'),t={name:"guide/vue3/start.md"},l=e("",2),o=[l];function p(c,r,i,d,_,y){return a(),n("div",null,o)}const C=s(t,[["render",p]]);export{u as __pageData,C as default};

8
assets/guide_vue3_start.md.f354f662.js
View File

@ -1,8 +0,0 @@
import{_ as s,o as a,c as n,R as t}from"./chunks/framework.6241eaf2.js";const y=JSON.parse('{"title":"启动项目","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/start.md","filePath":"guide/vue3/start.md","lastUpdated":1687776555000}'),e={name:"guide/vue3/start.md"},l=t(`<h1 id="启动项目" tabindex="-1">启动项目 <a class="header-anchor" href="#启动项目" aria-label="Permalink to &quot;启动项目&quot;">​</a></h1><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// 拉取项目</span></span>
<span class="line"><span style="color:#A6ACCD;">git clone </span><span style="color:#FFCB6B;">https</span><span style="color:#89DDFF;">:</span><span style="color:#676E95;font-style:italic;">//github.com/sunniejs/vue-h5-template</span></span>
<span class="line"></span>
<span class="line"><span style="color:#676E95;font-style:italic;">// 安装依赖</span></span>
<span class="line"><span style="color:#A6ACCD;">yarn install</span></span>
<span class="line"></span>
<span class="line"><span style="color:#676E95;font-style:italic;">// 启动项目</span></span>
<span class="line"><span style="color:#A6ACCD;">yarn dev</span></span></code></pre></div>`,2),o=[l];function p(c,i,r,d,_,u){return a(),n("div",null,o)}const m=s(e,[["render",p]]);export{y as __pageData,m as default};

1
assets/guide_vue3_start.md.f354f662.lean.js
View File

@ -1 +0,0 @@
import{_ as s,o as a,c as n,R as t}from"./chunks/framework.6241eaf2.js";const y=JSON.parse('{"title":"启动项目","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/start.md","filePath":"guide/vue3/start.md","lastUpdated":1687776555000}'),e={name:"guide/vue3/start.md"},l=t("",2),o=[l];function p(c,i,r,d,_,u){return a(),n("div",null,o)}const m=s(e,[["render",p]]);export{y as __pageData,m as default};

2
assets/guide_vue3_ui.md.cc6ae98b.js → assets/guide_vue3_ui.md.385fc808.js
View File

@ -1,4 +1,4 @@
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"多 UI 组件库供选择","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/ui.md","filePath":"guide/vue3/ui.md","lastUpdated":1687776555000}'),o={name:"guide/vue3/ui.md"},p=l(`<h1 id="多-ui-组件库供选择" tabindex="-1">多 UI 组件库供选择 <a class="header-anchor" href="#多-ui-组件库供选择" aria-label="Permalink to &quot;多 UI 组件库供选择&quot;">​</a></h1><p>Vite 构建工具，使用 vite-plugin-style-import 和 unplugin-vue-components/vite 实现按需引入。</p><h2 id="安装插件" tabindex="-1">安装插件 <a class="header-anchor" href="#安装插件" aria-label="Permalink to &quot;安装插件&quot;">​</a></h2><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">yarn</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">add</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">vite-plugin-style-import</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">-D</span></span>
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"多 UI 组件库供选择","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/ui.md","filePath":"guide/vue3/ui.md","lastUpdated":1731315864000}'),o={name:"guide/vue3/ui.md"},p=l(`<h1 id="多-ui-组件库供选择" tabindex="-1">多 UI 组件库供选择 <a class="header-anchor" href="#多-ui-组件库供选择" aria-label="Permalink to &quot;多 UI 组件库供选择&quot;">​</a></h1><p>Vite 构建工具，<code>使用 vite-plugin-style-import</code> 和 <code>unplugin-vue-components/vite</code> 实现按需引入。</p><h2 id="安装插件" tabindex="-1">安装插件 <a class="header-anchor" href="#安装插件" aria-label="Permalink to &quot;安装插件&quot;">​</a></h2><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">yarn</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">add</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">vite-plugin-style-import</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">-D</span></span>
<span class="line"><span style="color:#FFCB6B;">yarn</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">add</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">unplugin-vue-components/vite</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">-D</span></span></code></pre></div><h2 id="使用组件库" tabindex="-1">使用组件库 <a class="header-anchor" href="#使用组件库" aria-label="Permalink to &quot;使用组件库&quot;">​</a></h2><p>nutUI 没有按需加载的 resolvers，style 需要自己配置按需加载</p><p>在 <code>config/vite/plugins/styleImport.ts</code> 设置</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// 按需加载样式文件</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">...</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#82AAFF;">createStyleImportPlugin</span><span style="color:#A6ACCD;">(</span><span style="color:#89DDFF;">{</span></span>

2
assets/guide_vue3_ui.md.cc6ae98b.lean.js → assets/guide_vue3_ui.md.385fc808.lean.js
View File

@ -1 +1 @@
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"多 UI 组件库供选择","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/ui.md","filePath":"guide/vue3/ui.md","lastUpdated":1687776555000}'),o={name:"guide/vue3/ui.md"},p=l("",19),e=[p];function t(r,c,i,y,D,C){return a(),n("div",null,e)}const u=s(o,[["render",t]]);export{A as __pageData,u as default};
import{_ as s,o as a,c as n,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"多 UI 组件库供选择","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/ui.md","filePath":"guide/vue3/ui.md","lastUpdated":1731315864000}'),o={name:"guide/vue3/ui.md"},p=l("",19),e=[p];function t(r,c,i,y,D,C){return a(),n("div",null,e)}const u=s(o,[["render",t]]);export{A as __pageData,u as default};

4
assets/guide_vue3_viewport.md.ad1a10ef.js → assets/guide_vue3_viewport.md.0ef62fba.js
View File

@ -1,4 +1,4 @@
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"viewport 适配方案","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/viewport.md","filePath":"guide/vue3/viewport.md","lastUpdated":1687776555000}'),p={name:"guide/vue3/viewport.md"},o=l(`<h1 id="viewport-适配方案" tabindex="-1">viewport 适配方案 <a class="header-anchor" href="#viewport-适配方案" aria-label="Permalink to &quot;viewport 适配方案&quot;">​</a></h1><p>不用担心，项目已经配置好了 <code>viewport</code> 适配，下面仅做介绍：</p><ul><li><a href="https://github.com/cnjm/postcss-px-to-viewport" target="_blank" rel="noreferrer">cnjm-postcss-px-to-viewport</a> 是一款 <code>postcss</code> 插件，用于将单位转化为 <code>vw</code>， 现在很多浏览器对<code>vw</code>的支持都很好，适配首选方案。</li></ul><h2 id="postcss-配置" tabindex="-1">PostCSS 配置 <a class="header-anchor" href="#postcss-配置" aria-label="Permalink to &quot;PostCSS 配置&quot;">​</a></h2><p>下面提供了一份基本的 <code>postcss</code> 配置，可以在此配置的基础上根据项目需求进行修改</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// https://github.com/michael-ciniawsky/postcss-load-config</span></span>
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"viewport 适配方案","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/viewport.md","filePath":"guide/vue3/viewport.md","lastUpdated":1731315864000}'),p={name:"guide/vue3/viewport.md"},o=l(`<h1 id="viewport-适配方案" tabindex="-1">viewport 适配方案 <a class="header-anchor" href="#viewport-适配方案" aria-label="Permalink to &quot;viewport 适配方案&quot;">​</a></h1><p>不用担心，项目已经配置好了 <code>viewport</code> 适配，下面仅做介绍：</p><ul><li><a href="https://github.com/cnjm/postcss-px-to-viewport" target="_blank" rel="noreferrer">cnjm-postcss-px-to-viewport</a> 是一款 <code>postcss</code> 插件，用于将单位转化为 <code>vw</code>， 现在很多浏览器对<code>vw</code>的支持都很好，适配首选方案。</li></ul><h2 id="postcss-配置" tabindex="-1">PostCSS 配置 <a class="header-anchor" href="#postcss-配置" aria-label="Permalink to &quot;PostCSS 配置&quot;">​</a></h2><p>下面提供了一份基本的 <code>postcss</code> 配置，可以在此配置的基础上根据项目需求进行修改</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// https://github.com/michael-ciniawsky/postcss-load-config</span></span>
<span class="line"><span style="color:#89DDFF;">module.exports</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#F07178;">plugins</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#F07178;">autoprefixer</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span><span style="color:#A6ACCD;"> </span><span style="color:#F07178;">overrideBrowserslist</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> [</span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">Android 4.1</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">iOS 7.1</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">Chrome &gt; 31</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">ff &gt; 31</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">ie &gt;= 8</span><span style="color:#89DDFF;">&#39;</span><span style="color:#A6ACCD;">] </span><span style="color:#89DDFF;">},</span></span>
@ -20,7 +20,7 @@ import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const A=
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;font-style:italic;">return</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">designWidth</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#89DDFF;">}</span><span style="color:#A6ACCD;">;</span></span></code></pre></div><p><strong>新手必看，老鸟跳过</strong></p><p>很多小伙伴会问我，适配的问题, 因为我们使用的是 Vant UI，所以必须根据 Vant UI 375 的设计规范走，一般我们的设计会将 UI 图上传到蓝湖，我们就可以需要的尺寸了。下面就大概普及一下 rem。</p><p>我们知道 <code>1rem</code> 等于 <code>html</code> 根元素设定的 <code>font-size</code> 的 <code>px</code> 值。Vant UI 设置 <code>rootValue: 37.5</code> , 你可以看到在 iPhone 6 下看到 （ <code>1rem 等于 37.5px</code> ）：</p><div class="language-html"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;">&lt;</span><span style="color:#F07178;">html</span><span style="color:#89DDFF;"> </span><span style="color:#C792EA;">data-dpr</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">1</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;"> </span><span style="color:#C792EA;">style</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">font-size: 37.5px;</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">&gt;&lt;/</span><span style="color:#F07178;">html</span><span style="color:#89DDFF;">&gt;</span></span></code></pre></div><p>切换不同的机型，根元素可能会有不同的 <code>font-size</code> 。当你写 css px 样式时，会被程序换算成 <code>rem</code> 达到适配。</p><p>因为我们用了 Vant 的组件，需要按照 <code>rootValue: 37.5</code> 来写样式。</p><p>举个例子：设计给了你一张 750px * 1334px 图片，在 iPhone6 上铺满屏幕, 其他机型适配。</p><ul><li>当<code>rootValue: 75</code> , 样式 <code>width: 750px;height: 1334px;</code> 图片会撑满 iPhone6 屏幕，这个时候切换其他机型，图片也会跟着撑满。</li><li>当<code>rootValue: 37.5</code> 的时候，样式 <code>width: 375px;height: 667px;</code> 图片会撑满 iPhone6 屏幕。</li></ul><p>也就是 iphone 6 下 375px 宽度写 CSS。其他的你就可以根据你设计图，去写对应的样式就可以了。</p><p>当然，想要撑满屏幕你可以使用 100%，这里只是举例说明。</p><div class="language-html"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;">&lt;</span><span style="color:#F07178;">img</span><span style="color:#89DDFF;"> </span><span style="color:#C792EA;">class</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">image</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;"> </span><span style="color:#C792EA;">src</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">https://www.sunniejs.cn/static/weapp/logo.png</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;"> /&gt;</span></span>
<span class="line"><span style="color:#89DDFF;">}</span><span style="color:#A6ACCD;">;</span></span></code></pre></div><p><strong>新手必看，老鸟跳过</strong></p><p>很多小伙伴会问我，适配的问题, 因为我们使用的是 Vant UI，所以必须根据 Vant UI 375 的设计规范走，一般我们的设计会将 UI 图上传到蓝湖，我们就可以得到需要的尺寸了。下面就简单普及一下 rem 适配的原理。</p><p>我们知道 <code>1rem</code> 等于 <code>html</code> 根元素设定的 <code>font-size</code> 的 <code>px</code> 值。Vant UI 设置 <code>rootValue: 37.5</code> , 你可以看到在 iPhone 6 下看到 （ <code>1rem 等于 37.5px</code> ）：</p><div class="language-html"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;">&lt;</span><span style="color:#F07178;">html</span><span style="color:#89DDFF;"> </span><span style="color:#C792EA;">data-dpr</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">1</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;"> </span><span style="color:#C792EA;">style</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">font-size: 37.5px;</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">&gt;&lt;/</span><span style="color:#F07178;">html</span><span style="color:#89DDFF;">&gt;</span></span></code></pre></div><p>切换不同的机型，根元素可能会有不同的 <code>font-size</code> 。当你写 css px 样式时，会被程序换算成 <code>rem</code> 达到适配。</p><p>因为我们用了 Vant 的组件，需要按照 <code>rootValue: 37.5</code> 来写样式。</p><p>举个例子：设计给了你一张 750px * 1334px 图片，在 iPhone6 上铺满屏幕, 其他机型适配。</p><ul><li>当<code>rootValue: 75</code> , 样式 <code>width: 750px;height: 1334px;</code> 图片会撑满 iPhone6 屏幕，这个时候切换其他机型，图片也会跟着撑满。</li><li>当<code>rootValue: 37.5</code> 的时候，样式 <code>width: 375px;height: 667px;</code> 图片会撑满 iPhone6 屏幕。</li></ul><p>也就是 iphone 6 下 375px 宽度写 CSS。其他的你就可以根据你设计图，去写对应的样式就可以了。</p><p>当然，想要撑满屏幕你可以使用 100%，这里只是举例说明。</p><div class="language-html"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;">&lt;</span><span style="color:#F07178;">img</span><span style="color:#89DDFF;"> </span><span style="color:#C792EA;">class</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">image</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;"> </span><span style="color:#C792EA;">src</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">https://www.sunniejs.cn/static/weapp/logo.png</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;"> /&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color:#89DDFF;">&lt;</span><span style="color:#F07178;">style</span><span style="color:#89DDFF;">&gt;</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#676E95;font-style:italic;">/* rootValue: 75 */</span></span>

2
assets/guide_vue3_viewport.md.ad1a10ef.lean.js → assets/guide_vue3_viewport.md.0ef62fba.lean.js
View File

@ -1 +1 @@
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"viewport 适配方案","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/viewport.md","filePath":"guide/vue3/viewport.md","lastUpdated":1687776555000}'),p={name:"guide/vue3/viewport.md"},o=l("",17),e=[o];function t(c,r,D,y,F,C){return n(),a("div",null,e)}const d=s(p,[["render",t]]);export{A as __pageData,d as default};
import{_ as s,o as n,c as a,R as l}from"./chunks/framework.6241eaf2.js";const A=JSON.parse('{"title":"viewport 适配方案","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/viewport.md","filePath":"guide/vue3/viewport.md","lastUpdated":1731315864000}'),p={name:"guide/vue3/viewport.md"},o=l("",17),e=[o];function t(c,r,D,y,F,C){return n(),a("div",null,e)}const d=s(p,[["render",t]]);export{A as __pageData,d as default};

2
assets/guide_vue3_vite.md.9ec8c052.js → assets/guide_vue3_vite.md.7a4b4162.js
View File

@ -1 +1 @@
import{_ as e,o as i,c as t,R as l}from"./chunks/framework.6241eaf2.js";const g=JSON.parse('{"title":"vite","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/vite.md","filePath":"guide/vue3/vite.md","lastUpdated":1687776555000}'),a={name:"guide/vue3/vite.md"},n=l('<h1 id="vite" tabindex="-1">vite <a class="header-anchor" href="#vite" aria-label="Permalink to &quot;vite&quot;">​</a></h1><p>基于原生 ES 模块提供了丰富的内建功能，如速度快到惊人的模块热更新（HMR），使用 Rollup 打包你的代码，并且它是预配置的，可输出用于生产环境的高度优化过的静态资源。更多关于<a href="https://cn.vitejs.dev/guide/" target="_blank" rel="noreferrer">vite</a></p><p>模版集成了如下的 vite 插件</p><ul><li>unplugin-auto-import（按需加载，自动引入）</li><li>unplugin-vue-components（按需加载，自动引入组件）</li><li>vite-plugin-compression（开启.gz 压缩）</li><li>vite-plugin-eruda（控制台，方便移动端调试）</li><li>vite-plugin-imagemin（图片压缩）</li><li>vite-plugin-mock（引入 mockjs，本地模拟接口）</li><li>vite-plugin-pages（动态生成路由）</li><li>vite-plugin-progress（构建显示进度条）</li><li>vite-plugin-restart（监听配置文件修改自动重启 Vite）</li><li>vite-plugin-style-import（按需引入样式文件）</li><li>vite-plugin-svg-icons（加载 SVG 文件，自动引入）</li></ul>',4),o=[n];function r(s,p,u,v,_,c){return i(),t("div",null,o)}const m=e(a,[["render",r]]);export{g as __pageData,m as default};
import{_ as e,o as i,c as t,R as l}from"./chunks/framework.6241eaf2.js";const g=JSON.parse('{"title":"vite","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/vite.md","filePath":"guide/vue3/vite.md","lastUpdated":1731315864000}'),a={name:"guide/vue3/vite.md"},n=l('<h1 id="vite" tabindex="-1">vite <a class="header-anchor" href="#vite" aria-label="Permalink to &quot;vite&quot;">​</a></h1><p>基于原生 ES 模块提供了丰富的内建功能，如速度快到惊人的模块热更新（HMR），使用 Rollup 打包你的代码，并且它是预配置的，可输出用于生产环境的高度优化过的静态资源。更多关于<a href="https://cn.vitejs.dev/guide/" target="_blank" rel="noreferrer">vite</a></p><p>模版集成了如下的 vite 插件</p><ul><li>unplugin-auto-import（按需加载，自动引入）</li><li>unplugin-vue-components（按需加载，自动引入组件）</li><li>vite-plugin-compression（开启.gz 压缩）</li><li>vite-plugin-eruda（控制台，方便移动端调试）</li><li>vite-plugin-imagemin（图片压缩）</li><li>vite-plugin-mock（引入 mockjs，本地模拟接口）</li><li>vite-plugin-pages（动态生成路由）</li><li>vite-plugin-progress（构建显示进度条）</li><li>vite-plugin-restart（监听配置文件修改自动重启 Vite）</li><li>vite-plugin-style-import（按需引入样式文件）</li><li>vite-plugin-svg-icons（加载 SVG 文件，自动引入）</li></ul>',4),o=[n];function r(s,p,u,v,_,c){return i(),t("div",null,o)}const m=e(a,[["render",r]]);export{g as __pageData,m as default};

2
assets/guide_vue3_vite.md.9ec8c052.lean.js → assets/guide_vue3_vite.md.7a4b4162.lean.js
View File

@ -1 +1 @@
import{_ as e,o as i,c as t,R as l}from"./chunks/framework.6241eaf2.js";const g=JSON.parse('{"title":"vite","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/vite.md","filePath":"guide/vue3/vite.md","lastUpdated":1687776555000}'),a={name:"guide/vue3/vite.md"},n=l("",4),o=[n];function r(s,p,u,v,_,c){return i(),t("div",null,o)}const m=e(a,[["render",r]]);export{g as __pageData,m as default};
import{_ as e,o as i,c as t,R as l}from"./chunks/framework.6241eaf2.js";const g=JSON.parse('{"title":"vite","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/vite.md","filePath":"guide/vue3/vite.md","lastUpdated":1731315864000}'),a={name:"guide/vue3/vite.md"},n=l("",4),o=[n];function r(s,p,u,v,_,c){return i(),t("div",null,o)}const m=e(a,[["render",r]]);export{g as __pageData,m as default};

2
assets/index.md.bd639346.lean.js → assets/index.md.b1dbb931.js
View File

@ -1 +1 @@
import{_ as e,o as t,c as i}from"./chunks/framework.6241eaf2.js";const u=JSON.parse('{"title":"Vue-H5-Template","titleTemplate":"一个快速开发的vue h5移动端脚手架","description":"","frontmatter":{"layout":"home","title":"Vue-H5-Template","titleTemplate":"一个快速开发的vue h5移动端脚手架","hero":{"name":"Vue-H5-Template","text":"一个快速开发的Vue H5移动端脚手架","image":{"src":"https://cdn.jsdelivr.net/gh/fonghehe/picture/vue-h5-template/logo.png","alt":"sunnie"},"actions":[{"theme":"brand","text":"开始","link":"/guide/"},{"theme":"alt","text":"Github仓库","link":"https://github.com/sunniejs/vue-h5-template"}]},"features":[{"icon":"💡","title":"开箱即用","details":"集成vue2、vue3的移动端快速开发模版，学习成本低，易上手"},{"icon":"📦","title":"代码规范","details":"完整的eslint、prettier、stylelint规范，加上husky，帮助你更好的管理代码"},{"icon":"🛠️","title":"配置优化","details":"完整配置的vue脚手架插件和优化，让你专注于业务开发，更高效"},{"icon":"⚙️","title":"More","details":"加入我们，更多能力等你挖掘...."}]},"headers":[],"relativePath":"index.md","filePath":"index.md","lastUpdated":1687776555000}'),a={name:"index.md"};function n(l,s,o,r,c,d){return t(),i("div")}const m=e(a,[["render",n]]);export{u as __pageData,m as default};
import{_ as e,o as t,c as i}from"./chunks/framework.6241eaf2.js";const u=JSON.parse('{"title":"Vue-H5-Template","titleTemplate":"一个快速开发的vue h5移动端脚手架","description":"","frontmatter":{"layout":"home","title":"Vue-H5-Template","titleTemplate":"一个快速开发的vue h5移动端脚手架","hero":{"name":"Vue-H5-Template","text":"一个快速开发的Vue H5移动端脚手架","image":{"src":"https://cdn.jsdelivr.net/gh/fonghehe/picture/vue-h5-template/logo.png","alt":"sunnie"},"actions":[{"theme":"brand","text":"开始","link":"/guide/"},{"theme":"alt","text":"Github仓库","link":"https://github.com/sunniejs/vue-h5-template"}]},"features":[{"icon":"💡","title":"开箱即用","details":"集成vue2、vue3的移动端快速开发模版，学习成本低，易上手"},{"icon":"📦","title":"代码规范","details":"完整的eslint、prettier、stylelint规范，加上husky，帮助你更好的管理代码"},{"icon":"🛠️","title":"配置优化","details":"完整配置的vue脚手架插件和优化，让你专注于业务开发，更高效"},{"icon":"⚙️","title":"More","details":"加入我们，更多能力等你挖掘...."}]},"headers":[],"relativePath":"index.md","filePath":"index.md","lastUpdated":1731315864000}'),a={name:"index.md"};function n(l,s,o,r,c,d){return t(),i("div")}const m=e(a,[["render",n]]);export{u as __pageData,m as default};

2
assets/index.md.bd639346.js → assets/index.md.b1dbb931.lean.js
View File

@ -1 +1 @@
import{_ as e,o as t,c as i}from"./chunks/framework.6241eaf2.js";const u=JSON.parse('{"title":"Vue-H5-Template","titleTemplate":"一个快速开发的vue h5移动端脚手架","description":"","frontmatter":{"layout":"home","title":"Vue-H5-Template","titleTemplate":"一个快速开发的vue h5移动端脚手架","hero":{"name":"Vue-H5-Template","text":"一个快速开发的Vue H5移动端脚手架","image":{"src":"https://cdn.jsdelivr.net/gh/fonghehe/picture/vue-h5-template/logo.png","alt":"sunnie"},"actions":[{"theme":"brand","text":"开始","link":"/guide/"},{"theme":"alt","text":"Github仓库","link":"https://github.com/sunniejs/vue-h5-template"}]},"features":[{"icon":"💡","title":"开箱即用","details":"集成vue2、vue3的移动端快速开发模版，学习成本低，易上手"},{"icon":"📦","title":"代码规范","details":"完整的eslint、prettier、stylelint规范，加上husky，帮助你更好的管理代码"},{"icon":"🛠️","title":"配置优化","details":"完整配置的vue脚手架插件和优化，让你专注于业务开发，更高效"},{"icon":"⚙️","title":"More","details":"加入我们，更多能力等你挖掘...."}]},"headers":[],"relativePath":"index.md","filePath":"index.md","lastUpdated":1687776555000}'),a={name:"index.md"};function n(l,s,o,r,c,d){return t(),i("div")}const m=e(a,[["render",n]]);export{u as __pageData,m as default};
import{_ as e,o as t,c as i}from"./chunks/framework.6241eaf2.js";const u=JSON.parse('{"title":"Vue-H5-Template","titleTemplate":"一个快速开发的vue h5移动端脚手架","description":"","frontmatter":{"layout":"home","title":"Vue-H5-Template","titleTemplate":"一个快速开发的vue h5移动端脚手架","hero":{"name":"Vue-H5-Template","text":"一个快速开发的Vue H5移动端脚手架","image":{"src":"https://cdn.jsdelivr.net/gh/fonghehe/picture/vue-h5-template/logo.png","alt":"sunnie"},"actions":[{"theme":"brand","text":"开始","link":"/guide/"},{"theme":"alt","text":"Github仓库","link":"https://github.com/sunniejs/vue-h5-template"}]},"features":[{"icon":"💡","title":"开箱即用","details":"集成vue2、vue3的移动端快速开发模版，学习成本低，易上手"},{"icon":"📦","title":"代码规范","details":"完整的eslint、prettier、stylelint规范，加上husky，帮助你更好的管理代码"},{"icon":"🛠️","title":"配置优化","details":"完整配置的vue脚手架插件和优化，让你专注于业务开发，更高效"},{"icon":"⚙️","title":"More","details":"加入我们，更多能力等你挖掘...."}]},"headers":[],"relativePath":"index.md","filePath":"index.md","lastUpdated":1731315864000}'),a={name:"index.md"};function n(l,s,o,r,c,d){return t(),i("div")}const m=e(a,[["render",n]]);export{u as __pageData,m as default};

2
assets/style.82cfa615.css → assets/style.16a63e98.css
View File

File diff suppressed because one or more lines are too long

8
guide/about/index.html
View File

File diff suppressed because one or more lines are too long

22
guide/edit.html
View File

File diff suppressed because one or more lines are too long

8
guide/index.html
View File

File diff suppressed because one or more lines are too long

8
guide/other/index.html
View File

File diff suppressed because one or more lines are too long

8
guide/start.html
View File

File diff suppressed because one or more lines are too long

8
guide/vue2/alias.html
View File

@ -5,12 +5,12 @@
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>配置 alias 别名 | Vue-H5-Template</title>
<meta name="description" content="一个开箱即用的vue h5脚手架">
<link rel="preload stylesheet" href="/vue-h5-template/assets/style.82cfa615.css" as="style">
<link rel="preload stylesheet" href="/vue-h5-template/assets/style.16a63e98.css" as="style">
<script type="module" src="/vue-h5-template/assets/app.88821414.js"></script>
<link rel="preload" href="/vue-h5-template/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
<link rel="modulepreload" href="/vue-h5-template/assets/chunks/framework.6241eaf2.js">
<link rel="modulepreload" href="/vue-h5-template/assets/chunks/theme.c4d303ac.js">
<link rel="modulepreload" href="/vue-h5-template/assets/guide_vue2_alias.md.306b63fa.lean.js">
<link rel="modulepreload" href="/vue-h5-template/assets/guide_vue2_alias.md.c0d9e31c.lean.js">
<link rel="icon" href="/favicon.ico">
<script id="check-dark-light">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
</head>
@ -29,8 +29,8 @@
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">set</span><span style="color:#F07178;">(</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">views</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">,</span><span style="color:#F07178;"> </span><span style="color:#82AAFF;">resolve</span><span style="color:#F07178;">(</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">src/views</span><span style="color:#89DDFF;">&quot;</span><span style="color:#F07178;">))</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">set</span><span style="color:#F07178;">(</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">components</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">,</span><span style="color:#F07178;"> </span><span style="color:#82AAFF;">resolve</span><span style="color:#F07178;">(</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">src/components</span><span style="color:#89DDFF;">&quot;</span><span style="color:#F07178;">))</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#89DDFF;">};</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-c4b0d3cf data-v-face870a><!--[--><!--]--><div class="edit-info" data-v-face870a><div class="edit-link" data-v-face870a><a class="VPLink link edit-link-button" href="https://github.com/sunniejs/vue-h5-template/blob/docs/docs/guide/vue2/alias.md" target="_blank" rel="noreferrer" data-v-face870a data-v-8f4dc553><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" aria-label="edit icon" data-v-face870a><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> 在GitHub编辑此页<!--]--><!----></a></div><div class="last-updated" data-v-face870a><p class="VPLastUpdated" data-v-face870a data-v-7b3ebfe1>Last updated: <time datetime="2023-06-26T10:49:15.000Z" data-v-7b3ebfe1></time></p></div></div><div class="prev-next" data-v-face870a><div class="pager" data-v-face870a><a class="pager-link prev" href="/vue-h5-template/guide/vue2/base.html" data-v-face870a><span class="desc" data-v-face870a>Previous page</span><span class="title" data-v-face870a>vue.config.js 基础配置</span></a></div><div class="has-prev pager" data-v-face870a><a class="pager-link next" href="/vue-h5-template/guide/vue2/proxy.html" data-v-face870a><span class="desc" data-v-face870a>Next page</span><span class="title" data-v-face870a>配置 proxy 跨域</span></a></div></div></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-b2cf3e0b data-v-2f86ebd2><div class="container" data-v-2f86ebd2><p class="message" data-v-2f86ebd2>Released under the MIT License.</p><p class="copyright" data-v-2f86ebd2>Copyright © 2022-present Fonghehe</p></div></footer><!--[--><!--]--></div></div>
<script>__VP_HASH_MAP__ = JSON.parse("{\"guide_other_index.md\":\"0962dd47\",\"guide_start.md\":\"18fddbf4\",\"guide_vue2_router.md\":\"d35b25e7\",\"guide_vue2_sass.md\":\"723a4859\",\"guide_vue2_start.md\":\"e13e8546\",\"guide_vue2_vant.md\":\"9252795d\",\"guide_vue3_lint.md\":\"b9504b63\",\"guide_vue3_start.md\":\"f354f662\",\"guide_vue3_ui.md\":\"cc6ae98b\",\"guide_vue3_viewport.md\":\"ad1a10ef\",\"guide_vue3_vite.md\":\"9ec8c052\",\"guide_index.md\":\"3a64f07e\",\"guide_vue2_vuex.md\":\"618230b5\",\"guide_vue2_vw.md\":\"ca9fc79f\",\"guide_vue3_alias.md\":\"d777bc16\",\"guide_vue3_base.md\":\"732de433\",\"guide_vue3_env.md\":\"83cf2a7e\",\"guide_vue2_rem.md\":\"769a5fda\",\"guide_about_index.md\":\"9cd5ee99\",\"guide_edit.md\":\"4c959ba5\",\"guide_vue2_axios.md\":\"a682218e\",\"guide_vue3_axios.md\":\"cd29cfa2\",\"guide_vue2_bundle.md\":\"2fe1a9fb\",\"guide_vue2_chunks.md\":\"0130f8b3\",\"guide_vue2_console.md\":\"51b49cb0\",\"guide_vue2_env.md\":\"c800a293\",\"guide_vue2_externals.md\":\"69c0669f\",\"index.md\":\"bd639346\",\"guide_vue3_i18n.md\":\"0436062d\",\"guide_vue2_base.md\":\"7d4266ed\",\"guide_vue2_ie.md\":\"83d021b7\",\"guide_vue2_lint.md\":\"d5070d4f\",\"guide_vue2_proxy.md\":\"f5f5a403\",\"guide_vue2_alias.md\":\"306b63fa\",\"guide_vue3_router.md\":\"bf1ddfb2\",\"guide_vue3_pinia.md\":\"4c51a07c\",\"guide_vue3_proxy.md\":\"b05cbab3\"}")
<span class="line"><span style="color:#89DDFF;">};</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-c4b0d3cf data-v-face870a><!--[--><!--]--><div class="edit-info" data-v-face870a><div class="edit-link" data-v-face870a><a class="VPLink link edit-link-button" href="https://github.com/sunniejs/vue-h5-template/blob/docs/docs/guide/vue2/alias.md" target="_blank" rel="noreferrer" data-v-face870a data-v-8f4dc553><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" aria-label="edit icon" data-v-face870a><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> 在GitHub编辑此页<!--]--><!----></a></div><div class="last-updated" data-v-face870a><p class="VPLastUpdated" data-v-face870a data-v-7b3ebfe1>Last updated: <time datetime="2024-11-11T09:04:24.000Z" data-v-7b3ebfe1></time></p></div></div><div class="prev-next" data-v-face870a><div class="pager" data-v-face870a><a class="pager-link prev" href="/vue-h5-template/guide/vue2/base.html" data-v-face870a><span class="desc" data-v-face870a>Previous page</span><span class="title" data-v-face870a>vue.config.js 基础配置</span></a></div><div class="has-prev pager" data-v-face870a><a class="pager-link next" href="/vue-h5-template/guide/vue2/proxy.html" data-v-face870a><span class="desc" data-v-face870a>Next page</span><span class="title" data-v-face870a>配置 proxy 跨域</span></a></div></div></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-b2cf3e0b data-v-2f86ebd2><div class="container" data-v-2f86ebd2><p class="message" data-v-2f86ebd2>Released under the MIT License.</p><p class="copyright" data-v-2f86ebd2>Copyright © 2022-present Fonghehe</p></div></footer><!--[--><!--]--></div></div>
<script>__VP_HASH_MAP__ = JSON.parse("{\"guide_about_index.md\":\"3268f72f\",\"guide_index.md\":\"46287c77\",\"guide_vue2_base.md\":\"bd933227\",\"guide_edit.md\":\"7944bd49\",\"guide_vue2_alias.md\":\"c0d9e31c\",\"guide_vue2_env.md\":\"71078dec\",\"guide_vue2_chunks.md\":\"93504c3d\",\"guide_vue3_axios.md\":\"0778382b\",\"guide_vue2_router.md\":\"369637ff\",\"guide_vue2_vant.md\":\"4ed27c84\",\"guide_vue2_vw.md\":\"f3d8795c\",\"guide_start.md\":\"634b98ba\",\"guide_vue3_i18n.md\":\"51f27eff\",\"guide_vue2_rem.md\":\"05f1a99e\",\"guide_vue3_pinia.md\":\"0d738d45\",\"guide_vue3_lint.md\":\"18663aed\",\"guide_vue3_start.md\":\"6f88b41c\",\"guide_vue3_proxy.md\":\"94d7124b\",\"guide_vue2_vuex.md\":\"399839b6\",\"guide_vue2_proxy.md\":\"0d483f53\",\"guide_vue3_base.md\":\"462dbdb9\",\"guide_vue2_console.md\":\"68673d37\",\"guide_other_index.md\":\"5aef07ec\",\"guide_vue2_bundle.md\":\"73aeb293\",\"guide_vue3_alias.md\":\"6e50bff0\",\"guide_vue2_sass.md\":\"3616d11c\",\"guide_vue2_start.md\":\"f6e40312\",\"guide_vue3_env.md\":\"b928542e\",\"guide_vue3_ui.md\":\"385fc808\",\"guide_vue3_viewport.md\":\"0ef62fba\",\"guide_vue3_router.md\":\"84936a90\",\"guide_vue2_lint.md\":\"94bcc728\",\"guide_vue2_axios.md\":\"f273628e\",\"guide_vue2_externals.md\":\"6744fb41\",\"guide_vue3_vite.md\":\"7a4b4162\",\"index.md\":\"b1dbb931\",\"guide_vue2_ie.md\":\"f5d567e9\"}")
__VP_SITE_DATA__ = JSON.parse("{\"lang\":\"zh-CN\",\"dir\":\"ltr\",\"title\":\"Vue-H5-Template\",\"description\":\"一个开箱即用的vue h5脚手架\",\"base\":\"/vue-h5-template/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"介绍\",\"link\":\"/guide/\"},{\"text\":\"加入我们\",\"link\":\"/guide/about/\"},{\"text\":\"github仓库\",\"link\":\"https://github.com/sunniejs/vue-h5-template\"}],\"sidebar\":[{\"text\":\"前言\",\"collapsible\":true,\"items\":[{\"text\":\"介绍\",\"link\":\"/guide/\"},{\"text\":\"快速上手\",\"link\":\"/guide/start\"},{\"text\":\"参与编辑\",\"link\":\"/guide/edit\"}]},{\"text\":\"vue3-template\",\"collapsible\":true,\"items\":[{\"text\":\"启动项目\",\"link\":\"/guide/vue3/start\"},{\"text\":\"vite.config.ts 基础配置\",\"link\":\"/guide/vue3/base\"},{\"text\":\"vite插件集成\",\"link\":\"/guide/vue3/vite\"},{\"text\":\"多环境变量\",\"link\":\"/guide/vue3/env\"},{\"text\":\"viewport 适配方案\",\"link\":\"/guide/vue3/viewport\"},{\"text\":\"UI组件库\",\"link\":\"/guide/vue3/ui\"},{\"text\":\"Pinia 状态管理\",\"link\":\"/guide/vue3/pinia\"},{\"text\":\"vue-router\",\"link\":\"/guide/vue3/router\"},{\"text\":\"axios 封装及接口管理\",\"link\":\"/guide/vue3/axios\"},{\"text\":\"alias\",\"link\":\"/guide/vue3/alias\"},{\"text\":\"proxy 跨域\",\"link\":\"/guide/vue3/proxy\"},{\"text\":\"多语言解决方案\",\"link\":\"/guide/vue3/i18n\"},{\"text\":\"统一开发规范\",\"link\":\"/guide/vue3/lint\"}]},{\"text\":\"vue2-template\",\"collapsible\":true,\"collapsed\":true,\"items\":[{\"text\":\"启动项目\",\"link\":\"/guide/vue2/start\"},{\"text\":\"多环境变量\",\"link\":\"/guide/vue2/env\"},{\"text\":\"rem 适配方案\",\"link\":\"/guide/vue2/rem\"},{\"text\":\"vw 适配方案\",\"link\":\"/guide/vue2/vw\"},{\"text\":\"VantUI 组件按需加载\",\"link\":\"/guide/vue2/vant\"},{\"text\":\"Sass 全局样式\",\"link\":\"/guide/vue2/sass\"},{\"text\":\"Vuex 状态管理\",\"link\":\"/guide/vue2/vuex\"},{\"text\":\"Vue-router\",\"link\":\"/guide/vue2/router\"},{\"text\":\"Axios 封装及接口管理\",\"link\":\"/guide/vue2/axios\"},{\"text\":\"vue.config.js 基础配置\",\"link\":\"/guide/vue2/base\"},{\"text\":\"配置 alias 别名\",\"link\":\"/guide/vue2/alias\"},{\"text\":\"配置 proxy 跨域\",\"link\":\"/guide/vue2/proxy\"},{\"text\":\"配置 打包分析\",\"link\":\"/guide/vue2/bundle\"},{\"text\":\"配置 externals 引入 cdn 资源\",\"link\":\"/guide/vue2/externals\"},{\"text\":\"去掉 console.log\",\"link\":\"/guide/vue2/console\"},{\"text\":\"splitChunks 打包第三方模块\",\"link\":\"/guide/vue2/chunks\"},{\"text\":\"添加 IE 兼容\",\"link\":\"/guide/vue2/ie\"},{\"text\":\"统一开发规范\",\"link\":\"/guide/vue2/lint\"}]},{\"text\":\"其他\",\"collapsible\":true,\"collapsed\":true,\"items\":[{\"text\":\"常见问题\",\"link\":\"/guide/other/\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/sunniejs/vue-h5-template\"}],\"editLink\":{\"pattern\":\"https://github.com/sunniejs/vue-h5-template/blob/docs/docs/:path\",\"text\":\"在GitHub编辑此页\"},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2022-present Fonghehe\"},\"algolia\":{\"appId\":\"CV2I8NGBKZ\",\"apiKey\":\"63c37a467485b00383daacf7340b4ca0\",\"indexName\":\"vue-h5-template\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}")</script>
</body>

12
guide/vue2/axios.html
View File

File diff suppressed because one or more lines are too long

8
guide/vue2/base.html
View File

@ -5,12 +5,12 @@
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Webpack 4 vue.config.js 基础配置 | Vue-H5-Template</title>
<meta name="description" content="一个开箱即用的vue h5脚手架">
<link rel="preload stylesheet" href="/vue-h5-template/assets/style.82cfa615.css" as="style">
<link rel="preload stylesheet" href="/vue-h5-template/assets/style.16a63e98.css" as="style">
<script type="module" src="/vue-h5-template/assets/app.88821414.js"></script>
<link rel="preload" href="/vue-h5-template/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
<link rel="modulepreload" href="/vue-h5-template/assets/chunks/framework.6241eaf2.js">
<link rel="modulepreload" href="/vue-h5-template/assets/chunks/theme.c4d303ac.js">
<link rel="modulepreload" href="/vue-h5-template/assets/guide_vue2_base.md.7d4266ed.lean.js">
<link rel="modulepreload" href="/vue-h5-template/assets/guide_vue2_base.md.bd933227.lean.js">
<link rel="icon" href="/favicon.ico">
<script id="check-dark-light">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
</head>
@ -61,8 +61,8 @@
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">};</span></span>
<span class="line"><span style="color:#89DDFF;">}</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-c4b0d3cf data-v-face870a><!--[--><!--]--><div class="edit-info" data-v-face870a><div class="edit-link" data-v-face870a><a class="VPLink link edit-link-button" href="https://github.com/sunniejs/vue-h5-template/blob/docs/docs/guide/vue2/base.md" target="_blank" rel="noreferrer" data-v-face870a data-v-8f4dc553><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" aria-label="edit icon" data-v-face870a><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> 在GitHub编辑此页<!--]--><!----></a></div><div class="last-updated" data-v-face870a><p class="VPLastUpdated" data-v-face870a data-v-7b3ebfe1>Last updated: <time datetime="2023-06-26T10:49:15.000Z" data-v-7b3ebfe1></time></p></div></div><div class="prev-next" data-v-face870a><div class="pager" data-v-face870a><a class="pager-link prev" href="/vue-h5-template/guide/vue2/axios.html" data-v-face870a><span class="desc" data-v-face870a>Previous page</span><span class="title" data-v-face870a>Axios 封装及接口管理</span></a></div><div class="has-prev pager" data-v-face870a><a class="pager-link next" href="/vue-h5-template/guide/vue2/alias.html" data-v-face870a><span class="desc" data-v-face870a>Next page</span><span class="title" data-v-face870a>配置 alias 别名</span></a></div></div></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-b2cf3e0b data-v-2f86ebd2><div class="container" data-v-2f86ebd2><p class="message" data-v-2f86ebd2>Released under the MIT License.</p><p class="copyright" data-v-2f86ebd2>Copyright © 2022-present Fonghehe</p></div></footer><!--[--><!--]--></div></div>
<script>__VP_HASH_MAP__ = JSON.parse("{\"guide_other_index.md\":\"0962dd47\",\"guide_start.md\":\"18fddbf4\",\"guide_vue2_router.md\":\"d35b25e7\",\"guide_vue2_sass.md\":\"723a4859\",\"guide_vue2_start.md\":\"e13e8546\",\"guide_vue2_vant.md\":\"9252795d\",\"guide_vue3_lint.md\":\"b9504b63\",\"guide_vue3_start.md\":\"f354f662\",\"guide_vue3_ui.md\":\"cc6ae98b\",\"guide_vue3_viewport.md\":\"ad1a10ef\",\"guide_vue3_vite.md\":\"9ec8c052\",\"guide_index.md\":\"3a64f07e\",\"guide_vue2_vuex.md\":\"618230b5\",\"guide_vue2_vw.md\":\"ca9fc79f\",\"guide_vue3_alias.md\":\"d777bc16\",\"guide_vue3_base.md\":\"732de433\",\"guide_vue3_env.md\":\"83cf2a7e\",\"guide_vue2_rem.md\":\"769a5fda\",\"guide_about_index.md\":\"9cd5ee99\",\"guide_edit.md\":\"4c959ba5\",\"guide_vue2_axios.md\":\"a682218e\",\"guide_vue3_axios.md\":\"cd29cfa2\",\"guide_vue2_bundle.md\":\"2fe1a9fb\",\"guide_vue2_chunks.md\":\"0130f8b3\",\"guide_vue2_console.md\":\"51b49cb0\",\"guide_vue2_env.md\":\"c800a293\",\"guide_vue2_externals.md\":\"69c0669f\",\"index.md\":\"bd639346\",\"guide_vue3_i18n.md\":\"0436062d\",\"guide_vue2_base.md\":\"7d4266ed\",\"guide_vue2_ie.md\":\"83d021b7\",\"guide_vue2_lint.md\":\"d5070d4f\",\"guide_vue2_proxy.md\":\"f5f5a403\",\"guide_vue2_alias.md\":\"306b63fa\",\"guide_vue3_router.md\":\"bf1ddfb2\",\"guide_vue3_pinia.md\":\"4c51a07c\",\"guide_vue3_proxy.md\":\"b05cbab3\"}")
<span class="line"><span style="color:#89DDFF;">}</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-c4b0d3cf data-v-face870a><!--[--><!--]--><div class="edit-info" data-v-face870a><div class="edit-link" data-v-face870a><a class="VPLink link edit-link-button" href="https://github.com/sunniejs/vue-h5-template/blob/docs/docs/guide/vue2/base.md" target="_blank" rel="noreferrer" data-v-face870a data-v-8f4dc553><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" aria-label="edit icon" data-v-face870a><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> 在GitHub编辑此页<!--]--><!----></a></div><div class="last-updated" data-v-face870a><p class="VPLastUpdated" data-v-face870a data-v-7b3ebfe1>Last updated: <time datetime="2024-11-11T09:04:24.000Z" data-v-7b3ebfe1></time></p></div></div><div class="prev-next" data-v-face870a><div class="pager" data-v-face870a><a class="pager-link prev" href="/vue-h5-template/guide/vue2/axios.html" data-v-face870a><span class="desc" data-v-face870a>Previous page</span><span class="title" data-v-face870a>Axios 封装及接口管理</span></a></div><div class="has-prev pager" data-v-face870a><a class="pager-link next" href="/vue-h5-template/guide/vue2/alias.html" data-v-face870a><span class="desc" data-v-face870a>Next page</span><span class="title" data-v-face870a>配置 alias 别名</span></a></div></div></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-b2cf3e0b data-v-2f86ebd2><div class="container" data-v-2f86ebd2><p class="message" data-v-2f86ebd2>Released under the MIT License.</p><p class="copyright" data-v-2f86ebd2>Copyright © 2022-present Fonghehe</p></div></footer><!--[--><!--]--></div></div>
<script>__VP_HASH_MAP__ = JSON.parse("{\"guide_about_index.md\":\"3268f72f\",\"guide_index.md\":\"46287c77\",\"guide_vue2_base.md\":\"bd933227\",\"guide_edit.md\":\"7944bd49\",\"guide_vue2_alias.md\":\"c0d9e31c\",\"guide_vue2_env.md\":\"71078dec\",\"guide_vue2_chunks.md\":\"93504c3d\",\"guide_vue3_axios.md\":\"0778382b\",\"guide_vue2_router.md\":\"369637ff\",\"guide_vue2_vant.md\":\"4ed27c84\",\"guide_vue2_vw.md\":\"f3d8795c\",\"guide_start.md\":\"634b98ba\",\"guide_vue3_i18n.md\":\"51f27eff\",\"guide_vue2_rem.md\":\"05f1a99e\",\"guide_vue3_pinia.md\":\"0d738d45\",\"guide_vue3_lint.md\":\"18663aed\",\"guide_vue3_start.md\":\"6f88b41c\",\"guide_vue3_proxy.md\":\"94d7124b\",\"guide_vue2_vuex.md\":\"399839b6\",\"guide_vue2_proxy.md\":\"0d483f53\",\"guide_vue3_base.md\":\"462dbdb9\",\"guide_vue2_console.md\":\"68673d37\",\"guide_other_index.md\":\"5aef07ec\",\"guide_vue2_bundle.md\":\"73aeb293\",\"guide_vue3_alias.md\":\"6e50bff0\",\"guide_vue2_sass.md\":\"3616d11c\",\"guide_vue2_start.md\":\"f6e40312\",\"guide_vue3_env.md\":\"b928542e\",\"guide_vue3_ui.md\":\"385fc808\",\"guide_vue3_viewport.md\":\"0ef62fba\",\"guide_vue3_router.md\":\"84936a90\",\"guide_vue2_lint.md\":\"94bcc728\",\"guide_vue2_axios.md\":\"f273628e\",\"guide_vue2_externals.md\":\"6744fb41\",\"guide_vue3_vite.md\":\"7a4b4162\",\"index.md\":\"b1dbb931\",\"guide_vue2_ie.md\":\"f5d567e9\"}")
__VP_SITE_DATA__ = JSON.parse("{\"lang\":\"zh-CN\",\"dir\":\"ltr\",\"title\":\"Vue-H5-Template\",\"description\":\"一个开箱即用的vue h5脚手架\",\"base\":\"/vue-h5-template/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"介绍\",\"link\":\"/guide/\"},{\"text\":\"加入我们\",\"link\":\"/guide/about/\"},{\"text\":\"github仓库\",\"link\":\"https://github.com/sunniejs/vue-h5-template\"}],\"sidebar\":[{\"text\":\"前言\",\"collapsible\":true,\"items\":[{\"text\":\"介绍\",\"link\":\"/guide/\"},{\"text\":\"快速上手\",\"link\":\"/guide/start\"},{\"text\":\"参与编辑\",\"link\":\"/guide/edit\"}]},{\"text\":\"vue3-template\",\"collapsible\":true,\"items\":[{\"text\":\"启动项目\",\"link\":\"/guide/vue3/start\"},{\"text\":\"vite.config.ts 基础配置\",\"link\":\"/guide/vue3/base\"},{\"text\":\"vite插件集成\",\"link\":\"/guide/vue3/vite\"},{\"text\":\"多环境变量\",\"link\":\"/guide/vue3/env\"},{\"text\":\"viewport 适配方案\",\"link\":\"/guide/vue3/viewport\"},{\"text\":\"UI组件库\",\"link\":\"/guide/vue3/ui\"},{\"text\":\"Pinia 状态管理\",\"link\":\"/guide/vue3/pinia\"},{\"text\":\"vue-router\",\"link\":\"/guide/vue3/router\"},{\"text\":\"axios 封装及接口管理\",\"link\":\"/guide/vue3/axios\"},{\"text\":\"alias\",\"link\":\"/guide/vue3/alias\"},{\"text\":\"proxy 跨域\",\"link\":\"/guide/vue3/proxy\"},{\"text\":\"多语言解决方案\",\"link\":\"/guide/vue3/i18n\"},{\"text\":\"统一开发规范\",\"link\":\"/guide/vue3/lint\"}]},{\"text\":\"vue2-template\",\"collapsible\":true,\"collapsed\":true,\"items\":[{\"text\":\"启动项目\",\"link\":\"/guide/vue2/start\"},{\"text\":\"多环境变量\",\"link\":\"/guide/vue2/env\"},{\"text\":\"rem 适配方案\",\"link\":\"/guide/vue2/rem\"},{\"text\":\"vw 适配方案\",\"link\":\"/guide/vue2/vw\"},{\"text\":\"VantUI 组件按需加载\",\"link\":\"/guide/vue2/vant\"},{\"text\":\"Sass 全局样式\",\"link\":\"/guide/vue2/sass\"},{\"text\":\"Vuex 状态管理\",\"link\":\"/guide/vue2/vuex\"},{\"text\":\"Vue-router\",\"link\":\"/guide/vue2/router\"},{\"text\":\"Axios 封装及接口管理\",\"link\":\"/guide/vue2/axios\"},{\"text\":\"vue.config.js 基础配置\",\"link\":\"/guide/vue2/base\"},{\"text\":\"配置 alias 别名\",\"link\":\"/guide/vue2/alias\"},{\"text\":\"配置 proxy 跨域\",\"link\":\"/guide/vue2/proxy\"},{\"text\":\"配置 打包分析\",\"link\":\"/guide/vue2/bundle\"},{\"text\":\"配置 externals 引入 cdn 资源\",\"link\":\"/guide/vue2/externals\"},{\"text\":\"去掉 console.log\",\"link\":\"/guide/vue2/console\"},{\"text\":\"splitChunks 打包第三方模块\",\"link\":\"/guide/vue2/chunks\"},{\"text\":\"添加 IE 兼容\",\"link\":\"/guide/vue2/ie\"},{\"text\":\"统一开发规范\",\"link\":\"/guide/vue2/lint\"}]},{\"text\":\"其他\",\"collapsible\":true,\"collapsed\":true,\"items\":[{\"text\":\"常见问题\",\"link\":\"/guide/other/\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/sunniejs/vue-h5-template\"}],\"editLink\":{\"pattern\":\"https://github.com/sunniejs/vue-h5-template/blob/docs/docs/:path\",\"text\":\"在GitHub编辑此页\"},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2022-present Fonghehe\"},\"algolia\":{\"appId\":\"CV2I8NGBKZ\",\"apiKey\":\"63c37a467485b00383daacf7340b4ca0\",\"indexName\":\"vue-h5-template\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}")</script>
</body>

8
guide/vue2/bundle.html
View File

@ -5,12 +5,12 @@
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>配置打包分析 | Vue-H5-Template</title>
<meta name="description" content="一个开箱即用的vue h5脚手架">
<link rel="preload stylesheet" href="/vue-h5-template/assets/style.82cfa615.css" as="style">
<link rel="preload stylesheet" href="/vue-h5-template/assets/style.16a63e98.css" as="style">
<script type="module" src="/vue-h5-template/assets/app.88821414.js"></script>
<link rel="preload" href="/vue-h5-template/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
<link rel="modulepreload" href="/vue-h5-template/assets/chunks/framework.6241eaf2.js">
<link rel="modulepreload" href="/vue-h5-template/assets/chunks/theme.c4d303ac.js">
<link rel="modulepreload" href="/vue-h5-template/assets/guide_vue2_bundle.md.2fe1a9fb.lean.js">
<link rel="modulepreload" href="/vue-h5-template/assets/guide_vue2_bundle.md.73aeb293.lean.js">
<link rel="icon" href="/favicon.ico">
<script id="check-dark-light">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
</head>
@ -29,8 +29,8 @@
<span class="line"><span style="color:#F07178;"> ])</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">}</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#89DDFF;">};</span></span></code></pre></div><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">npm</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">run</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">build</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-c4b0d3cf data-v-face870a><!--[--><!--]--><div class="edit-info" data-v-face870a><div class="edit-link" data-v-face870a><a class="VPLink link edit-link-button" href="https://github.com/sunniejs/vue-h5-template/blob/docs/docs/guide/vue2/bundle.md" target="_blank" rel="noreferrer" data-v-face870a data-v-8f4dc553><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" aria-label="edit icon" data-v-face870a><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> 在GitHub编辑此页<!--]--><!----></a></div><div class="last-updated" data-v-face870a><p class="VPLastUpdated" data-v-face870a data-v-7b3ebfe1>Last updated: <time datetime="2023-06-26T10:49:15.000Z" data-v-7b3ebfe1></time></p></div></div><div class="prev-next" data-v-face870a><div class="pager" data-v-face870a><a class="pager-link prev" href="/vue-h5-template/guide/vue2/proxy.html" data-v-face870a><span class="desc" data-v-face870a>Previous page</span><span class="title" data-v-face870a>配置 proxy 跨域</span></a></div><div class="has-prev pager" data-v-face870a><a class="pager-link next" href="/vue-h5-template/guide/vue2/externals.html" data-v-face870a><span class="desc" data-v-face870a>Next page</span><span class="title" data-v-face870a>配置 externals 引入 cdn 资源</span></a></div></div></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-b2cf3e0b data-v-2f86ebd2><div class="container" data-v-2f86ebd2><p class="message" data-v-2f86ebd2>Released under the MIT License.</p><p class="copyright" data-v-2f86ebd2>Copyright © 2022-present Fonghehe</p></div></footer><!--[--><!--]--></div></div>
<script>__VP_HASH_MAP__ = JSON.parse("{\"guide_other_index.md\":\"0962dd47\",\"guide_start.md\":\"18fddbf4\",\"guide_vue2_router.md\":\"d35b25e7\",\"guide_vue2_sass.md\":\"723a4859\",\"guide_vue2_start.md\":\"e13e8546\",\"guide_vue2_vant.md\":\"9252795d\",\"guide_vue3_lint.md\":\"b9504b63\",\"guide_vue3_start.md\":\"f354f662\",\"guide_vue3_ui.md\":\"cc6ae98b\",\"guide_vue3_viewport.md\":\"ad1a10ef\",\"guide_vue3_vite.md\":\"9ec8c052\",\"guide_index.md\":\"3a64f07e\",\"guide_vue2_vuex.md\":\"618230b5\",\"guide_vue2_vw.md\":\"ca9fc79f\",\"guide_vue3_alias.md\":\"d777bc16\",\"guide_vue3_base.md\":\"732de433\",\"guide_vue3_env.md\":\"83cf2a7e\",\"guide_vue2_rem.md\":\"769a5fda\",\"guide_about_index.md\":\"9cd5ee99\",\"guide_edit.md\":\"4c959ba5\",\"guide_vue2_axios.md\":\"a682218e\",\"guide_vue3_axios.md\":\"cd29cfa2\",\"guide_vue2_bundle.md\":\"2fe1a9fb\",\"guide_vue2_chunks.md\":\"0130f8b3\",\"guide_vue2_console.md\":\"51b49cb0\",\"guide_vue2_env.md\":\"c800a293\",\"guide_vue2_externals.md\":\"69c0669f\",\"index.md\":\"bd639346\",\"guide_vue3_i18n.md\":\"0436062d\",\"guide_vue2_base.md\":\"7d4266ed\",\"guide_vue2_ie.md\":\"83d021b7\",\"guide_vue2_lint.md\":\"d5070d4f\",\"guide_vue2_proxy.md\":\"f5f5a403\",\"guide_vue2_alias.md\":\"306b63fa\",\"guide_vue3_router.md\":\"bf1ddfb2\",\"guide_vue3_pinia.md\":\"4c51a07c\",\"guide_vue3_proxy.md\":\"b05cbab3\"}")
<span class="line"><span style="color:#89DDFF;">};</span></span></code></pre></div><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">npm</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">run</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">build</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-c4b0d3cf data-v-face870a><!--[--><!--]--><div class="edit-info" data-v-face870a><div class="edit-link" data-v-face870a><a class="VPLink link edit-link-button" href="https://github.com/sunniejs/vue-h5-template/blob/docs/docs/guide/vue2/bundle.md" target="_blank" rel="noreferrer" data-v-face870a data-v-8f4dc553><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" aria-label="edit icon" data-v-face870a><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> 在GitHub编辑此页<!--]--><!----></a></div><div class="last-updated" data-v-face870a><p class="VPLastUpdated" data-v-face870a data-v-7b3ebfe1>Last updated: <time datetime="2024-11-11T09:04:24.000Z" data-v-7b3ebfe1></time></p></div></div><div class="prev-next" data-v-face870a><div class="pager" data-v-face870a><a class="pager-link prev" href="/vue-h5-template/guide/vue2/proxy.html" data-v-face870a><span class="desc" data-v-face870a>Previous page</span><span class="title" data-v-face870a>配置 proxy 跨域</span></a></div><div class="has-prev pager" data-v-face870a><a class="pager-link next" href="/vue-h5-template/guide/vue2/externals.html" data-v-face870a><span class="desc" data-v-face870a>Next page</span><span class="title" data-v-face870a>配置 externals 引入 cdn 资源</span></a></div></div></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-b2cf3e0b data-v-2f86ebd2><div class="container" data-v-2f86ebd2><p class="message" data-v-2f86ebd2>Released under the MIT License.</p><p class="copyright" data-v-2f86ebd2>Copyright © 2022-present Fonghehe</p></div></footer><!--[--><!--]--></div></div>
<script>__VP_HASH_MAP__ = JSON.parse("{\"guide_about_index.md\":\"3268f72f\",\"guide_index.md\":\"46287c77\",\"guide_vue2_base.md\":\"bd933227\",\"guide_edit.md\":\"7944bd49\",\"guide_vue2_alias.md\":\"c0d9e31c\",\"guide_vue2_env.md\":\"71078dec\",\"guide_vue2_chunks.md\":\"93504c3d\",\"guide_vue3_axios.md\":\"0778382b\",\"guide_vue2_router.md\":\"369637ff\",\"guide_vue2_vant.md\":\"4ed27c84\",\"guide_vue2_vw.md\":\"f3d8795c\",\"guide_start.md\":\"634b98ba\",\"guide_vue3_i18n.md\":\"51f27eff\",\"guide_vue2_rem.md\":\"05f1a99e\",\"guide_vue3_pinia.md\":\"0d738d45\",\"guide_vue3_lint.md\":\"18663aed\",\"guide_vue3_start.md\":\"6f88b41c\",\"guide_vue3_proxy.md\":\"94d7124b\",\"guide_vue2_vuex.md\":\"399839b6\",\"guide_vue2_proxy.md\":\"0d483f53\",\"guide_vue3_base.md\":\"462dbdb9\",\"guide_vue2_console.md\":\"68673d37\",\"guide_other_index.md\":\"5aef07ec\",\"guide_vue2_bundle.md\":\"73aeb293\",\"guide_vue3_alias.md\":\"6e50bff0\",\"guide_vue2_sass.md\":\"3616d11c\",\"guide_vue2_start.md\":\"f6e40312\",\"guide_vue3_env.md\":\"b928542e\",\"guide_vue3_ui.md\":\"385fc808\",\"guide_vue3_viewport.md\":\"0ef62fba\",\"guide_vue3_router.md\":\"84936a90\",\"guide_vue2_lint.md\":\"94bcc728\",\"guide_vue2_axios.md\":\"f273628e\",\"guide_vue2_externals.md\":\"6744fb41\",\"guide_vue3_vite.md\":\"7a4b4162\",\"index.md\":\"b1dbb931\",\"guide_vue2_ie.md\":\"f5d567e9\"}")
__VP_SITE_DATA__ = JSON.parse("{\"lang\":\"zh-CN\",\"dir\":\"ltr\",\"title\":\"Vue-H5-Template\",\"description\":\"一个开箱即用的vue h5脚手架\",\"base\":\"/vue-h5-template/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"介绍\",\"link\":\"/guide/\"},{\"text\":\"加入我们\",\"link\":\"/guide/about/\"},{\"text\":\"github仓库\",\"link\":\"https://github.com/sunniejs/vue-h5-template\"}],\"sidebar\":[{\"text\":\"前言\",\"collapsible\":true,\"items\":[{\"text\":\"介绍\",\"link\":\"/guide/\"},{\"text\":\"快速上手\",\"link\":\"/guide/start\"},{\"text\":\"参与编辑\",\"link\":\"/guide/edit\"}]},{\"text\":\"vue3-template\",\"collapsible\":true,\"items\":[{\"text\":\"启动项目\",\"link\":\"/guide/vue3/start\"},{\"text\":\"vite.config.ts 基础配置\",\"link\":\"/guide/vue3/base\"},{\"text\":\"vite插件集成\",\"link\":\"/guide/vue3/vite\"},{\"text\":\"多环境变量\",\"link\":\"/guide/vue3/env\"},{\"text\":\"viewport 适配方案\",\"link\":\"/guide/vue3/viewport\"},{\"text\":\"UI组件库\",\"link\":\"/guide/vue3/ui\"},{\"text\":\"Pinia 状态管理\",\"link\":\"/guide/vue3/pinia\"},{\"text\":\"vue-router\",\"link\":\"/guide/vue3/router\"},{\"text\":\"axios 封装及接口管理\",\"link\":\"/guide/vue3/axios\"},{\"text\":\"alias\",\"link\":\"/guide/vue3/alias\"},{\"text\":\"proxy 跨域\",\"link\":\"/guide/vue3/proxy\"},{\"text\":\"多语言解决方案\",\"link\":\"/guide/vue3/i18n\"},{\"text\":\"统一开发规范\",\"link\":\"/guide/vue3/lint\"}]},{\"text\":\"vue2-template\",\"collapsible\":true,\"collapsed\":true,\"items\":[{\"text\":\"启动项目\",\"link\":\"/guide/vue2/start\"},{\"text\":\"多环境变量\",\"link\":\"/guide/vue2/env\"},{\"text\":\"rem 适配方案\",\"link\":\"/guide/vue2/rem\"},{\"text\":\"vw 适配方案\",\"link\":\"/guide/vue2/vw\"},{\"text\":\"VantUI 组件按需加载\",\"link\":\"/guide/vue2/vant\"},{\"text\":\"Sass 全局样式\",\"link\":\"/guide/vue2/sass\"},{\"text\":\"Vuex 状态管理\",\"link\":\"/guide/vue2/vuex\"},{\"text\":\"Vue-router\",\"link\":\"/guide/vue2/router\"},{\"text\":\"Axios 封装及接口管理\",\"link\":\"/guide/vue2/axios\"},{\"text\":\"vue.config.js 基础配置\",\"link\":\"/guide/vue2/base\"},{\"text\":\"配置 alias 别名\",\"link\":\"/guide/vue2/alias\"},{\"text\":\"配置 proxy 跨域\",\"link\":\"/guide/vue2/proxy\"},{\"text\":\"配置 打包分析\",\"link\":\"/guide/vue2/bundle\"},{\"text\":\"配置 externals 引入 cdn 资源\",\"link\":\"/guide/vue2/externals\"},{\"text\":\"去掉 console.log\",\"link\":\"/guide/vue2/console\"},{\"text\":\"splitChunks 打包第三方模块\",\"link\":\"/guide/vue2/chunks\"},{\"text\":\"添加 IE 兼容\",\"link\":\"/guide/vue2/ie\"},{\"text\":\"统一开发规范\",\"link\":\"/guide/vue2/lint\"}]},{\"text\":\"其他\",\"collapsible\":true,\"collapsed\":true,\"items\":[{\"text\":\"常见问题\",\"link\":\"/guide/other/\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/sunniejs/vue-h5-template\"}],\"editLink\":{\"pattern\":\"https://github.com/sunniejs/vue-h5-template/blob/docs/docs/:path\",\"text\":\"在GitHub编辑此页\"},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2022-present Fonghehe\"},\"algolia\":{\"appId\":\"CV2I8NGBKZ\",\"apiKey\":\"63c37a467485b00383daacf7340b4ca0\",\"indexName\":\"vue-h5-template\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}")</script>
</body>

8
guide/vue2/chunks.html
View File

@ -5,12 +5,12 @@
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>splitChunks 单独打包第三方模块 | Vue-H5-Template</title>
<meta name="description" content="一个开箱即用的vue h5脚手架">
<link rel="preload stylesheet" href="/vue-h5-template/assets/style.82cfa615.css" as="style">
<link rel="preload stylesheet" href="/vue-h5-template/assets/style.16a63e98.css" as="style">
<script type="module" src="/vue-h5-template/assets/app.88821414.js"></script>
<link rel="preload" href="/vue-h5-template/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
<link rel="modulepreload" href="/vue-h5-template/assets/chunks/framework.6241eaf2.js">
<link rel="modulepreload" href="/vue-h5-template/assets/chunks/theme.c4d303ac.js">
<link rel="modulepreload" href="/vue-h5-template/assets/guide_vue2_chunks.md.0130f8b3.lean.js">
<link rel="modulepreload" href="/vue-h5-template/assets/guide_vue2_chunks.md.93504c3d.lean.js">
<link rel="icon" href="/favicon.ico">
<script id="check-dark-light">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
</head>
@ -55,8 +55,8 @@
<span class="line"><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">config</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">optimization</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">runtimeChunk</span><span style="color:#F07178;">(</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">single</span><span style="color:#89DDFF;">&quot;</span><span style="color:#F07178;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">}</span><span style="color:#F07178;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#89DDFF;">};</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-c4b0d3cf data-v-face870a><!--[--><!--]--><div class="edit-info" data-v-face870a><div class="edit-link" data-v-face870a><a class="VPLink link edit-link-button" href="https://github.com/sunniejs/vue-h5-template/blob/docs/docs/guide/vue2/chunks.md" target="_blank" rel="noreferrer" data-v-face870a data-v-8f4dc553><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" aria-label="edit icon" data-v-face870a><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> 在GitHub编辑此页<!--]--><!----></a></div><div class="last-updated" data-v-face870a><p class="VPLastUpdated" data-v-face870a data-v-7b3ebfe1>Last updated: <time datetime="2023-06-26T10:49:15.000Z" data-v-7b3ebfe1></time></p></div></div><div class="prev-next" data-v-face870a><div class="pager" data-v-face870a><a class="pager-link prev" href="/vue-h5-template/guide/vue2/console.html" data-v-face870a><span class="desc" data-v-face870a>Previous page</span><span class="title" data-v-face870a>去掉 console.log</span></a></div><div class="has-prev pager" data-v-face870a><a class="pager-link next" href="/vue-h5-template/guide/vue2/ie.html" data-v-face870a><span class="desc" data-v-face870a>Next page</span><span class="title" data-v-face870a>添加 IE 兼容</span></a></div></div></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-b2cf3e0b data-v-2f86ebd2><div class="container" data-v-2f86ebd2><p class="message" data-v-2f86ebd2>Released under the MIT License.</p><p class="copyright" data-v-2f86ebd2>Copyright © 2022-present Fonghehe</p></div></footer><!--[--><!--]--></div></div>
<script>__VP_HASH_MAP__ = JSON.parse("{\"guide_other_index.md\":\"0962dd47\",\"guide_start.md\":\"18fddbf4\",\"guide_vue2_router.md\":\"d35b25e7\",\"guide_vue2_sass.md\":\"723a4859\",\"guide_vue2_start.md\":\"e13e8546\",\"guide_vue2_vant.md\":\"9252795d\",\"guide_vue3_lint.md\":\"b9504b63\",\"guide_vue3_start.md\":\"f354f662\",\"guide_vue3_ui.md\":\"cc6ae98b\",\"guide_vue3_viewport.md\":\"ad1a10ef\",\"guide_vue3_vite.md\":\"9ec8c052\",\"guide_index.md\":\"3a64f07e\",\"guide_vue2_vuex.md\":\"618230b5\",\"guide_vue2_vw.md\":\"ca9fc79f\",\"guide_vue3_alias.md\":\"d777bc16\",\"guide_vue3_base.md\":\"732de433\",\"guide_vue3_env.md\":\"83cf2a7e\",\"guide_vue2_rem.md\":\"769a5fda\",\"guide_about_index.md\":\"9cd5ee99\",\"guide_edit.md\":\"4c959ba5\",\"guide_vue2_axios.md\":\"a682218e\",\"guide_vue3_axios.md\":\"cd29cfa2\",\"guide_vue2_bundle.md\":\"2fe1a9fb\",\"guide_vue2_chunks.md\":\"0130f8b3\",\"guide_vue2_console.md\":\"51b49cb0\",\"guide_vue2_env.md\":\"c800a293\",\"guide_vue2_externals.md\":\"69c0669f\",\"index.md\":\"bd639346\",\"guide_vue3_i18n.md\":\"0436062d\",\"guide_vue2_base.md\":\"7d4266ed\",\"guide_vue2_ie.md\":\"83d021b7\",\"guide_vue2_lint.md\":\"d5070d4f\",\"guide_vue2_proxy.md\":\"f5f5a403\",\"guide_vue2_alias.md\":\"306b63fa\",\"guide_vue3_router.md\":\"bf1ddfb2\",\"guide_vue3_pinia.md\":\"4c51a07c\",\"guide_vue3_proxy.md\":\"b05cbab3\"}")
<span class="line"><span style="color:#89DDFF;">};</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-c4b0d3cf data-v-face870a><!--[--><!--]--><div class="edit-info" data-v-face870a><div class="edit-link" data-v-face870a><a class="VPLink link edit-link-button" href="https://github.com/sunniejs/vue-h5-template/blob/docs/docs/guide/vue2/chunks.md" target="_blank" rel="noreferrer" data-v-face870a data-v-8f4dc553><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" aria-label="edit icon" data-v-face870a><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> 在GitHub编辑此页<!--]--><!----></a></div><div class="last-updated" data-v-face870a><p class="VPLastUpdated" data-v-face870a data-v-7b3ebfe1>Last updated: <time datetime="2024-11-11T09:04:24.000Z" data-v-7b3ebfe1></time></p></div></div><div class="prev-next" data-v-face870a><div class="pager" data-v-face870a><a class="pager-link prev" href="/vue-h5-template/guide/vue2/console.html" data-v-face870a><span class="desc" data-v-face870a>Previous page</span><span class="title" data-v-face870a>去掉 console.log</span></a></div><div class="has-prev pager" data-v-face870a><a class="pager-link next" href="/vue-h5-template/guide/vue2/ie.html" data-v-face870a><span class="desc" data-v-face870a>Next page</span><span class="title" data-v-face870a>添加 IE 兼容</span></a></div></div></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-b2cf3e0b data-v-2f86ebd2><div class="container" data-v-2f86ebd2><p class="message" data-v-2f86ebd2>Released under the MIT License.</p><p class="copyright" data-v-2f86ebd2>Copyright © 2022-present Fonghehe</p></div></footer><!--[--><!--]--></div></div>
<script>__VP_HASH_MAP__ = JSON.parse("{\"guide_about_index.md\":\"3268f72f\",\"guide_index.md\":\"46287c77\",\"guide_vue2_base.md\":\"bd933227\",\"guide_edit.md\":\"7944bd49\",\"guide_vue2_alias.md\":\"c0d9e31c\",\"guide_vue2_env.md\":\"71078dec\",\"guide_vue2_chunks.md\":\"93504c3d\",\"guide_vue3_axios.md\":\"0778382b\",\"guide_vue2_router.md\":\"369637ff\",\"guide_vue2_vant.md\":\"4ed27c84\",\"guide_vue2_vw.md\":\"f3d8795c\",\"guide_start.md\":\"634b98ba\",\"guide_vue3_i18n.md\":\"51f27eff\",\"guide_vue2_rem.md\":\"05f1a99e\",\"guide_vue3_pinia.md\":\"0d738d45\",\"guide_vue3_lint.md\":\"18663aed\",\"guide_vue3_start.md\":\"6f88b41c\",\"guide_vue3_proxy.md\":\"94d7124b\",\"guide_vue2_vuex.md\":\"399839b6\",\"guide_vue2_proxy.md\":\"0d483f53\",\"guide_vue3_base.md\":\"462dbdb9\",\"guide_vue2_console.md\":\"68673d37\",\"guide_other_index.md\":\"5aef07ec\",\"guide_vue2_bundle.md\":\"73aeb293\",\"guide_vue3_alias.md\":\"6e50bff0\",\"guide_vue2_sass.md\":\"3616d11c\",\"guide_vue2_start.md\":\"f6e40312\",\"guide_vue3_env.md\":\"b928542e\",\"guide_vue3_ui.md\":\"385fc808\",\"guide_vue3_viewport.md\":\"0ef62fba\",\"guide_vue3_router.md\":\"84936a90\",\"guide_vue2_lint.md\":\"94bcc728\",\"guide_vue2_axios.md\":\"f273628e\",\"guide_vue2_externals.md\":\"6744fb41\",\"guide_vue3_vite.md\":\"7a4b4162\",\"index.md\":\"b1dbb931\",\"guide_vue2_ie.md\":\"f5d567e9\"}")
__VP_SITE_DATA__ = JSON.parse("{\"lang\":\"zh-CN\",\"dir\":\"ltr\",\"title\":\"Vue-H5-Template\",\"description\":\"一个开箱即用的vue h5脚手架\",\"base\":\"/vue-h5-template/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"介绍\",\"link\":\"/guide/\"},{\"text\":\"加入我们\",\"link\":\"/guide/about/\"},{\"text\":\"github仓库\",\"link\":\"https://github.com/sunniejs/vue-h5-template\"}],\"sidebar\":[{\"text\":\"前言\",\"collapsible\":true,\"items\":[{\"text\":\"介绍\",\"link\":\"/guide/\"},{\"text\":\"快速上手\",\"link\":\"/guide/start\"},{\"text\":\"参与编辑\",\"link\":\"/guide/edit\"}]},{\"text\":\"vue3-template\",\"collapsible\":true,\"items\":[{\"text\":\"启动项目\",\"link\":\"/guide/vue3/start\"},{\"text\":\"vite.config.ts 基础配置\",\"link\":\"/guide/vue3/base\"},{\"text\":\"vite插件集成\",\"link\":\"/guide/vue3/vite\"},{\"text\":\"多环境变量\",\"link\":\"/guide/vue3/env\"},{\"text\":\"viewport 适配方案\",\"link\":\"/guide/vue3/viewport\"},{\"text\":\"UI组件库\",\"link\":\"/guide/vue3/ui\"},{\"text\":\"Pinia 状态管理\",\"link\":\"/guide/vue3/pinia\"},{\"text\":\"vue-router\",\"link\":\"/guide/vue3/router\"},{\"text\":\"axios 封装及接口管理\",\"link\":\"/guide/vue3/axios\"},{\"text\":\"alias\",\"link\":\"/guide/vue3/alias\"},{\"text\":\"proxy 跨域\",\"link\":\"/guide/vue3/proxy\"},{\"text\":\"多语言解决方案\",\"link\":\"/guide/vue3/i18n\"},{\"text\":\"统一开发规范\",\"link\":\"/guide/vue3/lint\"}]},{\"text\":\"vue2-template\",\"collapsible\":true,\"collapsed\":true,\"items\":[{\"text\":\"启动项目\",\"link\":\"/guide/vue2/start\"},{\"text\":\"多环境变量\",\"link\":\"/guide/vue2/env\"},{\"text\":\"rem 适配方案\",\"link\":\"/guide/vue2/rem\"},{\"text\":\"vw 适配方案\",\"link\":\"/guide/vue2/vw\"},{\"text\":\"VantUI 组件按需加载\",\"link\":\"/guide/vue2/vant\"},{\"text\":\"Sass 全局样式\",\"link\":\"/guide/vue2/sass\"},{\"text\":\"Vuex 状态管理\",\"link\":\"/guide/vue2/vuex\"},{\"text\":\"Vue-router\",\"link\":\"/guide/vue2/router\"},{\"text\":\"Axios 封装及接口管理\",\"link\":\"/guide/vue2/axios\"},{\"text\":\"vue.config.js 基础配置\",\"link\":\"/guide/vue2/base\"},{\"text\":\"配置 alias 别名\",\"link\":\"/guide/vue2/alias\"},{\"text\":\"配置 proxy 跨域\",\"link\":\"/guide/vue2/proxy\"},{\"text\":\"配置 打包分析\",\"link\":\"/guide/vue2/bundle\"},{\"text\":\"配置 externals 引入 cdn 资源\",\"link\":\"/guide/vue2/externals\"},{\"text\":\"去掉 console.log\",\"link\":\"/guide/vue2/console\"},{\"text\":\"splitChunks 打包第三方模块\",\"link\":\"/guide/vue2/chunks\"},{\"text\":\"添加 IE 兼容\",\"link\":\"/guide/vue2/ie\"},{\"text\":\"统一开发规范\",\"link\":\"/guide/vue2/lint\"}]},{\"text\":\"其他\",\"collapsible\":true,\"collapsed\":true,\"items\":[{\"text\":\"常见问题\",\"link\":\"/guide/other/\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/sunniejs/vue-h5-template\"}],\"editLink\":{\"pattern\":\"https://github.com/sunniejs/vue-h5-template/blob/docs/docs/:path\",\"text\":\"在GitHub编辑此页\"},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2022-present Fonghehe\"},\"algolia\":{\"appId\":\"CV2I8NGBKZ\",\"apiKey\":\"63c37a467485b00383daacf7340b4ca0\",\"indexName\":\"vue-h5-template\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}")</script>
</body>

8
guide/vue2/console.html
View File

@ -5,12 +5,12 @@
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>去掉 console.log | Vue-H5-Template</title>
<meta name="description" content="一个开箱即用的vue h5脚手架">
<link rel="preload stylesheet" href="/vue-h5-template/assets/style.82cfa615.css" as="style">
<link rel="preload stylesheet" href="/vue-h5-template/assets/style.16a63e98.css" as="style">
<script type="module" src="/vue-h5-template/assets/app.88821414.js"></script>
<link rel="preload" href="/vue-h5-template/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
<link rel="modulepreload" href="/vue-h5-template/assets/chunks/framework.6241eaf2.js">
<link rel="modulepreload" href="/vue-h5-template/assets/chunks/theme.c4d303ac.js">
<link rel="modulepreload" href="/vue-h5-template/assets/guide_vue2_console.md.51b49cb0.lean.js">
<link rel="modulepreload" href="/vue-h5-template/assets/guide_vue2_console.md.68673d37.lean.js">
<link rel="icon" href="/favicon.ico">
<script id="check-dark-light">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
</head>
@ -36,8 +36,8 @@
<span class="line"><span style="color:#89DDFF;">module.exports</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#F07178;">presets</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> [[</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">@vue/cli-plugin-babel/preset</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span><span style="color:#A6ACCD;"> </span><span style="color:#F07178;">useBuiltIns</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">entry</span><span style="color:#89DDFF;">&quot;</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">}</span><span style="color:#A6ACCD;">]]</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#A6ACCD;"> plugins</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#89DDFF;">};</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-c4b0d3cf data-v-face870a><!--[--><!--]--><div class="edit-info" data-v-face870a><div class="edit-link" data-v-face870a><a class="VPLink link edit-link-button" href="https://github.com/sunniejs/vue-h5-template/blob/docs/docs/guide/vue2/console.md" target="_blank" rel="noreferrer" data-v-face870a data-v-8f4dc553><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" aria-label="edit icon" data-v-face870a><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> 在GitHub编辑此页<!--]--><!----></a></div><div class="last-updated" data-v-face870a><p class="VPLastUpdated" data-v-face870a data-v-7b3ebfe1>Last updated: <time datetime="2023-06-26T10:49:15.000Z" data-v-7b3ebfe1></time></p></div></div><div class="prev-next" data-v-face870a><div class="pager" data-v-face870a><a class="pager-link prev" href="/vue-h5-template/guide/vue2/externals.html" data-v-face870a><span class="desc" data-v-face870a>Previous page</span><span class="title" data-v-face870a>配置 externals 引入 cdn 资源</span></a></div><div class="has-prev pager" data-v-face870a><a class="pager-link next" href="/vue-h5-template/guide/vue2/chunks.html" data-v-face870a><span class="desc" data-v-face870a>Next page</span><span class="title" data-v-face870a>splitChunks 打包第三方模块</span></a></div></div></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-b2cf3e0b data-v-2f86ebd2><div class="container" data-v-2f86ebd2><p class="message" data-v-2f86ebd2>Released under the MIT License.</p><p class="copyright" data-v-2f86ebd2>Copyright © 2022-present Fonghehe</p></div></footer><!--[--><!--]--></div></div>
<script>__VP_HASH_MAP__ = JSON.parse("{\"guide_other_index.md\":\"0962dd47\",\"guide_start.md\":\"18fddbf4\",\"guide_vue2_router.md\":\"d35b25e7\",\"guide_vue2_sass.md\":\"723a4859\",\"guide_vue2_start.md\":\"e13e8546\",\"guide_vue2_vant.md\":\"9252795d\",\"guide_vue3_lint.md\":\"b9504b63\",\"guide_vue3_start.md\":\"f354f662\",\"guide_vue3_ui.md\":\"cc6ae98b\",\"guide_vue3_viewport.md\":\"ad1a10ef\",\"guide_vue3_vite.md\":\"9ec8c052\",\"guide_index.md\":\"3a64f07e\",\"guide_vue2_vuex.md\":\"618230b5\",\"guide_vue2_vw.md\":\"ca9fc79f\",\"guide_vue3_alias.md\":\"d777bc16\",\"guide_vue3_base.md\":\"732de433\",\"guide_vue3_env.md\":\"83cf2a7e\",\"guide_vue2_rem.md\":\"769a5fda\",\"guide_about_index.md\":\"9cd5ee99\",\"guide_edit.md\":\"4c959ba5\",\"guide_vue2_axios.md\":\"a682218e\",\"guide_vue3_axios.md\":\"cd29cfa2\",\"guide_vue2_bundle.md\":\"2fe1a9fb\",\"guide_vue2_chunks.md\":\"0130f8b3\",\"guide_vue2_console.md\":\"51b49cb0\",\"guide_vue2_env.md\":\"c800a293\",\"guide_vue2_externals.md\":\"69c0669f\",\"index.md\":\"bd639346\",\"guide_vue3_i18n.md\":\"0436062d\",\"guide_vue2_base.md\":\"7d4266ed\",\"guide_vue2_ie.md\":\"83d021b7\",\"guide_vue2_lint.md\":\"d5070d4f\",\"guide_vue2_proxy.md\":\"f5f5a403\",\"guide_vue2_alias.md\":\"306b63fa\",\"guide_vue3_router.md\":\"bf1ddfb2\",\"guide_vue3_pinia.md\":\"4c51a07c\",\"guide_vue3_proxy.md\":\"b05cbab3\"}")
<span class="line"><span style="color:#89DDFF;">};</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-c4b0d3cf data-v-face870a><!--[--><!--]--><div class="edit-info" data-v-face870a><div class="edit-link" data-v-face870a><a class="VPLink link edit-link-button" href="https://github.com/sunniejs/vue-h5-template/blob/docs/docs/guide/vue2/console.md" target="_blank" rel="noreferrer" data-v-face870a data-v-8f4dc553><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" aria-label="edit icon" data-v-face870a><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> 在GitHub编辑此页<!--]--><!----></a></div><div class="last-updated" data-v-face870a><p class="VPLastUpdated" data-v-face870a data-v-7b3ebfe1>Last updated: <time datetime="2024-11-11T09:04:24.000Z" data-v-7b3ebfe1></time></p></div></div><div class="prev-next" data-v-face870a><div class="pager" data-v-face870a><a class="pager-link prev" href="/vue-h5-template/guide/vue2/externals.html" data-v-face870a><span class="desc" data-v-face870a>Previous page</span><span class="title" data-v-face870a>配置 externals 引入 cdn 资源</span></a></div><div class="has-prev pager" data-v-face870a><a class="pager-link next" href="/vue-h5-template/guide/vue2/chunks.html" data-v-face870a><span class="desc" data-v-face870a>Next page</span><span class="title" data-v-face870a>splitChunks 打包第三方模块</span></a></div></div></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-b2cf3e0b data-v-2f86ebd2><div class="container" data-v-2f86ebd2><p class="message" data-v-2f86ebd2>Released under the MIT License.</p><p class="copyright" data-v-2f86ebd2>Copyright © 2022-present Fonghehe</p></div></footer><!--[--><!--]--></div></div>
<script>__VP_HASH_MAP__ = JSON.parse("{\"guide_about_index.md\":\"3268f72f\",\"guide_index.md\":\"46287c77\",\"guide_vue2_base.md\":\"bd933227\",\"guide_edit.md\":\"7944bd49\",\"guide_vue2_alias.md\":\"c0d9e31c\",\"guide_vue2_env.md\":\"71078dec\",\"guide_vue2_chunks.md\":\"93504c3d\",\"guide_vue3_axios.md\":\"0778382b\",\"guide_vue2_router.md\":\"369637ff\",\"guide_vue2_vant.md\":\"4ed27c84\",\"guide_vue2_vw.md\":\"f3d8795c\",\"guide_start.md\":\"634b98ba\",\"guide_vue3_i18n.md\":\"51f27eff\",\"guide_vue2_rem.md\":\"05f1a99e\",\"guide_vue3_pinia.md\":\"0d738d45\",\"guide_vue3_lint.md\":\"18663aed\",\"guide_vue3_start.md\":\"6f88b41c\",\"guide_vue3_proxy.md\":\"94d7124b\",\"guide_vue2_vuex.md\":\"399839b6\",\"guide_vue2_proxy.md\":\"0d483f53\",\"guide_vue3_base.md\":\"462dbdb9\",\"guide_vue2_console.md\":\"68673d37\",\"guide_other_index.md\":\"5aef07ec\",\"guide_vue2_bundle.md\":\"73aeb293\",\"guide_vue3_alias.md\":\"6e50bff0\",\"guide_vue2_sass.md\":\"3616d11c\",\"guide_vue2_start.md\":\"f6e40312\",\"guide_vue3_env.md\":\"b928542e\",\"guide_vue3_ui.md\":\"385fc808\",\"guide_vue3_viewport.md\":\"0ef62fba\",\"guide_vue3_router.md\":\"84936a90\",\"guide_vue2_lint.md\":\"94bcc728\",\"guide_vue2_axios.md\":\"f273628e\",\"guide_vue2_externals.md\":\"6744fb41\",\"guide_vue3_vite.md\":\"7a4b4162\",\"index.md\":\"b1dbb931\",\"guide_vue2_ie.md\":\"f5d567e9\"}")
__VP_SITE_DATA__ = JSON.parse("{\"lang\":\"zh-CN\",\"dir\":\"ltr\",\"title\":\"Vue-H5-Template\",\"description\":\"一个开箱即用的vue h5脚手架\",\"base\":\"/vue-h5-template/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"介绍\",\"link\":\"/guide/\"},{\"text\":\"加入我们\",\"link\":\"/guide/about/\"},{\"text\":\"github仓库\",\"link\":\"https://github.com/sunniejs/vue-h5-template\"}],\"sidebar\":[{\"text\":\"前言\",\"collapsible\":true,\"items\":[{\"text\":\"介绍\",\"link\":\"/guide/\"},{\"text\":\"快速上手\",\"link\":\"/guide/start\"},{\"text\":\"参与编辑\",\"link\":\"/guide/edit\"}]},{\"text\":\"vue3-template\",\"collapsible\":true,\"items\":[{\"text\":\"启动项目\",\"link\":\"/guide/vue3/start\"},{\"text\":\"vite.config.ts 基础配置\",\"link\":\"/guide/vue3/base\"},{\"text\":\"vite插件集成\",\"link\":\"/guide/vue3/vite\"},{\"text\":\"多环境变量\",\"link\":\"/guide/vue3/env\"},{\"text\":\"viewport 适配方案\",\"link\":\"/guide/vue3/viewport\"},{\"text\":\"UI组件库\",\"link\":\"/guide/vue3/ui\"},{\"text\":\"Pinia 状态管理\",\"link\":\"/guide/vue3/pinia\"},{\"text\":\"vue-router\",\"link\":\"/guide/vue3/router\"},{\"text\":\"axios 封装及接口管理\",\"link\":\"/guide/vue3/axios\"},{\"text\":\"alias\",\"link\":\"/guide/vue3/alias\"},{\"text\":\"proxy 跨域\",\"link\":\"/guide/vue3/proxy\"},{\"text\":\"多语言解决方案\",\"link\":\"/guide/vue3/i18n\"},{\"text\":\"统一开发规范\",\"link\":\"/guide/vue3/lint\"}]},{\"text\":\"vue2-template\",\"collapsible\":true,\"collapsed\":true,\"items\":[{\"text\":\"启动项目\",\"link\":\"/guide/vue2/start\"},{\"text\":\"多环境变量\",\"link\":\"/guide/vue2/env\"},{\"text\":\"rem 适配方案\",\"link\":\"/guide/vue2/rem\"},{\"text\":\"vw 适配方案\",\"link\":\"/guide/vue2/vw\"},{\"text\":\"VantUI 组件按需加载\",\"link\":\"/guide/vue2/vant\"},{\"text\":\"Sass 全局样式\",\"link\":\"/guide/vue2/sass\"},{\"text\":\"Vuex 状态管理\",\"link\":\"/guide/vue2/vuex\"},{\"text\":\"Vue-router\",\"link\":\"/guide/vue2/router\"},{\"text\":\"Axios 封装及接口管理\",\"link\":\"/guide/vue2/axios\"},{\"text\":\"vue.config.js 基础配置\",\"link\":\"/guide/vue2/base\"},{\"text\":\"配置 alias 别名\",\"link\":\"/guide/vue2/alias\"},{\"text\":\"配置 proxy 跨域\",\"link\":\"/guide/vue2/proxy\"},{\"text\":\"配置 打包分析\",\"link\":\"/guide/vue2/bundle\"},{\"text\":\"配置 externals 引入 cdn 资源\",\"link\":\"/guide/vue2/externals\"},{\"text\":\"去掉 console.log\",\"link\":\"/guide/vue2/console\"},{\"text\":\"splitChunks 打包第三方模块\",\"link\":\"/guide/vue2/chunks\"},{\"text\":\"添加 IE 兼容\",\"link\":\"/guide/vue2/ie\"},{\"text\":\"统一开发规范\",\"link\":\"/guide/vue2/lint\"}]},{\"text\":\"其他\",\"collapsible\":true,\"collapsed\":true,\"items\":[{\"text\":\"常见问题\",\"link\":\"/guide/other/\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/sunniejs/vue-h5-template\"}],\"editLink\":{\"pattern\":\"https://github.com/sunniejs/vue-h5-template/blob/docs/docs/:path\",\"text\":\"在GitHub编辑此页\"},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2022-present Fonghehe\"},\"algolia\":{\"appId\":\"CV2I8NGBKZ\",\"apiKey\":\"63c37a467485b00383daacf7340b4ca0\",\"indexName\":\"vue-h5-template\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}")</script>
</body>

12
guide/vue2/env.html
View File

@ -5,12 +5,12 @@
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>配置多环境变量 | Vue-H5-Template</title>
<meta name="description" content="一个开箱即用的vue h5脚手架">
<link rel="preload stylesheet" href="/vue-h5-template/assets/style.82cfa615.css" as="style">
<link rel="preload stylesheet" href="/vue-h5-template/assets/style.16a63e98.css" as="style">
<script type="module" src="/vue-h5-template/assets/app.88821414.js"></script>
<link rel="preload" href="/vue-h5-template/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
<link rel="modulepreload" href="/vue-h5-template/assets/chunks/framework.6241eaf2.js">
<link rel="modulepreload" href="/vue-h5-template/assets/chunks/theme.c4d303ac.js">
<link rel="modulepreload" href="/vue-h5-template/assets/guide_vue2_env.md.c800a293.lean.js">
<link rel="modulepreload" href="/vue-h5-template/assets/guide_vue2_env.md.71078dec.lean.js">
<link rel="icon" href="/favicon.ico">
<script id="check-dark-light">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
</head>
@ -19,13 +19,13 @@
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#F07178;">serve</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">vue-cli-service serve --open</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#F07178;">stage</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">vue-cli-service build --mode staging</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#F07178;">build</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">vue-cli-service build</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#89DDFF;">}</span></span></code></pre></div><h5 id="配置介绍" tabindex="-1">配置介绍 <a class="header-anchor" href="#配置介绍" aria-label="Permalink to &quot;配置介绍&quot;">​</a></h5><p>  以 <code>VUE_APP_</code> 开头的变量，在代码中可以通过 <code>p<wbr>rocess.env.VUE_APP_</code> 访问。<br>   比如,<code>VUE_APP_ENV = &#39;development&#39;</code> 通过<code>p<wbr>rocess.env.VUE_APP_ENV</code> 访问。<br>   除了 <code>VUE_APP_*</code> 变量之外，在你的应用代码中始终可用的还有两个特殊的变量<code>NODE_ENV</code> 和<code>BASE_URL</code></p><p>在项目根目录中新建<code>.env.*</code></p><ul><li>.env.development 本地开发环境配置</li></ul><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#A6ACCD;">NODE_ENV</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">development</span><span style="color:#89DDFF;">&#39;</span></span>
<span class="line"><span style="color:#89DDFF;">}</span></span></code></pre></div><h5 id="配置介绍" tabindex="-1">配置介绍 <a class="header-anchor" href="#配置介绍" aria-label="Permalink to &quot;配置介绍&quot;">​</a></h5><p>  以 <code>VUE_APP_</code> 开头的变量，在代码中可以通过 <code>p<wbr>rocess.env.VUE_APP_</code> 访问。   比如：<code>VUE_APP_ENV = &#39;development&#39;</code> 通过 <code>p<wbr>rocess.env.VUE_APP_ENV</code> 访问。   当然，除了 <code>VUE_APP_*</code> 变量之外，在你的应用代码中始终可用的还有两个特殊的变量<code>NODE_ENV</code> 和<code>BASE_URL</code></p><p>在项目根目录中新建<code>.env.*</code></p><ul><li>.env.development 本地开发环境配置</li></ul><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#A6ACCD;">NODE_ENV</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">development</span><span style="color:#89DDFF;">&#39;</span></span>
<span class="line"><span style="color:#676E95;font-style:italic;"># must start with VUE_APP_</span></span>
<span class="line"><span style="color:#FFCB6B;">VUE_APP_ENV</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">development</span><span style="color:#89DDFF;">&#39;</span></span></code></pre></div><ul><li>.env.staging 测试环境配置</li></ul><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#A6ACCD;">NODE_ENV</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">production</span><span style="color:#89DDFF;">&#39;</span></span>
<span class="line"><span style="color:#676E95;font-style:italic;"># must start with VUE_APP_</span></span>
<span class="line"><span style="color:#FFCB6B;">VUE_APP_ENV</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">staging</span><span style="color:#89DDFF;">&#39;</span></span></code></pre></div><ul><li>.env.production 正式环境配置</li></ul><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#A6ACCD;">NODE_ENV</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">production</span><span style="color:#89DDFF;">&#39;</span></span>
<span class="line"><span style="color:#676E95;font-style:italic;"># must start with VUE_APP_</span></span>
<span class="line"><span style="color:#FFCB6B;">VUE_APP_ENV</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">production</span><span style="color:#89DDFF;">&#39;</span></span></code></pre></div><p>这里我们并没有定义很多变量，只定义了基础的 VUE_APP_ENV <code>development</code> <code>staging</code> <code>production</code><br> 变量我们统一在 <code>src/config/env.*.js</code> 里进行管理。</p><p>这里有个问题，既然这里有了根据不同环境设置变量的文件，为什么还要去 config 下新建三个对应的文件呢？<br><strong>修改起来方便，不需 要重启项目，符合开发习惯。</strong></p><p>config/index.js</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// 根据环境引入不同配置 p<wbr>rocess.env.NODE_ENV</span></span>
<span class="line"><span style="color:#FFCB6B;">VUE_APP_ENV</span><span style="color:#A6ACCD;"> </span><span style="color:#C3E88D;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">production</span><span style="color:#89DDFF;">&#39;</span></span></code></pre></div><p>这里我们并没有定义很多变量，只定义了基础的 VUE_APP_ENV <code>development</code> <code>staging</code> <code>production</code> 变量我们统一在 <code>src/config/env.*.js</code> 里进行管理。</p><p>这里有个问题，既然这里有了根据不同环境设置变量的文件，为什么还要去 config 下新建三个对应的文件呢？ <strong>修改起来方便，不需 要重启项目，符合开发习惯。</strong></p><p>config/index.js</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// 根据环境引入不同配置 p<wbr>rocess.env.NODE_ENV</span></span>
<span class="line"><span style="color:#C792EA;">const</span><span style="color:#A6ACCD;"> config </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#82AAFF;">require</span><span style="color:#A6ACCD;">(</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">./env.</span><span style="color:#89DDFF;">&quot;</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">+</span><span style="color:#A6ACCD;"> process</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">env</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">VUE_APP_ENV)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;">module.exports</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> config</span><span style="color:#89DDFF;">;</span></span></code></pre></div><p>配置对应环境的变量，拿本地环境文件 <code>env.development.js</code> 举例，用户可以根据需求修改</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// 本地环境配置</span></span>
<span class="line"><span style="color:#89DDFF;">module.exports</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
@ -36,8 +36,8 @@
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#F07178;">APPSECRET</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">xxx</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#89DDFF;">};</span></span></code></pre></div><p>根据环境不同，变量就会不同了</p><div class="language-javascript"><button title="Copy Code" class="copy"></button><span class="lang">javascript</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// 根据环境不同引入不同baseApi地址</span></span>
<span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">baseApi</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">}</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">@/config</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#A6ACCD;">console</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">log</span><span style="color:#A6ACCD;">(baseApi)</span><span style="color:#89DDFF;">;</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-c4b0d3cf data-v-face870a><!--[--><!--]--><div class="edit-info" data-v-face870a><div class="edit-link" data-v-face870a><a class="VPLink link edit-link-button" href="https://github.com/sunniejs/vue-h5-template/blob/docs/docs/guide/vue2/env.md" target="_blank" rel="noreferrer" data-v-face870a data-v-8f4dc553><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" aria-label="edit icon" data-v-face870a><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> 在GitHub编辑此页<!--]--><!----></a></div><div class="last-updated" data-v-face870a><p class="VPLastUpdated" data-v-face870a data-v-7b3ebfe1>Last updated: <time datetime="2023-06-26T10:49:15.000Z" data-v-7b3ebfe1></time></p></div></div><div class="prev-next" data-v-face870a><div class="pager" data-v-face870a><a class="pager-link prev" href="/vue-h5-template/guide/vue2/start.html" data-v-face870a><span class="desc" data-v-face870a>Previous page</span><span class="title" data-v-face870a>启动项目</span></a></div><div class="has-prev pager" data-v-face870a><a class="pager-link next" href="/vue-h5-template/guide/vue2/rem.html" data-v-face870a><span class="desc" data-v-face870a>Next page</span><span class="title" data-v-face870a>rem 适配方案</span></a></div></div></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-b2cf3e0b data-v-2f86ebd2><div class="container" data-v-2f86ebd2><p class="message" data-v-2f86ebd2>Released under the MIT License.</p><p class="copyright" data-v-2f86ebd2>Copyright © 2022-present Fonghehe</p></div></footer><!--[--><!--]--></div></div>
<script>__VP_HASH_MAP__ = JSON.parse("{\"guide_other_index.md\":\"0962dd47\",\"guide_start.md\":\"18fddbf4\",\"guide_vue2_router.md\":\"d35b25e7\",\"guide_vue2_sass.md\":\"723a4859\",\"guide_vue2_start.md\":\"e13e8546\",\"guide_vue2_vant.md\":\"9252795d\",\"guide_vue3_lint.md\":\"b9504b63\",\"guide_vue3_start.md\":\"f354f662\",\"guide_vue3_ui.md\":\"cc6ae98b\",\"guide_vue3_viewport.md\":\"ad1a10ef\",\"guide_vue3_vite.md\":\"9ec8c052\",\"guide_index.md\":\"3a64f07e\",\"guide_vue2_vuex.md\":\"618230b5\",\"guide_vue2_vw.md\":\"ca9fc79f\",\"guide_vue3_alias.md\":\"d777bc16\",\"guide_vue3_base.md\":\"732de433\",\"guide_vue3_env.md\":\"83cf2a7e\",\"guide_vue2_rem.md\":\"769a5fda\",\"guide_about_index.md\":\"9cd5ee99\",\"guide_edit.md\":\"4c959ba5\",\"guide_vue2_axios.md\":\"a682218e\",\"guide_vue3_axios.md\":\"cd29cfa2\",\"guide_vue2_bundle.md\":\"2fe1a9fb\",\"guide_vue2_chunks.md\":\"0130f8b3\",\"guide_vue2_console.md\":\"51b49cb0\",\"guide_vue2_env.md\":\"c800a293\",\"guide_vue2_externals.md\":\"69c0669f\",\"index.md\":\"bd639346\",\"guide_vue3_i18n.md\":\"0436062d\",\"guide_vue2_base.md\":\"7d4266ed\",\"guide_vue2_ie.md\":\"83d021b7\",\"guide_vue2_lint.md\":\"d5070d4f\",\"guide_vue2_proxy.md\":\"f5f5a403\",\"guide_vue2_alias.md\":\"306b63fa\",\"guide_vue3_router.md\":\"bf1ddfb2\",\"guide_vue3_pinia.md\":\"4c51a07c\",\"guide_vue3_proxy.md\":\"b05cbab3\"}")
<span class="line"><span style="color:#A6ACCD;">console</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">log</span><span style="color:#A6ACCD;">(baseApi)</span><span style="color:#89DDFF;">;</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-c4b0d3cf data-v-face870a><!--[--><!--]--><div class="edit-info" data-v-face870a><div class="edit-link" data-v-face870a><a class="VPLink link edit-link-button" href="https://github.com/sunniejs/vue-h5-template/blob/docs/docs/guide/vue2/env.md" target="_blank" rel="noreferrer" data-v-face870a data-v-8f4dc553><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" aria-label="edit icon" data-v-face870a><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> 在GitHub编辑此页<!--]--><!----></a></div><div class="last-updated" data-v-face870a><p class="VPLastUpdated" data-v-face870a data-v-7b3ebfe1>Last updated: <time datetime="2024-11-11T09:04:24.000Z" data-v-7b3ebfe1></time></p></div></div><div class="prev-next" data-v-face870a><div class="pager" data-v-face870a><a class="pager-link prev" href="/vue-h5-template/guide/vue2/start.html" data-v-face870a><span class="desc" data-v-face870a>Previous page</span><span class="title" data-v-face870a>启动项目</span></a></div><div class="has-prev pager" data-v-face870a><a class="pager-link next" href="/vue-h5-template/guide/vue2/rem.html" data-v-face870a><span class="desc" data-v-face870a>Next page</span><span class="title" data-v-face870a>rem 适配方案</span></a></div></div></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-b2cf3e0b data-v-2f86ebd2><div class="container" data-v-2f86ebd2><p class="message" data-v-2f86ebd2>Released under the MIT License.</p><p class="copyright" data-v-2f86ebd2>Copyright © 2022-present Fonghehe</p></div></footer><!--[--><!--]--></div></div>
<script>__VP_HASH_MAP__ = JSON.parse("{\"guide_about_index.md\":\"3268f72f\",\"guide_index.md\":\"46287c77\",\"guide_vue2_base.md\":\"bd933227\",\"guide_edit.md\":\"7944bd49\",\"guide_vue2_alias.md\":\"c0d9e31c\",\"guide_vue2_env.md\":\"71078dec\",\"guide_vue2_chunks.md\":\"93504c3d\",\"guide_vue3_axios.md\":\"0778382b\",\"guide_vue2_router.md\":\"369637ff\",\"guide_vue2_vant.md\":\"4ed27c84\",\"guide_vue2_vw.md\":\"f3d8795c\",\"guide_start.md\":\"634b98ba\",\"guide_vue3_i18n.md\":\"51f27eff\",\"guide_vue2_rem.md\":\"05f1a99e\",\"guide_vue3_pinia.md\":\"0d738d45\",\"guide_vue3_lint.md\":\"18663aed\",\"guide_vue3_start.md\":\"6f88b41c\",\"guide_vue3_proxy.md\":\"94d7124b\",\"guide_vue2_vuex.md\":\"399839b6\",\"guide_vue2_proxy.md\":\"0d483f53\",\"guide_vue3_base.md\":\"462dbdb9\",\"guide_vue2_console.md\":\"68673d37\",\"guide_other_index.md\":\"5aef07ec\",\"guide_vue2_bundle.md\":\"73aeb293\",\"guide_vue3_alias.md\":\"6e50bff0\",\"guide_vue2_sass.md\":\"3616d11c\",\"guide_vue2_start.md\":\"f6e40312\",\"guide_vue3_env.md\":\"b928542e\",\"guide_vue3_ui.md\":\"385fc808\",\"guide_vue3_viewport.md\":\"0ef62fba\",\"guide_vue3_router.md\":\"84936a90\",\"guide_vue2_lint.md\":\"94bcc728\",\"guide_vue2_axios.md\":\"f273628e\",\"guide_vue2_externals.md\":\"6744fb41\",\"guide_vue3_vite.md\":\"7a4b4162\",\"index.md\":\"b1dbb931\",\"guide_vue2_ie.md\":\"f5d567e9\"}")
__VP_SITE_DATA__ = JSON.parse("{\"lang\":\"zh-CN\",\"dir\":\"ltr\",\"title\":\"Vue-H5-Template\",\"description\":\"一个开箱即用的vue h5脚手架\",\"base\":\"/vue-h5-template/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"介绍\",\"link\":\"/guide/\"},{\"text\":\"加入我们\",\"link\":\"/guide/about/\"},{\"text\":\"github仓库\",\"link\":\"https://github.com/sunniejs/vue-h5-template\"}],\"sidebar\":[{\"text\":\"前言\",\"collapsible\":true,\"items\":[{\"text\":\"介绍\",\"link\":\"/guide/\"},{\"text\":\"快速上手\",\"link\":\"/guide/start\"},{\"text\":\"参与编辑\",\"link\":\"/guide/edit\"}]},{\"text\":\"vue3-template\",\"collapsible\":true,\"items\":[{\"text\":\"启动项目\",\"link\":\"/guide/vue3/start\"},{\"text\":\"vite.config.ts 基础配置\",\"link\":\"/guide/vue3/base\"},{\"text\":\"vite插件集成\",\"link\":\"/guide/vue3/vite\"},{\"text\":\"多环境变量\",\"link\":\"/guide/vue3/env\"},{\"text\":\"viewport 适配方案\",\"link\":\"/guide/vue3/viewport\"},{\"text\":\"UI组件库\",\"link\":\"/guide/vue3/ui\"},{\"text\":\"Pinia 状态管理\",\"link\":\"/guide/vue3/pinia\"},{\"text\":\"vue-router\",\"link\":\"/guide/vue3/router\"},{\"text\":\"axios 封装及接口管理\",\"link\":\"/guide/vue3/axios\"},{\"text\":\"alias\",\"link\":\"/guide/vue3/alias\"},{\"text\":\"proxy 跨域\",\"link\":\"/guide/vue3/proxy\"},{\"text\":\"多语言解决方案\",\"link\":\"/guide/vue3/i18n\"},{\"text\":\"统一开发规范\",\"link\":\"/guide/vue3/lint\"}]},{\"text\":\"vue2-template\",\"collapsible\":true,\"collapsed\":true,\"items\":[{\"text\":\"启动项目\",\"link\":\"/guide/vue2/start\"},{\"text\":\"多环境变量\",\"link\":\"/guide/vue2/env\"},{\"text\":\"rem 适配方案\",\"link\":\"/guide/vue2/rem\"},{\"text\":\"vw 适配方案\",\"link\":\"/guide/vue2/vw\"},{\"text\":\"VantUI 组件按需加载\",\"link\":\"/guide/vue2/vant\"},{\"text\":\"Sass 全局样式\",\"link\":\"/guide/vue2/sass\"},{\"text\":\"Vuex 状态管理\",\"link\":\"/guide/vue2/vuex\"},{\"text\":\"Vue-router\",\"link\":\"/guide/vue2/router\"},{\"text\":\"Axios 封装及接口管理\",\"link\":\"/guide/vue2/axios\"},{\"text\":\"vue.config.js 基础配置\",\"link\":\"/guide/vue2/base\"},{\"text\":\"配置 alias 别名\",\"link\":\"/guide/vue2/alias\"},{\"text\":\"配置 proxy 跨域\",\"link\":\"/guide/vue2/proxy\"},{\"text\":\"配置 打包分析\",\"link\":\"/guide/vue2/bundle\"},{\"text\":\"配置 externals 引入 cdn 资源\",\"link\":\"/guide/vue2/externals\"},{\"text\":\"去掉 console.log\",\"link\":\"/guide/vue2/console\"},{\"text\":\"splitChunks 打包第三方模块\",\"link\":\"/guide/vue2/chunks\"},{\"text\":\"添加 IE 兼容\",\"link\":\"/guide/vue2/ie\"},{\"text\":\"统一开发规范\",\"link\":\"/guide/vue2/lint\"}]},{\"text\":\"其他\",\"collapsible\":true,\"collapsed\":true,\"items\":[{\"text\":\"常见问题\",\"link\":\"/guide/other/\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/sunniejs/vue-h5-template\"}],\"editLink\":{\"pattern\":\"https://github.com/sunniejs/vue-h5-template/blob/docs/docs/:path\",\"text\":\"在GitHub编辑此页\"},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2022-present Fonghehe\"},\"algolia\":{\"appId\":\"CV2I8NGBKZ\",\"apiKey\":\"63c37a467485b00383daacf7340b4ca0\",\"indexName\":\"vue-h5-template\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}")</script>
</body>

10
guide/vue2/externals.html
View File

File diff suppressed because one or more lines are too long

8
guide/vue2/ie.html
View File

@ -5,12 +5,12 @@
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>添加 IE 兼容 | Vue-H5-Template</title>
<meta name="description" content="一个开箱即用的vue h5脚手架">
<link rel="preload stylesheet" href="/vue-h5-template/assets/style.82cfa615.css" as="style">
<link rel="preload stylesheet" href="/vue-h5-template/assets/style.16a63e98.css" as="style">
<script type="module" src="/vue-h5-template/assets/app.88821414.js"></script>
<link rel="preload" href="/vue-h5-template/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
<link rel="modulepreload" href="/vue-h5-template/assets/chunks/framework.6241eaf2.js">
<link rel="modulepreload" href="/vue-h5-template/assets/chunks/theme.c4d303ac.js">
<link rel="modulepreload" href="/vue-h5-template/assets/guide_vue2_ie.md.83d021b7.lean.js">
<link rel="modulepreload" href="/vue-h5-template/assets/guide_vue2_ie.md.f5d567e9.lean.js">
<link rel="icon" href="/favicon.ico">
<script id="check-dark-light">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
</head>
@ -25,8 +25,8 @@
<span class="line"><span style="color:#A6ACCD;"> [</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">@vue/cli-plugin-babel/preset</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span><span style="color:#A6ACCD;"> </span><span style="color:#F07178;">useBuiltIns</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">usage</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#F07178;">corejs</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#F78C6C;">3</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">}</span><span style="color:#A6ACCD;">]</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#A6ACCD;"> ]</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#A6ACCD;"> plugins</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#89DDFF;">};</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-c4b0d3cf data-v-face870a><!--[--><!--]--><div class="edit-info" data-v-face870a><div class="edit-link" data-v-face870a><a class="VPLink link edit-link-button" href="https://github.com/sunniejs/vue-h5-template/blob/docs/docs/guide/vue2/ie.md" target="_blank" rel="noreferrer" data-v-face870a data-v-8f4dc553><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" aria-label="edit icon" data-v-face870a><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> 在GitHub编辑此页<!--]--><!----></a></div><div class="last-updated" data-v-face870a><p class="VPLastUpdated" data-v-face870a data-v-7b3ebfe1>Last updated: <time datetime="2023-06-26T10:49:15.000Z" data-v-7b3ebfe1></time></p></div></div><div class="prev-next" data-v-face870a><div class="pager" data-v-face870a><a class="pager-link prev" href="/vue-h5-template/guide/vue2/chunks.html" data-v-face870a><span class="desc" data-v-face870a>Previous page</span><span class="title" data-v-face870a>splitChunks 打包第三方模块</span></a></div><div class="has-prev pager" data-v-face870a><a class="pager-link next" href="/vue-h5-template/guide/vue2/lint.html" data-v-face870a><span class="desc" data-v-face870a>Next page</span><span class="title" data-v-face870a>统一开发规范</span></a></div></div></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-b2cf3e0b data-v-2f86ebd2><div class="container" data-v-2f86ebd2><p class="message" data-v-2f86ebd2>Released under the MIT License.</p><p class="copyright" data-v-2f86ebd2>Copyright © 2022-present Fonghehe</p></div></footer><!--[--><!--]--></div></div>
<script>__VP_HASH_MAP__ = JSON.parse("{\"guide_other_index.md\":\"0962dd47\",\"guide_start.md\":\"18fddbf4\",\"guide_vue2_router.md\":\"d35b25e7\",\"guide_vue2_sass.md\":\"723a4859\",\"guide_vue2_start.md\":\"e13e8546\",\"guide_vue2_vant.md\":\"9252795d\",\"guide_vue3_lint.md\":\"b9504b63\",\"guide_vue3_start.md\":\"f354f662\",\"guide_vue3_ui.md\":\"cc6ae98b\",\"guide_vue3_viewport.md\":\"ad1a10ef\",\"guide_vue3_vite.md\":\"9ec8c052\",\"guide_index.md\":\"3a64f07e\",\"guide_vue2_vuex.md\":\"618230b5\",\"guide_vue2_vw.md\":\"ca9fc79f\",\"guide_vue3_alias.md\":\"d777bc16\",\"guide_vue3_base.md\":\"732de433\",\"guide_vue3_env.md\":\"83cf2a7e\",\"guide_vue2_rem.md\":\"769a5fda\",\"guide_about_index.md\":\"9cd5ee99\",\"guide_edit.md\":\"4c959ba5\",\"guide_vue2_axios.md\":\"a682218e\",\"guide_vue3_axios.md\":\"cd29cfa2\",\"guide_vue2_bundle.md\":\"2fe1a9fb\",\"guide_vue2_chunks.md\":\"0130f8b3\",\"guide_vue2_console.md\":\"51b49cb0\",\"guide_vue2_env.md\":\"c800a293\",\"guide_vue2_externals.md\":\"69c0669f\",\"index.md\":\"bd639346\",\"guide_vue3_i18n.md\":\"0436062d\",\"guide_vue2_base.md\":\"7d4266ed\",\"guide_vue2_ie.md\":\"83d021b7\",\"guide_vue2_lint.md\":\"d5070d4f\",\"guide_vue2_proxy.md\":\"f5f5a403\",\"guide_vue2_alias.md\":\"306b63fa\",\"guide_vue3_router.md\":\"bf1ddfb2\",\"guide_vue3_pinia.md\":\"4c51a07c\",\"guide_vue3_proxy.md\":\"b05cbab3\"}")
<span class="line"><span style="color:#89DDFF;">};</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-c4b0d3cf data-v-face870a><!--[--><!--]--><div class="edit-info" data-v-face870a><div class="edit-link" data-v-face870a><a class="VPLink link edit-link-button" href="https://github.com/sunniejs/vue-h5-template/blob/docs/docs/guide/vue2/ie.md" target="_blank" rel="noreferrer" data-v-face870a data-v-8f4dc553><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" aria-label="edit icon" data-v-face870a><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> 在GitHub编辑此页<!--]--><!----></a></div><div class="last-updated" data-v-face870a><p class="VPLastUpdated" data-v-face870a data-v-7b3ebfe1>Last updated: <time datetime="2024-11-11T09:04:24.000Z" data-v-7b3ebfe1></time></p></div></div><div class="prev-next" data-v-face870a><div class="pager" data-v-face870a><a class="pager-link prev" href="/vue-h5-template/guide/vue2/chunks.html" data-v-face870a><span class="desc" data-v-face870a>Previous page</span><span class="title" data-v-face870a>splitChunks 打包第三方模块</span></a></div><div class="has-prev pager" data-v-face870a><a class="pager-link next" href="/vue-h5-template/guide/vue2/lint.html" data-v-face870a><span class="desc" data-v-face870a>Next page</span><span class="title" data-v-face870a>统一开发规范</span></a></div></div></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-b2cf3e0b data-v-2f86ebd2><div class="container" data-v-2f86ebd2><p class="message" data-v-2f86ebd2>Released under the MIT License.</p><p class="copyright" data-v-2f86ebd2>Copyright © 2022-present Fonghehe</p></div></footer><!--[--><!--]--></div></div>
<script>__VP_HASH_MAP__ = JSON.parse("{\"guide_about_index.md\":\"3268f72f\",\"guide_index.md\":\"46287c77\",\"guide_vue2_base.md\":\"bd933227\",\"guide_edit.md\":\"7944bd49\",\"guide_vue2_alias.md\":\"c0d9e31c\",\"guide_vue2_env.md\":\"71078dec\",\"guide_vue2_chunks.md\":\"93504c3d\",\"guide_vue3_axios.md\":\"0778382b\",\"guide_vue2_router.md\":\"369637ff\",\"guide_vue2_vant.md\":\"4ed27c84\",\"guide_vue2_vw.md\":\"f3d8795c\",\"guide_start.md\":\"634b98ba\",\"guide_vue3_i18n.md\":\"51f27eff\",\"guide_vue2_rem.md\":\"05f1a99e\",\"guide_vue3_pinia.md\":\"0d738d45\",\"guide_vue3_lint.md\":\"18663aed\",\"guide_vue3_start.md\":\"6f88b41c\",\"guide_vue3_proxy.md\":\"94d7124b\",\"guide_vue2_vuex.md\":\"399839b6\",\"guide_vue2_proxy.md\":\"0d483f53\",\"guide_vue3_base.md\":\"462dbdb9\",\"guide_vue2_console.md\":\"68673d37\",\"guide_other_index.md\":\"5aef07ec\",\"guide_vue2_bundle.md\":\"73aeb293\",\"guide_vue3_alias.md\":\"6e50bff0\",\"guide_vue2_sass.md\":\"3616d11c\",\"guide_vue2_start.md\":\"f6e40312\",\"guide_vue3_env.md\":\"b928542e\",\"guide_vue3_ui.md\":\"385fc808\",\"guide_vue3_viewport.md\":\"0ef62fba\",\"guide_vue3_router.md\":\"84936a90\",\"guide_vue2_lint.md\":\"94bcc728\",\"guide_vue2_axios.md\":\"f273628e\",\"guide_vue2_externals.md\":\"6744fb41\",\"guide_vue3_vite.md\":\"7a4b4162\",\"index.md\":\"b1dbb931\",\"guide_vue2_ie.md\":\"f5d567e9\"}")
__VP_SITE_DATA__ = JSON.parse("{\"lang\":\"zh-CN\",\"dir\":\"ltr\",\"title\":\"Vue-H5-Template\",\"description\":\"一个开箱即用的vue h5脚手架\",\"base\":\"/vue-h5-template/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"介绍\",\"link\":\"/guide/\"},{\"text\":\"加入我们\",\"link\":\"/guide/about/\"},{\"text\":\"github仓库\",\"link\":\"https://github.com/sunniejs/vue-h5-template\"}],\"sidebar\":[{\"text\":\"前言\",\"collapsible\":true,\"items\":[{\"text\":\"介绍\",\"link\":\"/guide/\"},{\"text\":\"快速上手\",\"link\":\"/guide/start\"},{\"text\":\"参与编辑\",\"link\":\"/guide/edit\"}]},{\"text\":\"vue3-template\",\"collapsible\":true,\"items\":[{\"text\":\"启动项目\",\"link\":\"/guide/vue3/start\"},{\"text\":\"vite.config.ts 基础配置\",\"link\":\"/guide/vue3/base\"},{\"text\":\"vite插件集成\",\"link\":\"/guide/vue3/vite\"},{\"text\":\"多环境变量\",\"link\":\"/guide/vue3/env\"},{\"text\":\"viewport 适配方案\",\"link\":\"/guide/vue3/viewport\"},{\"text\":\"UI组件库\",\"link\":\"/guide/vue3/ui\"},{\"text\":\"Pinia 状态管理\",\"link\":\"/guide/vue3/pinia\"},{\"text\":\"vue-router\",\"link\":\"/guide/vue3/router\"},{\"text\":\"axios 封装及接口管理\",\"link\":\"/guide/vue3/axios\"},{\"text\":\"alias\",\"link\":\"/guide/vue3/alias\"},{\"text\":\"proxy 跨域\",\"link\":\"/guide/vue3/proxy\"},{\"text\":\"多语言解决方案\",\"link\":\"/guide/vue3/i18n\"},{\"text\":\"统一开发规范\",\"link\":\"/guide/vue3/lint\"}]},{\"text\":\"vue2-template\",\"collapsible\":true,\"collapsed\":true,\"items\":[{\"text\":\"启动项目\",\"link\":\"/guide/vue2/start\"},{\"text\":\"多环境变量\",\"link\":\"/guide/vue2/env\"},{\"text\":\"rem 适配方案\",\"link\":\"/guide/vue2/rem\"},{\"text\":\"vw 适配方案\",\"link\":\"/guide/vue2/vw\"},{\"text\":\"VantUI 组件按需加载\",\"link\":\"/guide/vue2/vant\"},{\"text\":\"Sass 全局样式\",\"link\":\"/guide/vue2/sass\"},{\"text\":\"Vuex 状态管理\",\"link\":\"/guide/vue2/vuex\"},{\"text\":\"Vue-router\",\"link\":\"/guide/vue2/router\"},{\"text\":\"Axios 封装及接口管理\",\"link\":\"/guide/vue2/axios\"},{\"text\":\"vue.config.js 基础配置\",\"link\":\"/guide/vue2/base\"},{\"text\":\"配置 alias 别名\",\"link\":\"/guide/vue2/alias\"},{\"text\":\"配置 proxy 跨域\",\"link\":\"/guide/vue2/proxy\"},{\"text\":\"配置 打包分析\",\"link\":\"/guide/vue2/bundle\"},{\"text\":\"配置 externals 引入 cdn 资源\",\"link\":\"/guide/vue2/externals\"},{\"text\":\"去掉 console.log\",\"link\":\"/guide/vue2/console\"},{\"text\":\"splitChunks 打包第三方模块\",\"link\":\"/guide/vue2/chunks\"},{\"text\":\"添加 IE 兼容\",\"link\":\"/guide/vue2/ie\"},{\"text\":\"统一开发规范\",\"link\":\"/guide/vue2/lint\"}]},{\"text\":\"其他\",\"collapsible\":true,\"collapsed\":true,\"items\":[{\"text\":\"常见问题\",\"link\":\"/guide/other/\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/sunniejs/vue-h5-template\"}],\"editLink\":{\"pattern\":\"https://github.com/sunniejs/vue-h5-template/blob/docs/docs/:path\",\"text\":\"在GitHub编辑此页\"},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2022-present Fonghehe\"},\"algolia\":{\"appId\":\"CV2I8NGBKZ\",\"apiKey\":\"63c37a467485b00383daacf7340b4ca0\",\"indexName\":\"vue-h5-template\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}")</script>
</body>

10
guide/vue2/lint.html
View File

File diff suppressed because one or more lines are too long

8
guide/vue2/proxy.html
View File

@ -5,12 +5,12 @@
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>配置 proxy 跨域 | Vue-H5-Template</title>
<meta name="description" content="一个开箱即用的vue h5脚手架">
<link rel="preload stylesheet" href="/vue-h5-template/assets/style.82cfa615.css" as="style">
<link rel="preload stylesheet" href="/vue-h5-template/assets/style.16a63e98.css" as="style">
<script type="module" src="/vue-h5-template/assets/app.88821414.js"></script>
<link rel="preload" href="/vue-h5-template/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
<link rel="modulepreload" href="/vue-h5-template/assets/chunks/framework.6241eaf2.js">
<link rel="modulepreload" href="/vue-h5-template/assets/chunks/theme.c4d303ac.js">
<link rel="modulepreload" href="/vue-h5-template/assets/guide_vue2_proxy.md.f5f5a403.lean.js">
<link rel="modulepreload" href="/vue-h5-template/assets/guide_vue2_proxy.md.0d483f53.lean.js">
<link rel="icon" href="/favicon.ico">
<script id="check-dark-light">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
</head>
@ -36,8 +36,8 @@
<span class="line"><span style="color:#F07178;"> method</span><span style="color:#89DDFF;">:</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">post</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#F07178;"> data</span><span style="color:#89DDFF;">:</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">qs</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">stringify</span><span style="color:#F07178;">(</span><span style="color:#A6ACCD;">params</span><span style="color:#F07178;">)</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">}</span><span style="color:#F07178;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;">}</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-c4b0d3cf data-v-face870a><!--[--><!--]--><div class="edit-info" data-v-face870a><div class="edit-link" data-v-face870a><a class="VPLink link edit-link-button" href="https://github.com/sunniejs/vue-h5-template/blob/docs/docs/guide/vue2/proxy.md" target="_blank" rel="noreferrer" data-v-face870a data-v-8f4dc553><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" aria-label="edit icon" data-v-face870a><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> 在GitHub编辑此页<!--]--><!----></a></div><div class="last-updated" data-v-face870a><p class="VPLastUpdated" data-v-face870a data-v-7b3ebfe1>Last updated: <time datetime="2023-06-26T10:49:15.000Z" data-v-7b3ebfe1></time></p></div></div><div class="prev-next" data-v-face870a><div class="pager" data-v-face870a><a class="pager-link prev" href="/vue-h5-template/guide/vue2/alias.html" data-v-face870a><span class="desc" data-v-face870a>Previous page</span><span class="title" data-v-face870a>配置 alias 别名</span></a></div><div class="has-prev pager" data-v-face870a><a class="pager-link next" href="/vue-h5-template/guide/vue2/bundle.html" data-v-face870a><span class="desc" data-v-face870a>Next page</span><span class="title" data-v-face870a>配置 打包分析</span></a></div></div></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-b2cf3e0b data-v-2f86ebd2><div class="container" data-v-2f86ebd2><p class="message" data-v-2f86ebd2>Released under the MIT License.</p><p class="copyright" data-v-2f86ebd2>Copyright © 2022-present Fonghehe</p></div></footer><!--[--><!--]--></div></div>
<script>__VP_HASH_MAP__ = JSON.parse("{\"guide_other_index.md\":\"0962dd47\",\"guide_start.md\":\"18fddbf4\",\"guide_vue2_router.md\":\"d35b25e7\",\"guide_vue2_sass.md\":\"723a4859\",\"guide_vue2_start.md\":\"e13e8546\",\"guide_vue2_vant.md\":\"9252795d\",\"guide_vue3_lint.md\":\"b9504b63\",\"guide_vue3_start.md\":\"f354f662\",\"guide_vue3_ui.md\":\"cc6ae98b\",\"guide_vue3_viewport.md\":\"ad1a10ef\",\"guide_vue3_vite.md\":\"9ec8c052\",\"guide_index.md\":\"3a64f07e\",\"guide_vue2_vuex.md\":\"618230b5\",\"guide_vue2_vw.md\":\"ca9fc79f\",\"guide_vue3_alias.md\":\"d777bc16\",\"guide_vue3_base.md\":\"732de433\",\"guide_vue3_env.md\":\"83cf2a7e\",\"guide_vue2_rem.md\":\"769a5fda\",\"guide_about_index.md\":\"9cd5ee99\",\"guide_edit.md\":\"4c959ba5\",\"guide_vue2_axios.md\":\"a682218e\",\"guide_vue3_axios.md\":\"cd29cfa2\",\"guide_vue2_bundle.md\":\"2fe1a9fb\",\"guide_vue2_chunks.md\":\"0130f8b3\",\"guide_vue2_console.md\":\"51b49cb0\",\"guide_vue2_env.md\":\"c800a293\",\"guide_vue2_externals.md\":\"69c0669f\",\"index.md\":\"bd639346\",\"guide_vue3_i18n.md\":\"0436062d\",\"guide_vue2_base.md\":\"7d4266ed\",\"guide_vue2_ie.md\":\"83d021b7\",\"guide_vue2_lint.md\":\"d5070d4f\",\"guide_vue2_proxy.md\":\"f5f5a403\",\"guide_vue2_alias.md\":\"306b63fa\",\"guide_vue3_router.md\":\"bf1ddfb2\",\"guide_vue3_pinia.md\":\"4c51a07c\",\"guide_vue3_proxy.md\":\"b05cbab3\"}")
<span class="line"><span style="color:#89DDFF;">}</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-c4b0d3cf data-v-face870a><!--[--><!--]--><div class="edit-info" data-v-face870a><div class="edit-link" data-v-face870a><a class="VPLink link edit-link-button" href="https://github.com/sunniejs/vue-h5-template/blob/docs/docs/guide/vue2/proxy.md" target="_blank" rel="noreferrer" data-v-face870a data-v-8f4dc553><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" aria-label="edit icon" data-v-face870a><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> 在GitHub编辑此页<!--]--><!----></a></div><div class="last-updated" data-v-face870a><p class="VPLastUpdated" data-v-face870a data-v-7b3ebfe1>Last updated: <time datetime="2024-11-11T09:04:24.000Z" data-v-7b3ebfe1></time></p></div></div><div class="prev-next" data-v-face870a><div class="pager" data-v-face870a><a class="pager-link prev" href="/vue-h5-template/guide/vue2/alias.html" data-v-face870a><span class="desc" data-v-face870a>Previous page</span><span class="title" data-v-face870a>配置 alias 别名</span></a></div><div class="has-prev pager" data-v-face870a><a class="pager-link next" href="/vue-h5-template/guide/vue2/bundle.html" data-v-face870a><span class="desc" data-v-face870a>Next page</span><span class="title" data-v-face870a>配置 打包分析</span></a></div></div></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-b2cf3e0b data-v-2f86ebd2><div class="container" data-v-2f86ebd2><p class="message" data-v-2f86ebd2>Released under the MIT License.</p><p class="copyright" data-v-2f86ebd2>Copyright © 2022-present Fonghehe</p></div></footer><!--[--><!--]--></div></div>
<script>__VP_HASH_MAP__ = JSON.parse("{\"guide_about_index.md\":\"3268f72f\",\"guide_index.md\":\"46287c77\",\"guide_vue2_base.md\":\"bd933227\",\"guide_edit.md\":\"7944bd49\",\"guide_vue2_alias.md\":\"c0d9e31c\",\"guide_vue2_env.md\":\"71078dec\",\"guide_vue2_chunks.md\":\"93504c3d\",\"guide_vue3_axios.md\":\"0778382b\",\"guide_vue2_router.md\":\"369637ff\",\"guide_vue2_vant.md\":\"4ed27c84\",\"guide_vue2_vw.md\":\"f3d8795c\",\"guide_start.md\":\"634b98ba\",\"guide_vue3_i18n.md\":\"51f27eff\",\"guide_vue2_rem.md\":\"05f1a99e\",\"guide_vue3_pinia.md\":\"0d738d45\",\"guide_vue3_lint.md\":\"18663aed\",\"guide_vue3_start.md\":\"6f88b41c\",\"guide_vue3_proxy.md\":\"94d7124b\",\"guide_vue2_vuex.md\":\"399839b6\",\"guide_vue2_proxy.md\":\"0d483f53\",\"guide_vue3_base.md\":\"462dbdb9\",\"guide_vue2_console.md\":\"68673d37\",\"guide_other_index.md\":\"5aef07ec\",\"guide_vue2_bundle.md\":\"73aeb293\",\"guide_vue3_alias.md\":\"6e50bff0\",\"guide_vue2_sass.md\":\"3616d11c\",\"guide_vue2_start.md\":\"f6e40312\",\"guide_vue3_env.md\":\"b928542e\",\"guide_vue3_ui.md\":\"385fc808\",\"guide_vue3_viewport.md\":\"0ef62fba\",\"guide_vue3_router.md\":\"84936a90\",\"guide_vue2_lint.md\":\"94bcc728\",\"guide_vue2_axios.md\":\"f273628e\",\"guide_vue2_externals.md\":\"6744fb41\",\"guide_vue3_vite.md\":\"7a4b4162\",\"index.md\":\"b1dbb931\",\"guide_vue2_ie.md\":\"f5d567e9\"}")
__VP_SITE_DATA__ = JSON.parse("{\"lang\":\"zh-CN\",\"dir\":\"ltr\",\"title\":\"Vue-H5-Template\",\"description\":\"一个开箱即用的vue h5脚手架\",\"base\":\"/vue-h5-template/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"介绍\",\"link\":\"/guide/\"},{\"text\":\"加入我们\",\"link\":\"/guide/about/\"},{\"text\":\"github仓库\",\"link\":\"https://github.com/sunniejs/vue-h5-template\"}],\"sidebar\":[{\"text\":\"前言\",\"collapsible\":true,\"items\":[{\"text\":\"介绍\",\"link\":\"/guide/\"},{\"text\":\"快速上手\",\"link\":\"/guide/start\"},{\"text\":\"参与编辑\",\"link\":\"/guide/edit\"}]},{\"text\":\"vue3-template\",\"collapsible\":true,\"items\":[{\"text\":\"启动项目\",\"link\":\"/guide/vue3/start\"},{\"text\":\"vite.config.ts 基础配置\",\"link\":\"/guide/vue3/base\"},{\"text\":\"vite插件集成\",\"link\":\"/guide/vue3/vite\"},{\"text\":\"多环境变量\",\"link\":\"/guide/vue3/env\"},{\"text\":\"viewport 适配方案\",\"link\":\"/guide/vue3/viewport\"},{\"text\":\"UI组件库\",\"link\":\"/guide/vue3/ui\"},{\"text\":\"Pinia 状态管理\",\"link\":\"/guide/vue3/pinia\"},{\"text\":\"vue-router\",\"link\":\"/guide/vue3/router\"},{\"text\":\"axios 封装及接口管理\",\"link\":\"/guide/vue3/axios\"},{\"text\":\"alias\",\"link\":\"/guide/vue3/alias\"},{\"text\":\"proxy 跨域\",\"link\":\"/guide/vue3/proxy\"},{\"text\":\"多语言解决方案\",\"link\":\"/guide/vue3/i18n\"},{\"text\":\"统一开发规范\",\"link\":\"/guide/vue3/lint\"}]},{\"text\":\"vue2-template\",\"collapsible\":true,\"collapsed\":true,\"items\":[{\"text\":\"启动项目\",\"link\":\"/guide/vue2/start\"},{\"text\":\"多环境变量\",\"link\":\"/guide/vue2/env\"},{\"text\":\"rem 适配方案\",\"link\":\"/guide/vue2/rem\"},{\"text\":\"vw 适配方案\",\"link\":\"/guide/vue2/vw\"},{\"text\":\"VantUI 组件按需加载\",\"link\":\"/guide/vue2/vant\"},{\"text\":\"Sass 全局样式\",\"link\":\"/guide/vue2/sass\"},{\"text\":\"Vuex 状态管理\",\"link\":\"/guide/vue2/vuex\"},{\"text\":\"Vue-router\",\"link\":\"/guide/vue2/router\"},{\"text\":\"Axios 封装及接口管理\",\"link\":\"/guide/vue2/axios\"},{\"text\":\"vue.config.js 基础配置\",\"link\":\"/guide/vue2/base\"},{\"text\":\"配置 alias 别名\",\"link\":\"/guide/vue2/alias\"},{\"text\":\"配置 proxy 跨域\",\"link\":\"/guide/vue2/proxy\"},{\"text\":\"配置 打包分析\",\"link\":\"/guide/vue2/bundle\"},{\"text\":\"配置 externals 引入 cdn 资源\",\"link\":\"/guide/vue2/externals\"},{\"text\":\"去掉 console.log\",\"link\":\"/guide/vue2/console\"},{\"text\":\"splitChunks 打包第三方模块\",\"link\":\"/guide/vue2/chunks\"},{\"text\":\"添加 IE 兼容\",\"link\":\"/guide/vue2/ie\"},{\"text\":\"统一开发规范\",\"link\":\"/guide/vue2/lint\"}]},{\"text\":\"其他\",\"collapsible\":true,\"collapsed\":true,\"items\":[{\"text\":\"常见问题\",\"link\":\"/guide/other/\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/sunniejs/vue-h5-template\"}],\"editLink\":{\"pattern\":\"https://github.com/sunniejs/vue-h5-template/blob/docs/docs/:path\",\"text\":\"在GitHub编辑此页\"},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2022-present Fonghehe\"},\"algolia\":{\"appId\":\"CV2I8NGBKZ\",\"apiKey\":\"63c37a467485b00383daacf7340b4ca0\",\"indexName\":\"vue-h5-template\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}")</script>
</body>

Some files were not shown because too many files have changed in this diff Show More