vuepress设置两种主题的踩坑经历

页面需要设置亮暗两种主题,需将设置之后的主题类型存进 localStorage ,如果直接在 enhanceApp.js 中初始化,打包时会报 document is not defined ,window is not defined

解决方案

定义一个全局 mixin ,将主题类型初始化放在 mounted 生命周期钩子里

Vue.mixin({

  mounted() {

    document.body.setAttribute('data-theme', window.localStorage.getItem('data-theme') || 'light');

    window.localStorage.setItem('data-theme', window.localStorage.getItem('data-theme') || 'light');

  }

})

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

友情链接更多精彩内容