|
|
import{_ as t,c as n,j as i,a,G as p,ag as l,B as h,o as d}from"./chunks/framework.C1C4sYC0.js";const _=JSON.parse('{"title":"MPA 模式","description":"","frontmatter":{},"headers":[],"relativePath":"zh/guide/mpa-mode.md","filePath":"zh/guide/mpa-mode.md","lastUpdated":1719410492000}'),k={name:"zh/guide/mpa-mode.md"},r={id:"mpa-mode",tabindex:"-1"};function E(o,s,c,g,m,y){const e=h("Badge");return d(),n("div",null,[i("h1",r,[s[0]||(s[0]=a("MPA 模式 ")),p(e,{type:"warning",text:"experimental"}),s[1]||(s[1]=a()),s[2]||(s[2]=i("a",{class:"header-anchor",href:"#mpa-mode","aria-label":'Permalink to "MPA 模式 <Badge type="warning" text="experimental" /> {#mpa-mode}"'},"",-1))]),s[3]||(s[3]=l(`<p>可以通过命令行输入 <code>vitepress build --mpa</code> 或在配置文件中指定 <code>mpa: true</code> 配置选项来启用 MPA (Multi-Page Application) 模式。</p><p>在 MPA 模式下，所有页面都默认不会包含任何 JavaScript。因此，站点也许可以在评估工具中获得更好的初始访问性能分数。</p><p>但是，由于缺少 SPA 路由，在 MPA 模式下切换页面时会重新加载整个页面，而不会像 SPA 模式那样立即响应。</p><p>同时请注意，默认情况下不使用 JavaScript 意味着你实际上只是将 Vue 作为服务器端模板语言。浏览器不会附加任何事件处理程序，因此将不会有任何交互性。要加载客户端 JavaScript，需要使用特殊的 <code><script client></code> 标签：</p><div class="language-html vp-adaptive-theme"><button title="复制代码" class="copy"></button><span class="lang">html</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"><</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> client</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">></span></span>
|
