ModyQyW's Site

环境配置

所有配置仅供参考，且尽可能使用统一的包管理器安装。以下给出在 macOS (intel) 上的应用和配置参考，并补充说明 Windows 的思路。

安装系统可以考虑 FirPEopen in new window、WinPEopen in new window 和 Ventoyopen in new window。

just pirate it

DNS

国内优先选择国内的 DNS 解析服务，相对较快。

国外的 DNS 解析服务相对较慢，但有时有奇效，酌情使用。

浏览器

推荐使用 Chromeopen in new window 或者 Edgeopen in new window。

360 极速浏览器open in new window 自带 flash 支持。

测试可能还需要 Firefoxopen in new window、Safariopen in new window。

浏览器插件

macOS (intel) Homebrew 为主官网为辅管理应用

使用 Homebrewopen in new window 统一安装和更新大量软件非常方便。但是软件版本往往会有一些滞后，加之现在软件往往都有自动更新，不再推荐使用 Homebrew 来安装和更新软件。

  • 在触控板上四指捏合，或者点击底部 程序坞 里面的 启动台，然后打开 终端。

  • 点击左上角的 终端 -> 偏好设置 -> 描述文件，可以选择你想要的基本效果。我这里选择了 Pro。

  • 安装 Homebrewopen in new window 并链接不同的软件源。

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
brew tap buo/cask-upgrade # https://github.com/buo/homebrew-cask-upgrade
# Update formulaes and casks
brew cleanup --prune=all && brew upgrade && brew cu -ay && brew cleanup --prune=all
# Check problems
brew doctor

brew install --cask visual-studio-code

brew install git

sudo chsh -s /bin/zsh

sh -c "$(curl -fsSL https://raw.github.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"

sudo chown -R $USER:$USER ~/.oh-my-zsh
# sudo chown -R 755 ~/.oh-my-zsh
sudo git clone https://github.com/zsh-users/zsh-syntax-highlighting ${ZSH_CUSTOM:-~/.oh-my-zsh/custom}/plugins/zsh-syntax-highlighting
sudo git clone https://github.com/zsh-users/zsh-autosuggestions ${ZSH_CUSTOM:-~/.oh-my-zsh/custom}/plugins/zsh-autosuggestions
  • 用 vscode 打开默认主题 robbyrussell 的配置文件 ~/.oh-my-zsh/themes/robbyrussell.zsh-theme，简单修改一下然后保存
code ~/.oh-my-zsh/themes/robbyrussell.zsh-theme

PROMPT="%(?:%{$fg_bold[green]%}➜ :%{$fg_bold[red]%}➜ )"
PROMPT+=' %{$fg[cyan]%}[$PWD]%{$reset_color%} $(git_prompt_info)'

ZSH_THEME_GIT_PROMPT_PREFIX="%{$fg_bold[blue]%}git:(%{$fg[red]%}"
ZSH_THEME_GIT_PROMPT_SUFFIX="%{$reset_color%} "
ZSH_THEME_GIT_PROMPT_DIRTY="%{$fg[blue]%}) %{$fg[yellow]%}✗"
ZSH_THEME_GIT_PROMPT_CLEAN="%{$fg[blue]%})"
  • 用 vscode 打开 zsh 的配置文件 ~/.zshrc，配置 zsh 和环境变量。
code ~/.zshrc

# If you come from bash you might have to change your $PATH.
# export PATH=$HOME/bin:/usr/local/bin:$PATH

# Path to your oh-my-zsh installation.
export ZSH="~/.oh-my-zsh"

# Set name of the theme to load --- if set to "random", it will
# load a random theme each time oh-my-zsh is loaded, in which case,
# to know which specific one was loaded, run: echo $RANDOM_THEME
# See https://github.com/robbyrussell/oh-my-zsh/wiki/Themes
ZSH_THEME="robbyrussell"

# Set list of themes to pick from when loading at random
# Setting this variable when ZSH_THEME=random will cause zsh to load
# a theme from this variable instead of looking in ~/.oh-my-zsh/themes/
# If set to an empty array, this variable will have no effect.
# ZSH_THEME_RANDOM_CANDIDATES=( "robbyrussell" "agnoster" )

# Uncomment the following line to use case-sensitive completion.
# CASE_SENSITIVE="true"

# Uncomment the following line to use hyphen-insensitive completion.
# Case-sensitive completion must be off. _ and - will be interchangeable.
# HYPHEN_INSENSITIVE="true"

