search

xianyu21 / xianyu21.github.io

https://xianyu21.github.io/zh-CN/
MIT License
0 stars 0 forks source link

部署至github.io #1

Open lauset opened 1 year ago

lauset commented 1 year ago

你可以单独在 github.io 中开一个 pages 分支，然后该分支中的代码只放你 vitpress 打包后 dist 目录下的文件

操作方式：

  1. 进入主分支，进入 packages/docs 目录下执行命令 pnpm build
  2. 继续使用 pnpm serve 命令来预览项目，如果预览成功就继续
  3. 将 .vitepress/dist 打包，然后将其中的代码都复制到你新建的 pages 分支上传即可
  4. 最后一步就是将你 githubio 这个项目设置中的 pages 选项中修改你要展示的分支改为 pages 分支即可

还有一种方式就是可以去看下 vercel.app 去部署项目，可以直接结合你的 github 仓库，做到持续集成部署 这种方式我在 vitepress-theme-vuetom 都已经使用了一段时间了，还不错

xianyu21 commented 1 year ago

哈哈 感谢指导 我已经部署上了1.x版本的 在尝试最新版后 我有几个问题

  1. 就是在node版本14.16.0下面会报以下错误,切换到版本18.16.0后没有问题 
    The requested module 'node:dns' does not provide an export named 'setDefaultResultOrder'
  2. 关于操作流程 我现在是 先执行 pnpm i 再就是在packages/vuetom,执行pnpm build构建主题包 最后就是运行或者打包 如果按照你说的流程会报以下错误 
    [vite] Internal server error: Failed to resolve entry for package "vitepress-theme-vuetom". The package may have incorrect main/module/exports specified in its package.json.
  3. 关于创建依赖的时候 我有个问题 我是前端 习惯性使用npm命令 然而呢 我npm install却无法运行这是为啥?
lauset commented 1 year ago

这几个问题其实也好解决的：

  1. 现在大部分框架和技术的 node 版本都在不断更新，目前 node 社区长期维护的有 v16 和最新的 v18，很多项目就需要慢慢抛弃 node 14 了，否则很多关联依赖之间会有很多问题出现

  2. 执行 pnpm i 安装依赖后，由于 packages/docs 或 packages/blog 里引入 vitepress-theme-vuetom 是直接当作三方依赖引入的，而不是 '../../../vuetom' 这种方式引入的，所以这种情况下需要先对 packages/vuetom 进行打包，打包后的 vuetom/dist 结合 vuetom/package.json 就相当于一个可发布的依赖了，我写的流畅里顺序应该是有问题的哈哈

  3. 现在很多大佬们的开源项目包括vuejs内主攻的项目都采用了 pnpm + monorepo 的方式去管理各个模块，所以我也使用了这种方式，pacakges下都是独立的模块，根目录需要 pnpm 命令去安装依赖并操作各种命令，然后在 docs 模块引入 vuetom 模块版本的写法就是"vitepress-theme-vuetom": "workspace:^2.2.0"，前提是 vuetom 模块一定要打包后其他模块才能将其作为一个完整的第三方依赖引入并使用

lauset commented 1 year ago

忘记了最重要的一点， github.io 部署防止样式丢失问题 issuecomment-1237676660

xianyu21 commented 1 year ago

忘记了最重要的一点， github.io 部署防止样式丢失问题 issuecomment-1237676660

hh 非常感谢 我想我可以开始写了