3.1、创建vite npm create vite@latest 之后跟随引导,操作以下3个命令启动程序。 拿到启动url 浏览器启动,启动成功了。 本地文件夹目录如下: 之后,将文件夹目录拖到VSCode。 3.2、删除文件 src/style.css src/components/HelloWord.vue 3.3、删除代码 刚刚删除代码的引用。 四、Vue3好用的VsCode插件 4.1、Vue-Offi...
const app = createApp(App) app.use(ElementPlus) 2.导入element-plus图标 pnpm i @element-plus/icons-vue 需要的页面导入对应的图标,下面就是Edit图标的导入 import { Edit } from '@element-plus/icons-vue' 3.配置element-plus国际化,下面配置的是中文 // 引入element-plus国际化 import zhCn from ...
npm install vue-router@4 //新建 router/index.ts import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router'; const routes: Array<RouteRecordRaw> = [ { path: '/', redirect: '/home', }, { path: '/home', name: 'Home', component: () => import('@/views/Home.vue...
[ vue(), // 压缩 viteCompression({ algorithm: 'gzip', // 压缩算法,可选[‘gzip’,‘brotliCompress’,‘deflate’,‘deflateRaw’] threshold: 10240, // 如果体积大于阈值,则进行压缩,单位为b deleteOriginFile: true // 压缩后是否删除源文件 }), createSvgIconsPlugin({ // 指定需要缓存的图标文件...
pnpm create vite vue-ts-app --template vue-ts 三、运行项目 安装插件:npm install 运行项目:npm run dev { "name": "vue-ts-app", "private": true, "version": "0.0.0", "type": "module", "scripts": { "dev": "vite", "build": "vue-tsc && vite build", ...
首先安装node.js环境,没有node.js环境,便没有npm命令。1、Vue3创建执行命令D:\TABLE\test>npm create vue@latest Vue.js - The Progressive JavaScript Framework √ 请输入项目名称: ... vue_test √ 是否…
注意:从Vite 2.x开始,推荐使用npm create vite@latest命令来创建新项目,因为它会自动处理Vite的依赖和版本。 3. 在目标文件夹中打开命令行或终端 打开你的命令行工具(如CMD、PowerShell、Terminal等),并使用cd命令切换到你想创建Vue 3项目的目标文件夹。 4. 执行Vite创建命令,选择Vue 3作为框架 在目标文件夹中...
Vite创建Vue 3项目 Vite提供了两种创建项目的命令,手动创建项目的命令和通过模板自动创建项目的命令。 1.手动创建项目的命令 使用npm或yarn包管理工具都可以搭配Vite手动创建项目,具体命令如下。 #使用npm create命令创建项目 npm create vite@latest #使用yarn create命令创建项目 ...
执行vite 项目创建命令,在创建导航过程中,选择 vue+ts 模式。 代码语言:javascript 代码运行次数:0 运行 AI代码解释 yarn create vite yarn yarn dev 复制代码 修改vite 配置文件 当以命令行方式运行 vite 时,vite 会自动解析项目根目录下名为 vite.config.js 的文件。这里,我们简单设置一下将 @ 指向src 以及...
npm create vite@latest my-vue-app -- --template vue 这个命令会创建一个默认的Vite+Vue项目。 进入项目目录: cd my-vue-app 这样我们就进入了项目目录。 安装依赖: npm install 这会安装所有必要的依赖。 启动项目: npm run dev 现在,你可以在浏览器中输入生成的地址,比如,看到项目运行成功了! 这样,...