Vite:一款前端构建工具。 官网地址:https://cn.vitejs.dev 二、依赖 1、Node.js。下载和安装环境略过。 三、基于Vite创建Vue3项目 3.1、创建vite npm create vite@latest 之后跟随引导,操作以下3个命令启动程序。 拿到启动url 浏览器启动,启动成功了。 本地文件夹目录如下: 之后,将文件夹目录拖到VSCode。 3.2...
安装完成后 (在项目根目录会出现.eslintrc.cjs或.eslintrc.js文件) 如果没有则手动创建一个.eslintrc.cjs 若为.eslintrc.js需要改名为.eslintrc.cjs 1.3 安装vite-plugin-eslint // 该包是用于配置vite运行的时候自动检测eslint规范,不符合页面会报错 pnpm add vite-plugin-eslint@latest -D // 安装最...
小编的npm的版本是9.3.1,所以在终端输入如下代码:npm init vite@latest vue-firstdemo -- --template vue这里的vue-firstdemo是创建项目的名字噢~ 我们的项目创建完成啦,接着根据提示, 输入cd vue-firstdemo进入创建的项目,输入npm install安装依赖。 最后输入npm run dev运行项目,我们可以发现,使用vite运行起来速...
用vscode打开刚创建的工程目录,粘贴以下代码到vite.config.js中,项目启动时会自动读取该文件。 (本项目针对公共基础路径、自定义路径别名、服务器选项、构建选项等做了如下基础配置) import { defineConfig } from 'vite'; import { resolve } from 'path'; import vue from '@vitejs/plugin-vue'; export defa...
在之前的文章中写过“如何创建第一个vue项目”,但那篇文章写的是创建vue2的 项目。 传送门如何创建第一个vue项目 打开Vue.js官网:https://cn.vuejs.org/,我们会发现Vue 2将于 2023 年 12 月 31 日停止维护 vue2停止维护 虽然Vue2的项目还不少,但是官方尤大大都在拥抱Vue3。
第一步:使用命令行创建工程 在磁盘的合适位置上,创建一个空目录用于存储多个前端项目 用vscode打开该目录 在vocode中打开命令行运行如下命令 代码语言:javascript 第一次使用vite时会提示下载vite,输入y回车即可,下次使用vite就不会出现了 注意:选择vue+JavaScript选项即可 ...
要开始创建一个Vue3项目,我们首先需要安装Node.js和npm(Node包管理器)。安装完成后,我们可以全局安装Vite: ``` npm install -g create-vite ``` 然后,我们可以使用以下命令来创建一个Vue3项目: ``` create-vite my-project --template vue ``` 这将在当前目录下创建一个名为"my-project"的文件夹,并使用...
创建项目 官方提供了多种创建命令,如下: npminit vite@latest yarncreate vite pnpmcreate vite 根据自己的情况选择合适的命令即可,我使用的是pnpm,所以: pnpmcreate vite 然后会让给你输入一个项目名称。再选择一个framework,因为我们创建vue3项目,所以选择vue即可。再选择代码语言,我习惯使用JavaScript。如下: ...
Vite创建Vue 3项目 Vite提供了两种创建项目的命令,手动创建项目的命令和通过模板自动创建项目的命令。 1.手动创建项目的命令 使用npm或yarn包管理工具都可以搭配Vite手动创建项目,具体命令如下。 #使用npm create命令创建项目 npm create vite@latest #使用yarn create命令创建项目 ...