使用vite创建vue3项目

2 篇文章 1 订阅
一.创建vite+vue项目

1.在命令行输入以下创建语句。然后根据下图所示,输入项目名称并选择vue框架即可

npm create vite@latest

在这里插入图片描述

创建完项目后,根据提示依次输入三条命令:

cd 项目名称
npm install
npm run dev

在这里插入图片描述

二. 新建一个vue3项目

1.替换掉vite文件夹下的src文件夹
2.替换vite -> package.json中的dependencies为
“dependencies”: {
“core-js”: “^3.6.5”,
“vue”: “^3.2.37”,
“vue-router”: “^4.0.13”
}
3. 安装依赖:npm i
4. npm run dev

三.修改vite.config.js

出现以下错误,是因为没有配置别名alias :src到@
在这里插入图片描述
在vite.config.js文件中修改为

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'

export default defineConfig({
  plugins: [vue()],
  resolve: {
    alias: {
      "@": "/src",
    },
  },
})

四.修改router

在这里插入图片描述
router -> index.js

const router = createRouter({
  history: createWebHistory(process.env.BASE_URL),
  routes
})

// 替换为
const router = createRouter({
  history: createWebHistory(),
  routes
})


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值