pnpm 项目最佳实践

1,554 阅读2分钟

1、安装pnpm

npm install -g pnpm

2、在项目目录删掉node_modules, 如果是umi项目还要删除src 中的.umi

小技巧 删除所有项目 node_modules并且使用pnpm

find . -name "node_modules" -exec rm -rf {} ;

切换到项目目录, 比如 workspace,然后在控制台运行下面命令,可以把当前目录下所有的 node_modules (包括子目录)都删除掉。

3、 项目目录新建.npmrc

side-effects-cache=false 一定要设置,目前官方还没有解决这个问题 具体看 github.com/pnpm/pnpm/i…

# 项目目录新建.npmrc

# side-effects-cache pnpm 开启的话可能导致异常。
side-effects-cache=false
strict-peer-dependencies=false
auto-install-peers=false

xprofiler_binary_host_mirror=https://npmmirror.com/mirrors/xprofiler
sentrycli_cdnurl=https://npmmirror.com/mirrors/sentry-cli/
ELECTRON_MIRROR=https://npmmirror.com/mirrors/electron/
chromedriver_cdnurl=https://npmmirror.com/mirrors/chromedriver
puppeteer_download_host=https://npmmirror.com/mirrors
PUPPETEER_DOWNLOAD_HOST=https://npmmirror.com/mirrors
disturl=https://npmmirror.com/dist
chromedriver-cdnurl=https://npmmirror.com/mirrors/chromedriver
couchbase-binary-host-mirror=https://npmmirror.com/mirrors/couchbase/v{version}
debug-binary-host-mirror=https://npmmirror.com/mirrors/node-inspector
electron-mirror=https://npmmirror.com/mirrors/electron/
flow-bin-binary-host-mirror=https://npmmirror.com/mirrors/flow/v
fse-binary-host-mirror=https://npmmirror.com/mirrors/fsevents
fuse-bindings-binary-host-mirror=https://npmmirror.com/mirrors/fuse-bindings/v{version}
git4win-mirror=https://npmmirror.com/mirrors/git-for-windows
gl-binary-host-mirror=https://npmmirror.com/mirrors/gl/v{version}
grpc-node-binary-host-mirror=https://npmmirror.com/mirrors
hackrf-binary-host-mirror=https://npmmirror.com/mirrors/hackrf/v{version}
leveldown-binary-host-mirror=https://npmmirror.com/mirrors/leveldown/v{version}
leveldown-hyper-binary-host-mirror=https://npmmirror.com/mirrors/leveldown-hyper/v{version}
mknod-binary-host-mirror=https://npmmirror.com/mirrors/mknod/v{version}
node-sqlite3-binary-host-mirror=https://npmmirror.com/mirrors
node-tk5-binary-host-mirror=https://npmmirror.com/mirrors/node-tk5/v{version}
nodegit-binary-host-mirror=https://npmmirror.com/mirrors/nodegit/v{version}/
operadriver-cdnurl=https://npmmirror.com/mirrors/operadriver
phantomjs-cdnurl=https://npmmirror.com/mirrors/phantomjs
profiler-binary-host-mirror=https://npmmirror.com/mirrors/node-inspector/
puppeteer-download-host=https://npmmirror.com/mirrors
python-mirror=https://npmmirror.com/mirrors/python
rabin-binary-host-mirror=https://npmmirror.com/mirrors/rabin/v{version}
sass-binary-site=https://npmmirror.com/mirrors/node-sass
sodium-prebuilt-binary-host-mirror=https://npmmirror.com/mirrors/sodium-prebuilt/v{version}
sqlite3-binary-site=https://npmmirror.com/mirrors/sqlite3
utf-8-validate-binary-host-mirror=https://npmmirror.com/mirrors/utf-8-validate/v{version}
utp-native-binary-host-mirror=https://npmmirror.com/mirrors/utp-native/v{version}
zmq-prebuilt-binary-host-mirror=https://npmmirror.com/mirrors/zmq-prebuilt/v{version}

4、执行pnpm i 安装

5、npm run dev 处理幽灵依赖

比如下面报错

ERROR in src/views/relatedSold/widget/currentProduct.vue:34:1
TS2354: This syntax requires an imported helper but module 'tslib' cannot be found.

解决方案:执行pnpm add -D tslib 安装到devDependencies

 Cannot find name 'require'. Do you need to install type definitions for node? Try `npm i --save-dev @types/node` and then add 'node' to the types field in your tsconfig.

执行pnpm add -D @types/node 安装到devDependencies

同时设置tsconfig.json中添加 node 即 "types": ["node"]

Module not found: Error: Can't resolve 'url-loader' in '/Users/hanfei/Documents/zhuanzhuan/bm_consign'

遇到类似找不到的devDependencies包

执行pnpm add -D url-loader 安装到devDependencies

TS2307: Cannot find module 'lodash.debounce' or its corresponding type declarations.

遇到类似找不到的dependencies包

执行pnpm add lodash.debounce 安装到dependencies

遇到的git commit 提交失败

--no-install is not in the npm registry
// 执行下面命令升级husky到8 // pre-commit 中添加需要的执行命令
pnpm install husky@8 --save-dev \           
  && pnpx husky-init \
  && pnpx -- github:typicode/husky-4-to-8 --remove-v4-config
  
npx husky add .husky/commit-msg 'npx commitlint --edit $1'

6. pnpm run build执行一下 看看有没有报错