# Uncomment the following line to disable bi-weekly auto-update checks.
# DISABLE_AUTO_UPDATE="true"

# Uncomment the following line to automatically update without prompting.
# DISABLE_UPDATE_PROMPT="true"

# Uncomment the following line to change how often to auto-update (in days).
# export UPDATE_ZSH_DAYS=13

# Uncomment the following line if pasting URLs and other text is messed up.
# DISABLE_MAGIC_FUNCTIONS=true

# Uncomment the following line to disable colors in ls.
# DISABLE_LS_COLORS="true"

# Uncomment the following line to disable auto-setting terminal title.
# DISABLE_AUTO_TITLE="true"

# Uncomment the following line to enable command auto-correction.
# ENABLE_CORRECTION="true"

# Uncomment the following line to display red dots whilst waiting for completion.
# COMPLETION_WAITING_DOTS="true"

# Uncomment the following line if you want to disable marking untracked files
# under VCS as dirty. This makes repository status check for large repositories
# much, much faster.
# DISABLE_UNTRACKED_FILES_DIRTY="true"

# Uncomment the following line if you want to change the command execution time
# stamp shown in the history command output.
# You can set one of the optional three formats:
# "mm/dd/yyyy"|"dd.mm.yyyy"|"yyyy-mm-dd"
# or set a custom format using the strftime function format specifications,
# see 'man strftime' for details.
# HIST_STAMPS="mm/dd/yyyy"

# Would you like to use another custom folder than $ZSH/custom?
# ZSH_CUSTOM=/path/to/new-custom-folder

# Which plugins would you like to load?
# Standard plugins can be found in ~/.oh-my-zsh/plugins/*
# Custom plugins may be added to ~/.oh-my-zsh/custom/plugins/
# Example format: plugins=(rails git textmate ruby lighthouse)
# Add wisely, as too many plugins slow down shell startup.
plugins=(git vscode web-search z zsh-syntax-highlighting zsh-autosuggestions)

source $ZSH/oh-my-zsh.sh

# User configuration

# export MANPATH="/usr/local/man:$MANPATH"

# You may need to manually set your language environment
# export LANG=en_US.UTF-8

# Preferred editor for local and remote sessions
# if [[ -n $SSH_CONNECTION ]]; then
#   export EDITOR='vim'
# else
#   export EDITOR='mvim'
# fi

# Compilation flags
# export ARCHFLAGS="-arch x86_64"

# Set personal aliases, overriding those provided by oh-my-zsh libs,
# plugins, and themes. Aliases can be placed here, though oh-my-zsh
# users are encouraged to define aliases within the ZSH_CUSTOM folder.
# For a full list of active aliases, run `alias`.
#
# Example aliases
# alias zshconfig="mate ~/.zshrc"
# alias ohmyzsh="mate ~/.oh-my-zsh"

# show user
export DEFAULT_USER="$(whoami)"
  • 保存一下，然后在终端里指定使用 ~/.zshrc。这一步非常重要，配置完 ~/.zshrc 之后都要指定一下。后面不再重复这一点。
source ~/.zshrc
  • 安装 node 相关。
# nvm https://github.com/nvm-sh/nvm
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.0/install.sh | bash
# nvs https://github.com/jasongin/nvs
# fnm https://github.com/Schniz/fnm
export NVM_NODEJS_ORG_MIRROR=https://nodejs.org/dist # use default origin
# export NVM_NODEJS_ORG_MIRROR=https://npmmirror.com/mirrors/node # use china mirror
# install node
nvm install --lts
# set default
nvm alias default node
# use lts
nvm use --lts
# install global deps, --legacy-peer-deps is required if using npm@7 or above
npm uninstall --location=global corepack
npm i --location=global --registry=https://registry.npmmirror.com @nestjs/cli # https://docs.nestjs.com/cli/overview
npm i --location=global --registry=https://registry.npmmirror.com @tarojs/cli # https://docs.taro.zone/
npm i --location=global --registry=https://registry.npmmirror.com @types/node
npm i --location=global --registry=https://registry.npmmirror.com cnpm # https://github.com/cnpm/cnpm
npm i --location=global --registry=https://registry.npmmirror.com eslint # https://eslint.org/
npm i --location=global --registry=https://registry.npmmirror.com nodemon # https://nodemon.io/
npm i --location=global --registry=https://registry.npmmirror.com npm-check-updates # https://github.com/raineorshine/npm-check-updates
npm i --location=global --registry=https://registry.npmmirror.com nrm # https://github.com/Pana/nrm
npm i --location=global --registry=https://registry.npmmirror.com pm2 # https://pm2.keymetrics.io/
npm i --location=global --registry=https://registry.npmmirror.com pnpm # https://pnpm.io/
npm i --location=global --registry=https://registry.npmmirror.com prettier # https://prettier.io/
npm i --location=global --registry=https://registry.npmmirror.com release-it # https://github.com/release-it/release-it
npm i --location=global --registry=https://registry.npmmirror.com serve # https://github.com/vercel/serve
npm i --location=global --registry=https://registry.npmmirror.com sort-package-json # https://github.com/keithamus/sort-package-json
npm i --location=global --registry=https://registry.npmmirror.com stylelint # https://stylelint.io/
npm i --location=global --registry=https://registry.npmmirror.com tsx # https://github.com/esbuild-kit/tsx
npm i --location=global --registry=https://registry.npmmirror.com typescript # https://www.typescriptlang.org/
npm i --location=global --registry=https://registry.npmmirror.com yarn # https://classic.yarnpkg.com/

