首页 > 其他分享 >vue3+ts+elementPlus项目搭建

vue3+ts+elementPlus项目搭建

时间:2024-05-14 12:52:41浏览次数:12  
标签:npm vue sass ts elementPlus install vue3 安装

1.cmd+R   查看是否安装node环境和vue,
  node -v    出现版本号

 如果没有,去下载安装,地址: Node.js — Download Node.js® (nodejs.org)
  vue -V     出现版本号
 如果没有,  输入命令行,全局安装或升级脚手架

npm install -g @vue/cli

2.创建vue项目   (项目名自己起)

vue create 项目名

创建成功之后会有提示    选择vue3

3. 项目创建成功后,vscode打开文件,打开终端

cd vuetypescript     //进入该项目(我的项目名是vuetypescript)
npm run dev   //启动该项目

4.安装typescript

npm install -g typescript     //全局安装
npm install typescript --save-dev     //项目安装

参考:  vue3项目中加入typescript配置 - 掘金 (juejin.cn)

5.安装配置sass

npm install sass

参考 :vue3:安装配置sass_vue3 sass-CSDN博客

或者参考:vue3 项目中使用 sass - 掘金 (juejin.cn)

npm install sass sass-loader --save-dev

6.安装elementPlus

npm install element-plus  --save

在main.ts中全局引入element-plus

参考:【vue3.0 引入Element Plus步骤与使用】_vue3引入elementplus直接使用吗-CSDN博客

7.安装路由依赖

npm install vue-router@4

参考: vue3中vue-router详解:基本使用,路由跳转,嵌套路由,动态路由,路由守卫 - 掘金 (juejin.cn)

8.axios跨域问题

9.

标签:npm,vue,sass,ts,elementPlus,install,vue3,安装
From: https://www.cnblogs.com/yun101/p/18191089

相关文章

  • VUE3.0 中如何使用SVG图标
    1.文件下新建SvgIcon文件夹以及子文件index.js,index.vue,svg文件夹(用于存放svg图片) 2.编写index.vue组件<template><svg:class="svgClass"aria-hidden="true"><use:xlink:href="iconName"/></svg></template><......
  • LeetCode 2956. Find Common Elements Between Two Arrays
    原题链接在这里:https://leetcode.com/problems/find-common-elements-between-two-arrays/description/题目:Youaregiventwo 0-indexed integerarrays nums1 and nums2 ofsizes n and m,respectively.Considercalculatingthefollowingvalues:Thenumberof......
  • vue3编译优化之“静态提升”
    前言在上一篇vue3早已具备抛弃虚拟DOM的能力了文章中讲了对于动态节点,vue做的优化是将这些动态节点收集起来,然后当响应式变量修改后进行靶向更新。那么vue对静态节点有没有做什么优化呢?答案是:当然有,对于静态节点会进行“静态提升”。这篇文章我们来看看vue是如何进行静态提升的......
  • 中移铁通禹路由 ExportSettings 敏感信息泄露漏洞
    漏洞描述:该漏洞由于cgi-bin/ExportSettings.sh未对用户进行身份验证,导致攻击者能够未授权获取到路由器设置信息,包含了后台管理员用户的账号和密码fofa:title="互联世界物联未来-登录"鹰图:web.body="互联世界物联未来-登录"POC:GET/cgi-bin/ExportSettings.sh漏洞复现:......
  • 今天学了vue3的composition API
    代码量:60左右时间:1h搏客量:1<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><linkrel="icon"href="/favicon.ico"><metaname="viewport"content="wi......
  • mysql.connector.errors.NotSupportedError: Authentication plugin 'caching_sha2_pa
    今天将程序部署到服务器,遇到mysql.connector.errors.NotSupportedError:Authenticationplugin'caching_sha2_password'isnotsupported问题产生的原因:从MySQL8.0开始,默认的用户认证插件从mysql_native_password变成了caching_sha2_password查看现有的用户mysql>se......
  • 【vue3入门】-【22】 组件生命周期
    组件生命周期每个Vue组件实例在创建是都需要经历一系列的初始化步骤,比如设置好数据侦听,编译模版,挂载实例到DOM,以及在数据改变时更新DOM。在此过程中,它也会运行被称为生命周期钩子的函数,让开发者有机会在特定阶段运行自己的代码。生命周期函数都是会自己执行app.vue<template>......
  • IfcDimensionalExponents
    IfcDimensionalExponents实体定义注:定义依据ISO/CD10303-41:1992任何量的维数都可以表示为基本量的维数的幂的乘积。维度指数实体定义基本量的维度的幂。所有物理量都基于七个基本量(ISO31(第2条))。注:长度、质量、时间、电流、热力学温度、物质量和发光强度是七个基本量。示例2毫......
  • Vue3学习(二十四)- 文档页面功能开发
    写在前面这部分真的感觉超级难,其实也不能说难,主要是真的想不到这个思路应该这么做,或者说他好厉害,他怎么知道该这么设计实现。说下难点吧,我觉得后天逻辑还好,主要是前端部分真的需要点花点时间来思考,比如布局、交互设计的实现等等。文档页面功能开发1、任务拆解增加文档页面,......
  • HTML 04 - Elements
    HTMLElementsarebuildingblockofawebpage.Itisusedtocreatecomponentforwebpages.HTMLdocumentsconsistofatreeoftheseelementsandtheyspecifyhowHTMLdocumentsshouldbebuilt,andwhatkindofcontentshouldbeplacedwithinvariousp......