------------------------------------------------
安装
nodejs版本
curl -sL https://rpm.nodesource.com/setup_16.x | sudo bash - #默认
rm /etc/yum.repos.d/nodesource-nodejs.repo #清理源
yum clean all
yum makecache
curl -sL https://rpm.nodesource.com/setup_20.x | sudo bash - #指定
yum search nodejs
yum info nodejs
安装指定包
yum install -y nodejs-20.18.0 #不支持centos7
yum install -y nodejs-16.14.0
yum remove -y nodejs-16.14.0
------------------------------------------------
# 卸载旧的 nodejs 和 npm
sudo apt remove -y nodejs npm
sudo apt purge -y nodejs npm
sudo apt autoremove -y
# 删除可能残留的 node 相关文件（谨慎执行）
sudo rm -rf /usr/local/lib/node_modules
sudo rm -rf ~/.npm
sudo rm -rf ~/.node-gyp
------------------------------------------------
# 安装 Node.js 20 最新版本，推荐用官方 NodeSource 源
curl -fsSL https://deb.nodesource.com/setup_20.x | sudo -E bash -
sudo apt-get install -y nodejs
# 验证版本
node -v
npm -v
# 安装 vite 创建脚手架的命令
npm create vite@latest lbu_vue -- --template vue-ts
cd lbu_vue
# 安装依赖
npm install
# 本地开发启动
npm run dev -- --host 0.0.0.0
------------------------------------------------
vim package.json
重要：同步修改项目文件夹中的package.json
{
"name": "lbu_vue",
"version": "0.0.1",
"private": true,
"scripts": {
"dev": "vite",
"build": "vite build",
"preview": "vite preview",
"type-check": "vue-tsc --noEmit"
},
"dependencies": {
"vue": "^3.3.4",
"vue-router": "^4.2.2",
"pinia": "^2.1.9"
},
"devDependencies": {
"@vitejs/plugin-vue": "^4.6.2",
"typescript": "^5.1.3",
"vite": "^5.2.8",
"vue-tsc": "^1.8.11",
"@vue/tsconfig": "^0.4.0"
}
}
------------------------------------------------
vim Dockerfile
FROM registry.cn-hangzhou.aliyuncs.com/leiuvn/node:20-alpine
# 设置工作目录
WORKDIR /app
# 复制 package.json 和 package-lock.json（如果有）
COPY package*.json ./
# 安装依赖
RUN npm install
# 复制所有文件（这里可选，如果你要挂载 volume，则这步可省）
COPY . .
# 暴露 Vite 默认端口
EXPOSE 5173
# 默认启动命令：启动开发服务器，允许外部访问
CMD ["npm", "run", "dev", "--", "--host", "0.0.0.0"]
------------------------------------------------
version: "3"
services:
lbu_vue:
build: .
container_name: lbu_vue
working_dir: /app
volumes:
- /data/wwwroot/lbu_vue:/app # 把当前宿主机的项目挂载到容器
- /app/node_modules # 避免 node_modules 被宿主机覆盖
ports:
- "5173:5173"
command: ["/bin/sh", "-c", "npm run build && npm run dev -- --host 0.0.0.0"]
networks:
lbu_net:
ipv4_address: 172.20.0.3
mem_limit: 8g
cpus: 4.0
networks:
lbu_net:
external: true
------------------------------------------------
export default defineConfig({
plugins: [vue()],
server: {
// 允许的主机
allowedHosts: ['vue.lbu.cn', 'localhost', '127.0.0.1']
}
})
------------------------------------------------
配置页面
------------------------------------------------