建议在 ~/.npmrc 添加以下内容。

legacy-peer-deps=true
shamefully-hoist=true
registry=https://registry.npmjs.com/

然后在不需要发布到 npm 的仓库里添加 .npmrc，内容如下。

legacy-peer-deps=true
shamefully-hoist=true
registry=https://registry.npmmirror.com
  • 开始疯狂用 homebrew 安装和配置。
# 驱动
brew tap homebrew/cask-drivers # https://github.com/Homebrew/homebrew-cask-drivers
# 字体
brew tap homebrew/cask-fonts # https://github.com/Homebrew/homebrew-cask-fonts
brew install --cask font-ubuntu-mono # https://design.ubuntu.com/font/
# 不同版本的应用
brew tap homebrew/cask-versions # https://github.com/Homebrew/homebrew-cask-versions

# 阿里云盘，可替代百度网盘，自建网盘参考 seafile，owncloud 和 nextcloud
brew install --cask adrive
# android studio，开发 Android 用
brew install --cask android-studio # https://developer.android.com/studio/
# baidu netdisk，百度网盘，自建网盘参考 seafile，owncloud 和 nextcloud
brew install --cask baidunetdisk # https://pan.baidu.com/download
# bitwarden，管理密码
brew install --cask bitwarden # https://bitwarden.com/
# cheatsheet，长按 Command 键显示当前应用的快捷键
brew install --cask cheatsheet # https://www.cheatsheetapp.com/CheatSheet/
# clashx 客户端
# 机场测试和简介 https://www.duyaoss.com/archives/3/
# 海豚湾 https://cdn99.manage.hitun.io/auth/register?affid=217911
# holytech https://store.holytech.tech/aff.php?aff=2849
# 520ssr https://www.520ssr.co/auth/register?code=oiwx
# iplc.vip https://portal.uuks.club/clientarea.php
# https://github.com/freefq/free
brew install --cask clashx-pro
# cocoapods
brew install cocoapods
# drawio，作图工具
brew install --cask drawio # https://www.draw.io/
# fliqlo，屏保时钟
brew install --cask fliqlo # https://fliqlo.com/
# git，代码版本管理
brew install git # https://git-scm.com/
brew install git-lfs # https://git-lfs.github.com/
git config --global core.autocrlf false
git config --global init.defaultBranch main
git config --global user.name "YOUR_NAME_HERE"
git config --global user.email "YOUR_EMAIL_HERE"
# gradle
brew install gradle
# iina，音视频播放器
brew install --cask iina # https://iina.io/
# insomnia，接口工具
brew install --cask insomnia # https://github.com/Kong/insomnia
# itsycal，日历工具，可以将 macOS 的时间调成 HH:mm:ss 形式，将 itsycal 调成 YYYY-MM-DD 形式
brew install --cask itsycal # https://www.mowglii.com/itsycal/
# lx-music，洛雪音乐助手
brew install --cask lx-music # https://github.com/lyswhut/lx-music-desktop/
# maczip，压缩解压缩工具
brew install --cask maczip
# masscode，代码片段工具
brew install --cask masscode # https://masscode.io/
# microsoft-edge，浏览器
brew install --cask microsoft-edge # https://www.microsoft.com/edge
# mini-program-studio，阿里系小程序开发者工具
brew install --cask mini-program-studio # https://opendocs.alipay.com/mini/ide
# mongodb，文档型数据库
brew tap mongodb/brew # https://github.com/mongodb/homebrew-brew
brew install mongodb-community
brew install --cask mongodb-compass # mongodb official gui
brew services start mongodb/brew/mongodb-community # start when launched
# motrix，下载工具
brew install --cask motrix # https://motrix.app/
# mounty，重新挂载受写保护的 NTFS 卷
brew install --cask mounty # https://mounty.app/
# obs，录屏工具
brew install --cask obs # https://obsproject.com/
# openineditor-lite，在编辑器快速打开当前目录
brew install --cask openineditor-lite # https://github.com/Ji4n1ng/OpenInTerminal
# openinterminal-lite，在终端快速打开当前目录
brew install --cask openinterminal-lite # https://github.com/Ji4n1ng/OpenInTerminal
# openjdk，开发 Android 用
brew install openjdk # https://openjdk.java.net/
# postman，接口工具
brew install --cask postman # https://www.postman.com/
# prince，将 HTML 转换成 PDF
brew install --cask prince # https://www.princexml.com/
# c0re100-qbittorrent，下载工具
# tracker 服务器 https://github.com/XIU2/TrackersListCollection
# tracker 服务器 https://github.com/ngosang/trackerslist
# https://mp.weixin.qq.com/s/YHbqfnXdhju6CXA4epNkVQ
brew install --cask c0re100-qbittorrent
# 也可以安装原版 qbittorrent
# brew install --cask qbittorrent
# qq
brew install --cask qq # https://im.qq.com/macqq/
# rectangle，快速移动、调整窗口大小
brew install --cask rectangle # https://rectangleapp.com/
# snipaste，屏幕截图
brew install --cask snipaste # https://www.snipaste.com/
# subversion，代码版本管理
brew install svn # https://subversion.apache.org/
# tencent-docs，腾讯文档
brew install --cask tencent-docs # https://docs.qq.com/
# tencent-lemon，腾讯柠檬，系统清理和状态工具
brew install --cask tencent-lemon # https://lemon.qq.com/
# tencent-meeting，腾讯会议
brew install --cask tencent-meeting # https://meeting.tencent.com/
# thunder，下载工具
brew install --cask thunder # https://www.xunlei.com/
# utools，效率工具，包括翻译、剪切板、网页快搜的功能的插件支持
# 开源插件见 https://yuanliao.info/d/2168--
brew install --cask utools # https://u.tools/index.html
# watchman
brew install watchman
# wechat
brew install --cask wechat # https://mac.weixin.qq.com/
# wechatwebdevtools，微信小程序开发者工具
brew install --cask wechatwebdevtools # https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html
# wechatwork
brew install --cask wechatwork # https://work.weixin.qq.com/
# wps，支持 doc/docx/xls/xlsx/ppt/pptx/pdf 等多种格式和思维导图，完全满足程序员日常需求
brew install --cask wpsoffice-cn # https://mac.wps.cn/
# you-get，下载网络媒体资源
brew install you-get # https://you-get.org/
# youtube-dl，下载网络媒体资源
brew install youtube-dl
  • 补充一些东西在 ~/.zshrc 末尾。
