node20的安装和vue的入门准备

一、node20的安装

直接下载路径：https://nodejs.org/download/release/v20.11.0/node-v20.11.0-x64.msi

安装，双击msi文件

点击同意协议

更改下载路径

什么也不用选，点击next进行下一步

什么也不用选，点击next进行下一步

点击安装

安装完成，点击finish

验证是否安装成功

二、vue的入门准备

首先必须保证安装有node

1.使用 Vite 创建 Vue 3 项目

Vite 是一款轻量级且高效的构建工具，适合快速搭建 Vue 3 项目。

 安装 Vite（若未安装）

npm install -g create-vite

创建项目

npm init vue@latest

或者

npm init vite@latest

然后其他按回车键忽略即可

进入项目目录

cd vite-demo

安装依赖

npm install

启动开发服务器

npm run dev

之后在浏览器中访问 http://localhost:5173 就能看到项目页面。

项目构建

npm run build

这会在 dist 目录生成优化后的静态文件。 

预览生产构建

构建完成后，你可以使用以下命令本地预览生产版本：

npm run preview

2.使用 Vue CLI 创建 Vue 3 项目

安装 Vue CLI（若未安装）

npm install -g @vue/cli

创建项目

 vue create vue-demo2  

直接回车

进入项目目录

cd vue-demo2

启动开发服务器

npm run serve

访问 http://localhost:8080 可查看项目。

 

项目构建

npm run build

构建产物会存于 dist 目录。