Jacky's blog Jacky's blog
首页
  • 编码专题
  • 深入浅出 Vite
  • 深入浅出 babel
  • 快速上手API
  • 深入浅出 react
  • Node

    • code-notebook
  • 状态管理

    • redux
  • 前端工程化

    • Wepack
  • React源码

    • React源码
  • 组件库封装

    • 组件库
  • 开发工具

    • Vscode 插件
  • 项目展示
  • 案例中心 (opens new window)
  • First Project
  • 基础算法题
  • 链表题
  • 动态规划
  • 双指针
  • 递归
  • 数据结构
  • 前端学习计划 (opens new window)
  • 技术随笔
  • 转载文章
  • 包管理工具
  • 前端学习周报
  • VSCode插件
  • Promise 专题
  • 函数技巧
  • React 专题
  • 配置文件

    • TSCONFIG-配置 (opens new window)
    • NGINX-配置 (opens new window)
    • 正则规则查询手册 (opens new window)
    • Lint 配置 (opens new window)
  • 教程

    • GIT-教程
    • NPM SCRIPTS-工作流 (opens new window)
    • DOCKER-教程 (opens new window)
    • LERNA-教程 (opens new window)
    • GIT-常用操作整理 (opens new window)
  • VSCode

    • LAUNCH.JSON (opens new window)
  • 指令

    • NPM 指令 (opens new window)
    • NVM 指令 (opens new window)
    • Nginx 指令 (opens new window)
    • YARN 指令 (opens new window)
    • PNPM 指令 (opens new window)
  • 库

    • FS-EXTRA 库 (opens new window)
    • NODE 库-PATH (opens new window)
  • 永远的神

    • 魔法师卡颂-自顶向下学 React 源码 (opens new window)
    • 全栈潇晨 (opens new window)
    • 博客-程序员山月-Daily (opens new window)
    • 淘系前端:冴羽 (opens new window)
  • 系列文章

    • 《图解HTTP》 (opens new window)
    • 《ES6标准入门》 (opens new window)
    • 《现代JavaScript教程》 (opens new window)
    • 《深入浅出Webpack》 (opens new window)
    • VSCode 插件系列:小茗同学 (opens new window)
    • JEST 教程 (opens new window)
    • 前端精读周刊:各种精读系列 (opens new window)
    • 一文吃透系列 (opens new window)
    • 图解 REACT 原理 (opens new window)
  • 实用网站

    • MDN (opens new window)
    • CAN I USE (opens new window)
    • TYPESCRIPT-ESLint-RULES (opens new window)
    • ESLint-RULES (opens new window)
    • FRONT-END TREND (opens new window)
    • NPM TREND (opens new window)
    • 在线分析 Node 依赖 (opens new window)
    • FIND NPM (opens new window)
    • CODE PEN (opens new window)
    • 印记中文 (opens new window)
    • TOOL.LU (opens new window)
    • 阮一峰-网道 (opens new window)
    • DIGITAL OCEAN (opens new window)
    • DEVDOCS.IO (opens new window)
    • JOI (opens new window)
  • 算法

    • 小浩算法 (opens new window)
    • LABULADONG 的算法小抄 (opens new window)
    • 力扣 SOLUTION (opens new window)
    • HACKER RANK (opens new window)
    • 代码随想录 (opens new window)
  • 博客系列

    • 美团大佬 (opens new window)
    • 蜡笔小伟 (opens new window)
    • 优秀博客1 (opens new window)
    • 优秀博客2-umi (opens new window)
    • 优质博客 (opens new window)
  • CSS

    • CSS-EASING 库 (opens new window)
    • ROUGH.JS (opens new window)
    • CSS 网站收集
    • UNOCSS (opens new window)
  • 前端

    • PROMISE (opens new window)
    • UNDERSCORE.JS (opens new window)
    • study with BGM (opens new window)
    • nginx【B站视频】 (opens new window)
    • 机器学习
    • Js基础
  • 掘金已购课程

    • 前端自动化测试精讲 (opens new window)
    • 深入浅出 Vite (opens new window)
    • 现代 Web 布局 (opens new window)
    • 前端算法与数据结构 (opens new window)
    • 基于 Vite 的 SSG 框架开发实战 (opens new window)
    • SSR 实战:官网开发指南 (opens new window)
    • WebGL 入门与实践 (opens new window)
    • 玩转 CSS 的艺术之美 (opens new window)
    • 前端调试通关秘籍 (opens new window)
    • React 进阶实践指南 (opens new window)
    • TypeScript 全面进阶指南 (opens new window)
    • 前端缓存技术与方案解析 (opens new window)
    • npm scripts 前端工作流 (opens new window)
    • Webpack5 核心原理与应用实践 (opens new window)
  • 购物车

    • 张鑫旭-技术写作指南 (opens new window)
    • 深入剖析 Node.js 底层原理 (opens new window)
    • 前端开发者的现代 C++ 课 (opens new window)
    • 从前端到全栈 (opens new window)
  • 分类
  • 标签
  • 归档
