1. 按脚手架初始化项目 进入vue官网的快速上手,按照官网所述,执行:npm create vue@latest,然后,按照提示选择 typescript / vue-router / pinia(如下图) 注释:如果不选择pinia,初始化的项目里就默认没有状态管理库,然后就只能自己去配置 vuex 或 pinia 了。 初始化后,项目的目录如下图所示(不含ts vs 含ts...
第三步:创建vue项目 选择一个要存放项目的目录,打开小黑窗输入如下命令: npm init vue 一开始输入项目名称或者默认vue-project,然后根据需求选择Yes/No 第四步:安装element-ui 生成完项目后,输入如下指令: cd项目名 npm install npm i-selement-plus src/main.js里引入 importElementPlusfrom'element-plus';impor...
npm init vue 1. 一开始输入项目名称或者默认vue-project,然后根据需求选择Yes/No 第四步:安装element-ui 生成完项目后,输入如下指令: cd 项目名 npm install npm i -s element-plus 1. 2. 3. src/main.js里引入 import ElementPlus from 'element-plus'; import 'element-plus/theme-chalk/index.css';...
做完以上操作后,我们vue项目的基本结构如下图 测试Element Plus 做好以上步骤,我们vue3+Element Plus搭建项目的基本模板已经创建好,接下来测试Element Plus是否可以使用 这里我选择使用Element Plus 中的Menu组件,因为接下来我们会使用Menu做系统菜单 找到系统默认生成的HelloWorld.vue文件,用如下代码替换里面的代码 <templ...
1、安装Element+ 使用如下指令: npm install element-plus --save 此时你的项目可能会报错,如下图示: 不要着急,这是因为刚刚安装插件版本与Vue不符造成的;解决此问题,可分为如下三个步骤: 1-1、删除eslint-plugin-vue的现有安装, 使用以下命令: npm uninstall eslint-plugin-vue ...
element-plus 组件库 学习路径 安装脚手架; 创建vue 项目; 安装依赖; 使用typescript; 修改项目; 业务开发; 1. 安装脚手架; yarnglobaladd@vue/cli 检查安装成功与否: vue -V 安装脚手架 2. 创建 vue 项目; vue create math-games 创建vue 项目
安装element-plus图片库自动导入的两款插件unplugin-icons 和 unplugin-auto-import://在当前项目文件夹下 npm install -D unplugin-icons unplugin-auto-import 在项目里的vite.config.ts配置文件配置这两款插件:配置前:import { defineConfig } from 'vite'import vue from '@vitejs/plugin-vue'import Auto...
npm install element-plus --save # https://element-plus.org/zh-CN/#/zh-CN 1. 在main.js 中导入: import ElementPlus from 'element-plus' import 'element-plus/dist/index.css' 1. 2. 清空main.js 其他代码,加入: import { createApp } from 'vue' ...
使用Vue3+Element Plus搭建项目需要以下几个步骤: 创建Vue3应用 我们可以使用Vue CLI来创建Vue3应用,它是一个用于快速开发Vue.js项目的命令行工具。我们可以通过npm install -g @vue/cli命令来安装Vue CLI,并通过vue create my-project命令来创建一个新的Vue3项目1。