vue3+ts项目搭建的实现示例

 更新时间:2024年03月26日 09:17:50   作者:蒾酒  
这篇文章主要介绍了vue3+ts项目搭建的实现示例,本文目的在于记录自己项目框架搭建的过程,通过示例代码介绍的非常详细,需要的朋友们下面随着小编来一起学习学习吧

前置条件

请确保已经装好node,并配置好环境变量

下载地址:

https://nodejs.org/en/download

基础工程模板搭建 

测试环境变量是否配置成功

查看版本命令

打印出版本号代表配置成功。

初始化vue项目

npm init vue@latest

依次选择即可。

初始化完毕依次执行

1.安装项目所需依赖

npm install

2.运行项目

npm run dev

浏览器访问该地址

此时我们用VScode打开项目。文件-打开文件夹-选择新创建的vue项目目录

安装常用依赖

vscode打开终端

安装element-plus(vue最常用组件库)

npm i element-plus -S

安装axios(Ajax的封装)

npm i axios -s 

 安装完毕可以看到package.json文件如下内容:

基础项目目录介绍

下面介绍常用的一些目录以及文件。

到此这篇关于vue3+ts项目搭建的实现示例的文章就介绍到这了,更多相关vue3 ts项目搭建内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家! 

相关文章

  • Vue简介、引入、命令式与声明式编程详解

    Vue简介、引入、命令式与声明式编程详解

    原生开发和Vue开发的模式和特点,我们会发现是完全不同的,这里其实涉及到两种不同的编程范式:命令式编程和声明式编程,下面这篇文章主要给大家介绍了关于Vue简介、引入、命令式与声明式编程的相关资料,需要的朋友可以参考下
    2022-10-10
  • Vuejs 组件——props数据传递的实例代码

    Vuejs 组件——props数据传递的实例代码

    本篇文章主要介绍了Vuejs 组件——props数据传递的实例代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下。
    2017-03-03
  • element-ui 中的table的列隐藏问题解决

    element-ui 中的table的列隐藏问题解决

    这篇文章主要介绍了element-ui 中的table的列隐藏问题解决,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-08-08
  • Vue + element 实现多选框组并保存已选id集合的示例代码

    Vue + element 实现多选框组并保存已选id集合的示例代码

    这篇文章主要介绍了Vue + element 实现多选框组并保存已选id集合,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-06-06
  • Vue中的scoped实现原理及穿透方法

    Vue中的scoped实现原理及穿透方法

    这篇文章主要介绍了Vue中的scoped实现原理及穿透方法,本文通过实例文字相结合的形式给大家介绍的非常详细,需要的朋友可以参考下
    2018-05-05
  • 详解VScode编辑器vue环境搭建所遇问题解决方案

    详解VScode编辑器vue环境搭建所遇问题解决方案

    这篇文章主要介绍了VScode编辑器vue环境搭建所遇问题解决方案,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-04-04
  • vue3实现ai聊天对话框功能

    vue3实现ai聊天对话框功能

    这篇文章主要介绍了vue3实现ai聊天对话框功能,本文通过实例代码给大家介绍的非常详细,感兴趣的朋友一起看看吧
    2024-12-12
  • vue 监听屏幕高度的实例

    vue 监听屏幕高度的实例

    今天小编就为大家分享一篇vue 监听屏幕高度的实例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-09-09
  • 前端主流框架vue学习笔记第二篇

    前端主流框架vue学习笔记第二篇

    一步一步学Vue,这篇文章为大家分享了第二篇前端主流框架vue学习笔记,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-07-07
  • Vue报错Syntax Error:TypeError: this.getOptions is not a function的解决方法

    Vue报错Syntax Error:TypeError: this.getOptions is not a 

    前几天在vue运行项目过程中报错了,所以下面这篇文章主要给大家介绍了关于Vue报错Syntax Error:TypeError: this.getOptions is not a function的解决方法,需要的朋友可以参考下
    2022-07-07

最新评论