# nvm
export NVM_DIR="$HOME/.nvm"
# export NVM_NODEJS_ORG_MIRROR=hhttps://npmmirror.com/mirrors/node # use taobao mirror origin
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"  # This loads nvm
[ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion"  # This loads nvm bash_completion

# android
export ANDROID_HOME=$HOME/Library/Android/sdk
export PATH=$PATH:$ANDROID_HOME/emulator
export PATH=$PATH:$ANDROID_HOME/tools
export PATH=$PATH:$ANDROID_HOME/tools/bin
export PATH=$PATH:$ANDROID_HOME/platform-tools

# openjdk
export PATH=/usr/local/opt/openjdk/bin:$PATH

# homebrew
export PATH=/usr/local/sbin:$PATH

# qspace
# alias qs='open -a QSpace'
alias qs='open -a QSpace\ Pro'

更多资源open in new window

Github 仓库同步到 Giteeopen in new window

Windows 补充说明

Windows 和 macOS 生态不同，有几个重要的地方需要注意。

vscode

插件

配置可以通过 Github 账号同步，你也可以使用 Settings Syncopen in new window。

uni-* 可以考虑 uni-helperopen in new window。

settings.json

{
  // 插件 Code Spell Checker 使用，指定语言
  "cSpell.language": "en,en-US",
  // 插件 Code Spell Checker 使用，指定要检查的语言
  "cSpell.enabledLanguageIds": [
    "css",
    "html",
    "javascript",
    "javascriptreact",
    "json",
    "jsonc",
    "json5",
    "less",
    "markdown",
    "plaintext",
    "sass",
    "scss",
    "svelte",
    "text",
    "typescript",
    "typescriptreact",
    "vue",
    "yaml",
    "yml"
  ],
  // vscode 自带功能，不校验 css，需要和插件 Stylelint 配合使用
  "css.validate": false,
  // vscode 自带功能，编辑区默认使用 prettier 格式化，需要安装插件 Prettier
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  // vscode 自带功能，指定字体族
  "editor.fontFamily": "'Jetbrains Mono', Menlo, Monaco, 'Courier New', monospace",
  // vscode 自带功能，保存时自动格式化
  "editor.formatOnSave": true,
  // vscode 自带功能，允许编辑区成对括号指引线着色，不再需要 Bracket Pair Colorizer
  "editor.guides.bracketPairs": true,
  // vscode 自带功能，自动修改对应的标签名称，不再需要 Auto Rename Tag
  "editor.linkedEditing": true,
  // vscode 自带功能，编辑区 1 个 tab 等于 2 个空格
  "editor.tabSize": 2,
  // vscode 自带功能，编辑区行太长时自动换行
  "editor.wordWrap": "on",
  // 插件 ESLint 使用，指定需要 ESLint 校验的语言
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    "svelte",
    "typescript",
    "typescriptreact",
    "vue"
  ],
  // 插件 ESLint 使用，一直显示状态
  "eslint.alwaysShowStatus": true,
  // vscode 自带功能，设置文件换行为 \n (LF)
  "files.eol": "\n",
  // vscode 自带功能，指定特定后缀的文件的解析器，这里添加微信小程序、支付宝小程序、百度小程序、头条小程序、wepy 和 uni-app 的支持，另外把一些 json 文件视为 jsonc 文件
  "files.associations": {
    "*.wxml": "html",
    "*.wxs": "javascript",
    "*.wxss": "css",
    "*.axml": "html",
    "*.sjs": "javascript",
    "*.acss": "css",
    "*.swan": "html",
    "*.ttml": "html",
    "*.ttss": "css",
    "*.jxml": "html",
    "*.jxss": "css",
    "*.wpy": "vue",
    "*.nvue": "vue",
    "*.ux": "vue",
    "manifest.json": "jsonc",
    "pages.json": "jsonc",
    "tsconfig.json": "jsonc",
    "settings.json": "jsonc"
  },
  // vscode 自带功能，允许 git 提交不检验
  "git.allowNoVerifyCommit": true,
  // vscode 自带功能，git 自动 fetch
  "git.autofetch": true,
  // vscode 自带功能，js 文件移动时自动更新引入
  "javascript.updateImportsOnFileMove.enabled": "always",
  // 插件 leetcode 使用，编辑器中的快捷操作显示
  "leetcode.editor.shortcuts": ["submit", "test", "star", "solution", "description"],
  // 插件 leetcode 使用，指定使用 leetcode-cn
  "leetcode.endpoint": "leetcode-cn",
  // 插件 leetcode 使用，指定文件存放的文件夹
  "leetcode.workspaceFolder": "/Users/wurui/Documents/leetcode",
  // 插件 leetcode 使用，指定文件默认语言
  "leetcode.defaultLanguage": "typescript",
  // vscode 自带功能，不校验 less，需要和插件 Stylelint 配合使用
  "less.validate": false,
  // vscode 自带功能，不校验 scss，需要和插件 Stylelint 配合使用
  "scss.validate": false,
  // 插件 Stylelint 使用，指定需要提示的语言
  "stylelint.snippet": ["css", "less", "sass", "scss", "vue", "svelte"],
  // 插件 Stylelint 使用，指定需要校验的语言
  "stylelint.validate": ["css", "less", "sass", "scss", "vue", "svelte"],
  // vscode 自带功能，ts 文件移动时自动更新引入
  "typescript.updateImportsOnFileMove.enabled": "always",
  // vscode 自带功能，自动切换主题
  "window.autoDetectColorScheme": true,
  // vscode 自带功能，当前主题
  "workbench.colorTheme": "GitHub Light Default",
  // vscode 自带功能，指定 md 文件的预览模式为默认
  "workbench.editorAssociations": {
    "*.md": "default"
  },
  // vscode 自带功能，指定图标主题为 vscode-icons，需要安装插件 vscode-icons
  "workbench.iconTheme": "vscode-icons",
  // vscode 自带功能，自动切换主题的偏好
  "workbench.preferredLightColorTheme": "GitHub Light Default",
  "workbench.preferredDarkColorTheme": "GitHub Dark Default",
  // vscode 自带功能，控制编辑区在保存文件时的行为
  "[javascript]": {
    "editor.codeActionsOnSave": {
      "source.fixAll.eslint": true
    }
  },
  "[javascriptreact]": {
    "editor.codeActionsOnSave": {
      "source.fixAll.eslint": true
    }
  },
  "[typescript]": {
    "editor.codeActionsOnSave": {
      "source.fixAll.eslint": true
    }
  },
  "[typescriptreact]": {
    "editor.codeActionsOnSave": {
      "source.fixAll.eslint": true
    }
  },
  "[css]": {
    "editor.codeActionsOnSave": {
      "source.fixAll.stylelint": true
    }
  },
  "[less]": {
    "editor.codeActionsOnSave": {
      "source.fixAll.stylelint": true
    }
  },
  "[sass]": {
    "editor.codeActionsOnSave": {
      "source.fixAll.stylelint": true
    }
  },
  "[scss]": {
    "editor.codeActionsOnSave": {
      "source.fixAll.stylelint": true
    }
  },
  "[svelte]": {
    "editor.codeActionsOnSave": {
      "source.fixAll.eslint": true,
      "source.fixAll.stylelint": true
    }
  },
  "[vue]": {
    "editor.codeActionsOnSave": {
      "source.fixAll.eslint": true,
      "source.fixAll.stylelint": true
    }
  },
  "[markdown]": {
    "editor.formatOnSave": true,
    "editor.codeActionsOnSave": {
      "source.fixAll.markdownlint": true
    }
  },
  "yaml.customTags": [
    "!And",
    "!And sequence",
    "!If",
    "!If sequence",
    "!Not",
    "!Not sequence",
    "!Equals",
    "!Equals sequence",
    "!Or",
    "!Or sequence",
    "!FindInMap",
    "!FindInMap sequence",
    "!Base64",
    "!Join",
    "!Join sequence",
    "!Cidr",
    "!Ref",
    "!Sub",
    "!Sub sequence",
    "!GetAtt",
    "!GetAZs",
    "!ImportValue",
    "!ImportValue sequence",
    "!Select",
    "!Select sequence",
    "!Split",
    "!Split sequence"
  ],
  "redhat.telemetry.enabled": false
}

