Henry Henry
  • JavaScript
  • TypeScript
  • Vue
  • ElementUI
  • React
  • HTML
  • CSS
  • 技术文档
  • GitHub 技巧
  • Nodejs
  • Chrome
  • VSCode
  • Other
  • Mac
  • Windows
  • Linux
  • Vim
  • VSCode
  • Chrome
  • iTerm
  • Mac
  • Obsidian
  • lazygit
  • Vim 技巧
  • 分类
  • 标签
  • 归档
  • 网站
  • 资源
  • Vue 资源
GitHub (opens new window)

Henry

小学生中的前端大佬
  • JavaScript
  • TypeScript
  • Vue
  • ElementUI
  • React
  • HTML
  • CSS
  • 技术文档
  • GitHub 技巧
  • Nodejs
  • Chrome
  • VSCode
  • Other
  • Mac
  • Windows
  • Linux
  • Vim
  • VSCode
  • Chrome
  • iTerm
  • Mac
  • Obsidian
  • lazygit
  • Vim 技巧
  • 分类
  • 标签
  • 归档
  • 网站
  • 资源
  • Vue 资源
GitHub (opens new window)
  • JavaScript

  • TypeScript

  • Vue

    • Vue 编码指南
    • vue-cli 启动本地服务局域网不能访问的原因分析
    • 解决 Vue 相同路由参数不同不会刷新的问题
    • 解决 vuex requires a Promise polyfill in this browser 问题
    • 关于父组件通过 v-on 接收子组件多个参数的一点研究
    • Vue $attrs 和 $listeners
    • Vue axios 发送 Form Data 数据格式请求
    • Vue 开发技巧
    • Vue 动态路由
    • Vue 集成 UEditor 富文本编辑器
    • Vue 修饰符
    • Vue 问题集合
    • Vue props 传多值的问题
    • vue-router 在 IE11 下手动更改 URL 的 hash 不会触发路由
    • vue-router 路由参数刷新消失的问题
    • 那些年被我们忽略的 vue 语法
    • vue 生命周期深入
    • vue 组件通信深入
    • vue 组件通信深入 Vuex
    • vue项目移动端、pc端适配方案
    • vuepress 如何引入 vuex
  • ElementUI

  • React

  • AntD

  • 前端
  • Vue
Henry
2022-08-24

vuepress 如何引入 vuex

众所周知,vuepress 虽然基于 Vue,但使用上还是有些许区别的,比如如何使用 vuex

Vue 项目有 main.js 入口,可以引入并使用 vuex,而 vuepress 只能在 enhanceApp.js 中处理一些配置信息,但无法与 main.js 相比,比如我可以引入并 Vue.use(Vuex),但无法配置 store,官方文档也没有相关说明

直到百度找到这篇文章:vuepress 如何引入 vuex (opens new window)

这篇文章是通过 mixin 来配置 store 的,而且还提出一种解决思路:去 github 的 issues 查找相关问题

通过搜索 vuex 找到了这个 issues: enhanceApp options should merge options we pass · Issue #1631 · vuejs/vuepress (opens new window)

可以通过

Object.assign(options, {
  store
})
1
2
3

把 store 配置好,这个看着还是不错的,而且这个是一个简单示例

而我们一般都是新建一个 store.js 文件,在文件里引入 Vue 及 Vuex,然后 Vue.use(Vuex) 并编写 store 的 actions 等配置,最后 export default new Vuex.store({})

最后在 enhanceApp.js 中引入 store.js,然后使用 Object.assign() 合并即可

编辑 (opens new window)
上次更新: 5/27/2023, 1:02:05 PM
vue项目移动端、pc端适配方案
基于 ElementUI 封装的 TextEllipsis

← vue项目移动端、pc端适配方案 基于 ElementUI 封装的 TextEllipsis→

最近更新
01
version 1.15
07-01
02
version 1.14
06-27
03
version 1.13
06-27
更多文章>
Theme by Vdoing | Copyright © 2017-2023 HenryTSZ | MIT License
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式