GitHub (opens new window)

Jacky Wang

行到水穷处,坐看云起时
首页
  • 编码专题
  • 深入浅出 Vite
  • 深入浅出 babel
  • 快速上手API
  • 深入浅出 react
  • Node

    • code-notebook
  • 状态管理

    • redux
  • 前端工程化

    • Wepack
  • React源码

    • React源码
  • 组件库封装

    • 组件库
  • 开发工具

    • Vscode 插件
  • 项目展示
  • 案例中心 (opens new window)
  • First Project
  • 基础算法题
  • 链表题
  • 动态规划
  • 双指针
  • 递归
  • 数据结构
  • 前端学习计划 (opens new window)
  • 技术随笔
  • 转载文章
  • 包管理工具
  • 前端学习周报
  • VSCode插件
  • Promise 专题
  • 函数技巧
  • React 专题
  • 配置文件

    • TSCONFIG-配置 (opens new window)
    • NGINX-配置 (opens new window)
    • 正则规则查询手册 (opens new window)
    • Lint 配置 (opens new window)
  • 教程

    • GIT-教程
    • NPM SCRIPTS-工作流 (opens new window)
    • DOCKER-教程 (opens new window)
    • LERNA-教程 (opens new window)
    • GIT-常用操作整理 (opens new window)
  • VSCode

    • LAUNCH.JSON (opens new window)
  • 指令

    • NPM 指令 (opens new window)
    • NVM 指令 (opens new window)
    • Nginx 指令 (opens new window)
    • YARN 指令 (opens new window)
    • PNPM 指令 (opens new window)
  • 库

    • FS-EXTRA 库 (opens new window)
    • NODE 库-PATH (opens new window)
  • 永远的神

    • 魔法师卡颂-自顶向下学 React 源码 (opens new window)
    • 全栈潇晨 (opens new window)
    • 博客-程序员山月-Daily (opens new window)
    • 淘系前端:冴羽 (opens new window)
  • 系列文章

    • 《图解HTTP》 (opens new window)
    • 《ES6标准入门》 (opens new window)
    • 《现代JavaScript教程》 (opens new window)
    • 《深入浅出Webpack》 (opens new window)
    • VSCode 插件系列:小茗同学 (opens new window)
    • JEST 教程 (opens new window)
    • 前端精读周刊:各种精读系列 (opens new window)
    • 一文吃透系列 (opens new window)
    • 图解 REACT 原理 (opens new window)
  • 实用网站

    • MDN (opens new window)
    • CAN I USE (opens new window)
    • TYPESCRIPT-ESLint-RULES (opens new window)
    • ESLint-RULES (opens new window)
    • FRONT-END TREND (opens new window)
    • NPM TREND (opens new window)
    • 在线分析 Node 依赖 (opens new window)
    • FIND NPM (opens new window)
    • CODE PEN (opens new window)
    • 印记中文 (opens new window)
    • TOOL.LU (opens new window)
    • 阮一峰-网道 (opens new window)
    • DIGITAL OCEAN (opens new window)
    • DEVDOCS.IO (opens new window)
    • JOI (opens new window)
  • 算法

    • 小浩算法 (opens new window)
    • LABULADONG 的算法小抄 (opens new window)
    • 力扣 SOLUTION (opens new window)
    • HACKER RANK (opens new window)
    • 代码随想录 (opens new window)
  • 博客系列

    • 美团大佬 (opens new window)
    • 蜡笔小伟 (opens new window)
    • 优秀博客1 (opens new window)
    • 优秀博客2-umi (opens new window)
    • 优质博客 (opens new window)
  • CSS

    • CSS-EASING 库 (opens new window)
    • ROUGH.JS (opens new window)
    • CSS 网站收集
    • UNOCSS (opens new window)
  • 前端

    • PROMISE (opens new window)
    • UNDERSCORE.JS (opens new window)
    • study with BGM (opens new window)
    • nginx【B站视频】 (opens new window)
    • 机器学习
    • Js基础
  • 掘金已购课程

    • 前端自动化测试精讲 (opens new window)
    • 深入浅出 Vite (opens new window)
    • 现代 Web 布局 (opens new window)
    • 前端算法与数据结构 (opens new window)
    • 基于 Vite 的 SSG 框架开发实战 (opens new window)
    • SSR 实战:官网开发指南 (opens new window)
    • WebGL 入门与实践 (opens new window)
    • 玩转 CSS 的艺术之美 (opens new window)
    • 前端调试通关秘籍 (opens new window)
    • React 进阶实践指南 (opens new window)
    • TypeScript 全面进阶指南 (opens new window)
    • 前端缓存技术与方案解析 (opens new window)
    • npm scripts 前端工作流 (opens new window)
    • Webpack5 核心原理与应用实践 (opens new window)
  • 购物车

    • 张鑫旭-技术写作指南 (opens new window)
    • 深入剖析 Node.js 底层原理 (opens new window)
    • 前端开发者的现代 C++ 课 (opens new window)
    • 从前端到全栈 (opens new window)
  • 分类
  • 标签
  • 归档
