婚恋咨询网站运营,做速卖通代码的网站,金融网站建设公司排名,调查网站赚钱一、手动创建
1.创建vite-Demo文件夹 2.初始化 yarn init -y 3.安装vite yarn add -D vite 4.打包准备
说明#xff1a;不需要在src下面创建#xff0c;在vite-Demo文件夹创建
4.1index.js文件
document.body.insertAdjacentHTML(beforeend,h1…一、手动创建
1.创建vite-Demo文件夹 2.初始化 yarn init -y 3.安装vite yarn add -D vite 4.打包准备
说明不需要在src下面创建在vite-Demo文件夹创建
4.1index.js文件
document.body.insertAdjacentHTML(beforeend,h1你好vite/h1)
4.2index.html文件
说明 script typemodule src./index.js/script中module很关键。浏览器以 ES 模块的方式加载 JavaScript 文件。
!DOCTYPE html
html langen
headmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0titleDocument/titlescript typemodule src./index.js/script
/head
body/body
/html
5.打包
说明相当于运行在服务器实际没有打包 yarn vite 6.构建
说明因为 build 命令会生成优化和压缩后的静态文件而不是一个开发服务器。要查看打包后的效果你需要将生成的静态文件部署到一个 Web 服务器上然后通过浏览器访问部署后的应用程序。 yarn vite build 7.预览
说明预览打包后的代码可以解决本地查看构建效果不用放在服务器 yarn vite preview 二、 一键式启动
1.命令 yarn create vite 说明但是报错。 2.解决问题
说明执行下面代码查看是否在同一个盘符。我这很明显不是 yarn global dir yarn global bin 解决
说明路径就是安装node位置的地方 yarn config set global-folder D:\universal\nvm\v16.20.1\node_global yarn config set prefix D:\universal\nvm\v16.20.1\node_cache 再次查看 完美结局
3. 输入项目名称 4.本人输入的是vite_demo2 5.选择Vanilla
说明Vanilla 通常用来指代原始的、未经框架或库封装的纯粹的编程语言或技术。也就是JavaScript。 6.选择JavaScript 7.创建成功
