vite基础学习笔记：1. 环境搭建

说明：自学做的笔记记录，如有错误请指正

1.构建Vite项目 （vite官网）

---

注意：若选择PNPM命令安装方式则需要先安装

1.1 安装PNPM

①全局安装

 npm install  -g pnpm

②设置源

pnpm config set registry http://registry.npm.taobao.org/   //切换淘宝源
pnpm config get registry //查看源

③查看版本信息

npm i pnpm -g

操作截图如下：

---

1.2 使用PNPM搭建vite项目

①输入命令,回车

pnpm create vite

②输入项目名称，回车
③选择一个框架（例如：vue），回车

④选择语言后（例如：TypeScript），回车

则项目创建完毕。

创建好后，桌面出现vite-project项目

2. 运行项目

2.1 安装依赖

①切换至项目文件夹

②输入pnpm i安装依赖后，出现node_modules文件夹

2.2 运行项目

输入pnpm run dev运行项目
点击链接跳转至浏览器

3. 其他设置

3.1 浏览器自动打开

找到 package.json 配置文件！

 "scripts": {
 //添加**--open**
  "dev": "vite --open",
  "build": "vue-tsc && vite build",
  "preview": "vite preview"
 },

3.2 项目重置样式

①npm官网搜索reset.scss


在路径…src/style 下新增reset.scss文件
②出现报错

安装scss：指令pnpm i sass