GitHub (opens new window)
  • Node

  • VSCode插件

    • 如何打包 VSCode IDE(Mac)
      • 0.前言
      • 1.XCode 安装
      • 2.RVM 安装
      • 3.安装 CocoaPods
      • 4.镜像源配置
    • 如何查看 VSCode 官网
    • VSCode目录结构分析
    • VSCode插件-yo脚手架创建
    • VSCode插件-debug
    • VSCode插件-TreeView
    • VSCode插件-WebView
    • VSCode插件-i18n
    • VSCode插件-Color Theme
    • VSCode插件-Node进程交互
    • VSCode 插件-Edge_devtools 源码
    • VSCode插件-使用 gulp 打包插件
    • VSCode-Tasks模式
    • VSCode插件-存储方式
    • VSCode插件-开发 code-snippets 插件
  • Webpack

  • Redux

  • React源码

  • 组件库

  • React高阶系列

  • UMI插件

  • 前端工程化

  • 单元测试vitest

  • 重点技术
  • VSCode插件
wangjiasheng
2022-02-17
目录

如何打包 VSCode IDE(Mac)

# 0.前言

本篇博客记录:打包 Mac 版本的VSCode所需的环境配置。

环境配置如下:

  1. 设备型号:Macbook Air 2020 M1版本。

  2. XCode版本:13.2.1(13C100)

    xcode-select版本:2384

  3. RVM版本:rvm 1.29.12

  4. ruby版本:2.6.3

  5. cocoaPods:1.11.2

目前,根据上述环境配置,已成功打包 VSCode 应用程序。

# 1.XCode 安装

XCode 可以直接从 App Stroe下载,我安装的版本是:13.2.1(13C100)

下载后的XCode是自带XCode Command Line Tool,在命令行输入:

> xcode-select -v
xcode-select version 2384.
1
2

# 2.RVM 安装

