在Alpine Linux上安裝和使用Node.js，打造開發和測試的環境。

apk倉庫打開社區的源。

先在命令行中使用命令apk search nodejs npm yarn對倉庫源進行搜索，，看看nodejs、yarn、npm的版本情況。

localhost:~# apk search nodejs npm yarn
nodejs-20.15.1-r0
nodejs-current-21.7.3-r0
nodejs-current-dev-21.7.3-r0
nodejs-current-doc-21.7.3-r0
nodejs-dev-20.15.1-r0
nodejs-doc-20.15.1-r0
nodejs-libs-20.15.1-r0
npm-10.8.0-r0
npm-bash-completion-10.8.0-r0
npm-doc-10.8.0-r0
pulumi-language-nodejs-3.115.0-r3
py3-hatch-nodejs-version-0.3.2-r1
py3-hatch-nodejs-version-pyc-0.3.2-r1
xen-4.18.3-r1
yarn-1.22.22-r0
localhost:~# 

安裝Node.js：

localhost:~# apk add nodejs
fetch http://mirrors.ustc.edu.cn/alpine/v3.20/main/x86_64/APKINDEX.tar.gz
fetch http://mirrors.ustc.edu.cn/alpine/v3.20/community/x86_64/APKINDEX.tar.gz
(1/5) Installing ada-libs (2.7.8-r0)
(2/5) Installing libbase64 (0.5.2-r0)
(3/5) Installing icu-data-en (74.2-r0)
Executing icu-data-en-74.2-r0.post-install
*
* If you need ICU with non-English locales and legacy charset support, install
* package icu-data-full.
*
(4/5) Installing icu-libs (74.2-r0)
(5/5) Installing nodejs (20.15.1-r0)
Executing busybox-1.36.1-r29.trigger
OK: 582 MiB in 124 packages

確認Node.js已經正確安裝并正在運行：

localhost:~# node -v
v20.15.1

安裝npm：

localhost:~# apk add npm
(1/1) Installing npm (10.8.0-r0)
Executing busybox-1.36.1-r29.trigger
OK: 594 MiB in 125 packages

確認npm已經正確安裝并正在運行：

localhost:~# npm -v 
10.8.0

為npm配置國內倉庫：

localhost:~# npm config set registry https://registry.npmmirror.com

使用npm包管理器全局安裝vue：

localhost:~# npm install -g @vue/cli
npm warn deprecated urix@0.1.0: Please see https://github.com/lydell/urix#deprecated
npm warn deprecated resolve-url@0.2.1: https://github.com/lydell/resolve-url#deprecated…… 略 ……npm warn deprecated subscriptions-transport-ws@0.11.0: The `subscriptions-transport-ws` package is no longer maintained. We recommend you use `graphql-ws` instead. For help migrating Apollo software to `graphql-ws`, see https://www.apollographql.com/docs/apollo-server/data/subscriptions/#switching-from-subscriptions-transport-ws    For general help using `graphql-ws`, see https://github.com/enisdenjo/graphql-ws/blob/master/README.md
npm warn deprecated vue@2.7.16: Vue 2 has reached EOL and is no longer actively maintained. See https://v2.vuejs.org/eol/ for more details.added 838 packages in 1m75 packages are looking for fundingrun `npm fund` for details

創建一個vue項目測試一下：

localhost:~# npm create vue@latest
Need to install the following packages:
create-vue@3.11.0
Ok to proceed? (y) y> npx
> create-vueVue.js - The Progressive JavaScript FrameworkRangeError: Incorrect locale information provided? Project name: … vuedemo
? Add TypeScript? … No / Yes
? Add JSX Support? … No / Yes
? Add Vue Router for Single Page Application development? … No / Yes
? Add Pinia for state management? … No / Yes
? Add Vitest for Unit Testing? … No / Yes
? Add an End-to-End Testing Solution? ? No
? Add ESLint for code quality? … No / Yes
? Add Prettier for code formatting? … No / Yes
? Add Vue DevTools 7 extension for debugging? (experimental) … No / YesScaffolding project in /root/vuedemo...Done. Now run:cd vuedemonpm installnpm run formatnpm run dev

創建完成后，進入目錄中安裝并運行項目

localhost:~# cd vuedemo
localhost:~/vuedemo# npm installadded 312 packages in 48s82 packages are looking for fundingrun `npm fund` for details
localhost:~/vuedemo# npm run format> vuedemo@0.0.0 format
> prettier --write src/src/App.vue 318ms
src/assets/base.css 46ms (unchanged)
src/assets/main.css 14ms (unchanged)
src/components/HelloWorld.vue 109ms
src/components/icons/IconCommunity.vue 20ms
src/components/icons/IconDocumentation.vue 12ms
src/components/icons/IconEcosystem.vue 17ms
src/components/icons/IconSupport.vue 6ms
src/components/icons/IconTooling.vue 9ms (unchanged)
src/components/TheWelcome.vue 84ms
src/components/WelcomeItem.vue 64ms (unchanged)
src/main.ts 32ms (unchanged)
src/router/index.ts 26ms
src/stores/counter.ts 48ms (unchanged)
src/views/AboutView.vue 16ms (unchanged)
src/views/HomeView.vue 11ms (unchanged)

修改package.json文件。找到scripts下面的dev，在vite后面添加--host 0.0.0.0，

localhost:~/vuedemo# cat package.json 
{"name": "vuedemo","version": "0.0.0","private": true,"type": "module","scripts": {"dev": "vite --host 0.0.0.0","build": "run-p type-check \"build-only {@}\" --","preview": "vite preview","build-only": "vite build","type-check": "vue-tsc --build --force","lint": "eslint . --fix","format": "prettier --write src/"},"dependencies": {"pinia": "^2.2.4","vue": "^3.5.11","vue-router": "^4.4.5"},"devDependencies": {"@tsconfig/node20": "^20.1.4","@types/node": "^20.16.11","@vitejs/plugin-vue": "^5.1.4","@vue/eslint-config-prettier": "^10.0.0","@vue/eslint-config-typescript": "^14.0.0","@vue/tsconfig": "^0.5.1","eslint": "^9.12.0","eslint-plugin-vue": "^9.28.0","npm-run-all2": "^6.2.3","prettier": "^3.3.3","typescript": "~5.5.4","vite": "^5.4.8","vite-plugin-vue-devtools": "^7.4.6","vue-tsc": "^2.1.6"}
}

運行開發模式：

localhost:~/vuedemo# npm run dev> vuedemo@0.0.0 dev
> vite --host 0.0.0.0VITE v5.4.8  ready in 1163 ms?  Local:   http://localhost:5173/?  Network: http://192.168.10.153:5173/?  Vue DevTools: Open http://localhost:5173/__devtools__/ as a separate window?  Vue DevTools: Press Alt(?)+Shift(?)+D in App to toggle the Vue DevTools?  press h + enter to show help

遠程機器的瀏覽器瀏覽結果：

安裝yarn：

yarn和npm其實二選一即可，當然想兩個都安裝也可以。

localhost:~# apk add yarn
(1/1) Installing yarn (1.22.22-r0)
Executing busybox-1.36.1-r29.trigger
OK: 599 MiB in 126 packages

yarn的功能就不重復測試了。