当前位置: 首页 > news >正文

Vue3-01-创建项目

环境准备

1.需要用到 16.0 以及更高版本的 node.js
2.使用vscode编辑器进行项目开发可以在命令行中查看node的版本号:
node -v

在这里插入图片描述

创建项目

1.准备一个目录

例如,我创建项目的时候是在该目录下进行的;D:\projectsTest\vue3project

2.执行创建命令(*)

npm create vue@latest

在这里插入图片描述

3.使用vscode打开创建的项目

项目刚创建完成后的目录结构如下:
此时只有基本的文件,并没有node_modules 目录,因此,文件中导入依赖会提示错误!

在这里插入图片描述
在这里插入图片描述

4.安装依赖

# 进入到项目目录下,执行安装命令
npm install

在这里插入图片描述

5.安装完成之后的目录

新安装的依赖会存放到 node_modules 目录下,
并且文件中导入的依赖也不会提示报错了

在这里插入图片描述
在这里插入图片描述

6.一个奇怪的问题

如果 创建完成之后,tsconfig.node.json 文件中提示下面的异常:Cannot find type definition file for 'node'.
The file is in the program because:
Entry point for implicit type library 'node'我感觉这是vscode 的一个bug,重新打开一下项目就会好了,或者随便编辑一下,然后保存保存,
错误提示就会消失。

启动项目

1.启动项目并访问一下试试

在项目目录下执行命令:
npm run dev在浏览器中访问即可查看到访问的页面。

在这里插入图片描述
在这里插入图片描述

2.启动命令为什么是 npm run dev

这个问题很简单,这个启动命令,是在项目的 package.json 文件中配置的。
配置内容如下:

在这里插入图片描述

至此,vue3 创建最基本的项目就完成了

http://www.lryc.cn/news/255904.html

相关文章:

  • Go 语言中的反射机制
  • [leetcode 前缀和]
  • Python与ArcGIS系列(十五)根据距离抓取字段
  • YOLOv8分割训练及分割半自动标注
  • jsp页面通过class或者id获取a标签上的属性的值
  • 题目:美丽的区间(蓝桥OJ 1372)
  • 解决:During handling of the above exception, another exception occurred
  • 计算机基础知识65
  • Python开发运维:Python垃圾回收机制
  • ros2/ros安装ros-dep||rosdep init错误
  • 《深入理解计算机系统》学习笔记 - 第四课 - 机器级别的程序
  • 云原生(Cloud Native)——概念,技术,背景,优缺点,实践例子
  • ElasticSearch之线程池
  • StoneDB-8.0-V2.2.0 企业版正式发布!性能优化,稳定性提升,持续公测中!
  • 【数据结构 — 排序 — 插入排序】
  • 物联网后端个人第十四周总结
  • 在uniapp中,可以使用那些预定义的样式类
  • mybatis的数据库连接池
  • Vue 的 el-select 下拉选项中,只有当文字超出时才显示提示框,未超出的则不显示
  • 【Python】pptx文件转pdf
  • response应用及重定向和request转发
  • CentOS常用基础命令大全(linux命令)2
  • 分析阿里巴巴的微服务依赖图和性能
  • Linux——基本指令(一)
  • 虚幻学习笔记10—C++函数与蓝图的通信
  • 无重复字符的最长子串(LeetCode 3)
  • 交付《啤酒游戏经营决策沙盘》的项目
  • 油猴(Tampermonkey)浏览器插件简单自定义脚本开发
  • BGP综合
  • 库函数qsort的使用及利用冒泡排序模拟实现qsort