hbuilderx

构建使用 uni-app 开发的 app，用于调试运行、下载发布，其他情况使用 vscode。

点击左上角 HBuilderX => 偏好设置 => 源码视图，可以自定义配置。下面是我自己的自定义配置。node 和 npm 路径不正确会导致一直编译中。

{
  "editor.colorScheme": "Atom One Dark",
  "editor.insertSpaces": true,
  "editor.tabSize": 2,
  "editor.wordWrap": true,
  "eslint-js.validateOnDocumentChanged": true,
  "eslint-vue.validateOnDocumentChanged": true,
  "node.path": "/Users/wurui/.nvm/versions/node/v16.14.0/bin/node",
  "npm.path": "/Users/wurui/.nvm/versions/node/v16.14.0/bin/npm"
}

看起来数字天堂团队并没有完善的项目开发流程，导致某些时候 vue-cli 创建的项目依赖版本和 HBuilderX 的依赖版本不一致。

  • 回退版本
  • 查看 HBuilderX -> plugins -> uniapp-cli 的依赖版本

另外，他们也尝试做自己的生态，比如 nvue 和 uni_modules，这些都有着不少的坑。如果不是为了跨端，没有必要使用 uni-app。如果是为了跨端，也可以尝试优秀的 React 系框架，如 taro、remax、rax、expo，也可以考虑 cordovaopen in new window、electronopen in new window、ionicopen in new window、capacitoropen in new window、native-scriptopen in new window、flutteropen in new window。

参考