Vue3学习记录

创建项目的方式1:

npm init vite@latest

在使用npm命令行工具时,@latest标签用于指定包的最新稳定版本。当你在npm命令中看到@latest,这表示你正在引用NPM仓库中的最新版本。

在具体场景npm init vite@latest中,vite是包的名字,而@latest是版本范围指示符。当你执行这个命令,npm会查找vite包的最新稳定版,并根据找到的版本来初始化你的项目。如果没有指定任何版本或版本范围,npm也会默认使用@latest。

因此,npm init vite@latest将会创建一个使用Vite最新稳定版本的新项目。这样可以确保你使用的是该包的最新功能和修复过的bug,但同时你也要接受可能带来的API变化或不兼容性风险。

如果你希望指定一个确切的版本,你可以替换@latest为你想要的确切版本号,例如npm init vite@2.9.7。这样做可以避免未来无意中升级到有重大改变的新版本,从而保持项目的稳定性。

create-vite@5.3.0

运行后提示:

now run:

cd myfirstweb

npm install

npm run dev

创建项目的方式2:

npm create vue@latest

code.visualstudio.com/download

http://localhost:5173/

server:{

host:'0.0.0.0',

port:8088,

open:true

}

打包放到linux的nginx服务器上的命令:

npm run build

快速启动VSCode编辑器查看程序

cmd窗口下,进入程序目录

执行下面的命令

复制代码
code .

设置 Node.js 的全局安装前缀路径

npm config set prefix "d:\develop\nodejs"

"d:\develop\nodejs"这个是NodeJS的安装目录。

npm config set prefix 命令用于设置 Node.js 的全局安装前缀路径。当你使用 npm install -g 命令全局安装一个 npm 包时,这个包会被安装到由 prefix 配置项所指定的目录下。

这条命令会将全局模块的安装路径设置为 "d:\develop\nodejs"。这意味着以后所有的全局模块都会被安装到这个目录下。

为了确保全局模块能够被系统识别,你可能还需要将这个目录添加到系统的 PATH 环境变量中。这样,你就可以从命令行的任何地方调用全局安装的 npm 包所提供的命令了。

更换安装包的镜像源

npm config set registry http://registry.npm.taobao.org/

检查是否更换成功?

npm config get registry

数组名后面要加 :

例如: arr:[]

表格:

复制代码
        <table>
        <tr v-for="(item, index) in alist">
            <td>{{item.title}}</td><td>{{item.content}}</td><td><button>编辑</button><button>删除</button></td>
        </tr>
      </table>

数组和单一对象的区别:

数组:

customer: [ { name: "张三", level: 3 } ]

访问数据 :你必须通过索引访问数组中的对象,例如 customer[0].namecustomer[0].level

当 customer 被定义为单一对象:customer: { name: "张三", level: 3 }

访问数据 :你可以直接访问对象的属性,如 customer.namecustomer.level

使用数组适合处理多个具有相同结构的对象的情况,通常配合 v-for 循环使用。

使用单一对象适用于处理单个实体的情况,可以直接引用其属性。

相关推荐
西岸行者10 天前
学习笔记:SKILLS 能帮助更好的vibe coding
笔记·学习
悠哉悠哉愿意10 天前
【单片机学习笔记】串口、超声波、NE555的同时使用
笔记·单片机·学习
别催小唐敲代码10 天前
嵌入式学习路线
学习
毛小茛10 天前
计算机系统概论——校验码
学习
babe小鑫10 天前
大专经济信息管理专业学习数据分析的必要性
学习·数据挖掘·数据分析
winfreedoms10 天前
ROS2知识大白话
笔记·学习·ros2
在这habit之下10 天前
Linux Virtual Server(LVS)学习总结
linux·学习·lvs
我想我不够好。10 天前
2026.2.25监控学习
学习
im_AMBER10 天前
Leetcode 127 删除有序数组中的重复项 | 删除有序数组中的重复项 II
数据结构·学习·算法·leetcode
CodeJourney_J10 天前
从“Hello World“ 开始 C++
c语言·c++·学习