第一步:进入项目cd keshihua-demo 第二步:安装依赖 npm install 1.4 运行项目 npm run dev 将网址复制到浏览器 也可配置自动浏览 1.5 将文件夹直接拖到vscode 可以在vite.configs.js 文件中配置端口,自动浏览。 1.6 vue-router4的引入 第一步: cnpm add vue-router -S:-
pnpm create vite vite-vue-js-template --template vue 进入刚创建的目录执行,以下命令 # 安装依赖 npm install # 启动项目 npm run dev 用vscode打开刚创建的工程目录,粘贴以下代码到vite.config.js中,项目启动时会自动读取该文件。 (本项目针对公共基础路径、自定义路径别名、服务器选项、构建选项等做了如下基...
npm init vite@latest my-vue-app -- --template vue # yarn yarn create vite my-vue-app --template vue # pnpm pnpm create vite my-vue-app -- --template vue 查看create-vite以获取每个模板的更多细节:vanilla,vanilla-ts,vue,vue-ts,react,react-ts,preact,preact-ts,lit,lit-ts,svelte,svelte...
.vue 文件是vue 中自定义的文件类型,我们把它看作成html即可,可以在里面写标签元素、css样式、js/ts代码 我们来看看其初始化的代码 import HelloWorld from './components/HelloWorld.vue' <template> <HelloWorld msg="Vite + Vue" /> </template> .logo { height: 6em; padding...
利用vite创建vue3项目 首先我们需要用到npm进行创建,如果npm的版本是6.x,则使用以下代码: 代码语言:javascript 代码运行次数:0 运行 AI代码解释 npm init vite@latest<project-name>--template vue 如果npm的版本是7+,需要加上额外的双短横线,则使用以下代码: ...
今天来带大家从0开始搭建一个vue3版本的后台管理系统,之后会补搭建好的模板git仓库地址 一、环境准备 node v16.14.2 pnpm 8.0.0 二、初始化项目文件 本项目使用vite进行构建,vite官方中文文档参考:cn.vitejs.dev/guide/ 如未安装pnpm(自由选择,博主使用pnpm) ...
二 安装vite并创建项目 1全局安装create-vite-app Plain Text 复制代码 9 1 yarn global add create-vite-app@1.18.0 2创建项目 三 安装并使用vue-router 1安装 2在main.js中添加如下代码 3如果使用ts,此时会提示如下报错(js可跳过此步骤) ...
第一步:安装Node.js和npm 📦 首先,你需要安装Node.js和npm。这两个工具是搭建项目的基础。你可以去官网下载最新版本的Node.js,安装完成后,npm也会随之安装。 第二步:创建Vue项目 🖥️ 接下来,我们使用Vue CLI来创建一个新的Vue项目。在命令行中输入以下命令:`...
"vue-router": "^4.0.0-rc.5" } 运行命令 npm install 来安装所有依赖项目。 接下来我们来配置路由。 1、在src文件夹下新建文件。 router/index.js 2、进行路由的配置 import { createRouter, createWebHistory } from "vue-router"; const routes = [ ...