这部分内容,我完全是按照Mac 安装 Ruby 版本管理器(RVM) (opens new window)的步骤执行的,安装的很顺利。

  1. 安装mpapis公钥。但是,正如安装页面所记录的,您可能需要 gpg。Mac OS X不附带gpg,因此在安装公钥之前,您需要安装gpg。我用Homebrew安装了gpg :

    brew install gnupg
    
    1

    安装完毕,检查版本:

    gpg --version
    
    1
  2. 安装完gpg之后,你可以安装mpapis公钥:

    > gpg --keyserver hkp://pgp.mit.edu --recv-keys 409B6B1796C275462A1703113804BB82D39DC0E3 7D2BAF1CF37B13E2069D6956105BD0E739499BDB
    > # 安装成功,弹出以下信息:
    gpg: 目录‘/Users/jiashengwang/.gnupg’已创建
    gpg: 钥匙箱‘/Users/jiashengwang/.gnupg/pubring.kbx’已创建
    gpg: 密钥 105BD0E739499BDB: 1 个重复签名被移除
    gpg: /Users/jiashengwang/.gnupg/trustdb.gpg:建立了信任度数据库
    gpg: 密钥 105BD0E739499BDB:公钥 “Piotr Kuczynski <piotr.kuczynski@gmail.com>” 已导入
    gpg: 密钥 3804BB82D39DC0E3:公钥 “Michal Papis (RVM signing) <mpapis@gmail.com>” 已导入
    gpg: 处理的总数:2
    gpg:               已导入:2
    
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
  3. 安装最新版本的Ruby的RVM

    \curl -sSL https://get.rvm.io | bash -s stable --ruby
    
    1

    安装完毕,可以使用以下命令检查版本:

    > which ruby
      /Users/jiashengwang/.rvm/rubies/ruby-3.0.0/bin/ruby
    > rvm -v
      rvm 1.29.12 (latest) by Michal Papis, Piotr Kuczynski, Wayne E. Seguin [https://rvm.io]
    
    1
    2
    3
    4

    安装成功,推出重新打开终端。

  4. 重新安装ruby版本(猜测可跳过)

    走完前面的步骤,其实在终端中已经安装了一个ruby版本,默认3.0.0

    # 列出 ruby 可安装的版本信息
    > rvm list known
    
    # MRI Rubies
    [ruby-]1.8.6[-p420]
    [ruby-]1.8.7[-head] # security released on head
    [ruby-]1.9.1[-p431]
    [ruby-]1.9.2[-p330]
    [ruby-]1.9.3[-p551]
    [ruby-]2.0.0[-p648]
    [ruby-]2.1[.10]
    [ruby-]2.2[.10]
    [ruby-]2.3[.8]
    [ruby-]2.4[.10]
    [ruby-]2.5[.8]
    [ruby-]2.6[.6]
    [ruby-]2.7[.2]
    [ruby-]3[.0.0]
    ruby-head
    
    > rvm install 2.6.3 # 这里安装的是2.6.3版本
    > rvm use 2.6.3  --default # 设置别名alias
    
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22

# 3.安装 CocoaPods

这一部分需要fq,同时也可以使用国内镜像源,镜像源的设置见:第 4 部分

由于可以fq,上述步骤都没有做,直接根据cocoapods 官网 (opens new window)提供的指令:

sudo gem install cocoapods
1

安装成功后,需要执行

 pod setup
1

检查是否安装成功:

> pod --version
1.11.2
1
2

# 4.镜像源配置

安装CocoaPods切换国内gem镜像源的操作如下:

# 升级源
sudo gem update --system      //升级gem

# 删除默认源
gem sources --remove https://rubygems.org/

# 设置 ruby-China 源
gem sources --remove https://rubygems.org/

# 设置 taobao 源
gem sources -a http://ruby.taobao.org/
1
2
3
4
5
6
7
8
9
10
11

设置完成,检查是否换源成功:

gem sources -l
1
编辑 (opens new window)
#VSCode
上次更新: 2023/06/17, 10:06:00
Node代码片段
如何查看 VSCode 官网

← Node代码片段 如何查看 VSCode 官网→

最近更新
01
如何理解浏览器的 user agent 用户代理的含义?
11-05
02
浏览器事件循环机制
10-31
03
浏览器页面渲染机制【2023】
10-15
更多文章>
Theme by Vdoing | Copyright © 2020-2023
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式