node环境创建Vue项目

node环境创建Vue项目

目录

  • node环境创建Vue项目
    • 安装node.js
    • 安装Vue
    • 创建Vue项目

安装node.js

【1】.官网下载

image-20240428204742087

【2】.选择路径

image-20240428204839301

【3】配置环境变量

image-20240428204958432

后面就是一路next完成安装

【4】测试

cmd输入node指令,显示版本号证明安装成功

image-20240428205120362

安装Vue

【1】安装cnpm

这是由淘宝提供的npm镜像,以后装模块用它代替npm

npm install -g cnpm --registry=https://registry.npmmirror.com

如果安装失败可以尝试以下方法
方案【1】:

清空缓存
npm cache clean --force

关闭SSL验证
npm config set strict-ssl false

安装
到这里就可以正常使用npm命令安装需要的工具了。如(npm install -g cnpm )

方案【2】:

清空缓存
npm cache clean --force

切换新源
npm config set registry https://registry.npmmirror.com

查看源是否设置成功
npm config get registry

安装
到这里就可以正常使用npm命令安装需要的工具了。如(npm install -g cnpm )

【2】安装Vue脚手架

cnpm install -g @vue/cli

【3】创建Vue项目

vue create myfirstvue
  • myfirstvue为自定义的项目名
  • 项目会根据你cmd当前路径,如有需要请自行更换

【4】选择预设项目

image-20240428211636902

可以使用默认配置,但这里我选择自行创建Manually select features

【5】选择自带配置

image-20240428211815658

空格是勾选,回车确认

这里使用的是vue2因此选2.x

image-20240428211903901

【6】确认

image-20240428211945122

【7】完成并创建依赖包

image-20240428211957008

如果想要保存该配置可以在这里选y然后为配置命名

image-20240428212216300

创建Vue项目

完成以上配置后便可以再次在终端输入vue create myvuepjt创建项目

然后会在该路径下生成一个文件夹,直接用webstorm打开

image-20240428212659170

  • 打开项目之后更改启动配置

image-20240428214949562

  • 添加新的npm配置

image-20240428215026236

  • 脚本选择server

image-20240428215050206

  • 等待环境搭建

image-20240428215122127

  • 搭建成功进入Local路由

image-20240428215152111

  • 出现该页面则表示已经完成了项目的搭建

image-20240428215225680

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/web/4737.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

最新官方破解版会声会影2024永久序列号和激活码

会声会影2024是一款功能强大的视频编辑软件,它集合了视频剪辑、音频调整、特效添加等多项功能于一身,为用户提供了一个全面且易用的视频制作平台。无论是初学者还是专业视频编辑人员,都能在这款软件中找到满足自己创作需求的工具。 会声会影最…

数字签名学习

1 基本概念 数字签名是一种加密技术,用于验证信息来源的身份和数据的完整性。 就是对一个东西签上自己的名;收到的人可以验证这东西是你发的;这里是用数字的方式; 对字符串也可以签名,签名以后,还是一个…

嘉楠堪智 CanMV K230 的 CanMV-IDE 环境与 MicroPython 编程

嘉楠推出了 CanMV IDE 开发环境,可以使用 MicroPython 开发针对 CanMV K230 的各种程序,同时也提供了大量的例子程序,方便使用者学习。 嘉楠开发者社区,给出了详细的 CanMV K230 教程,可以借以快速上手。 目录 固件…

TikTok引流中海外云手机的实用功能分享

在当下,TikTok已成为全球范围内最受欢迎的社交媒体平台之一,拥有着庞大的用户群体和潜在的商业机会。为了在TikTok上实现更好的引流效果,利用海外云手机成为了一个明智的选择。接下来,我们将深入探讨海外云手机的功能以及它如何助…

卫瓴科技杨炯纬:帮助一线销售做营销 | 躬行者说

我并不假装理解营销技术。我所有关于营销技术的知识,都来自这个行业的躬行者们。他们筚路蓝缕,见证营销技术在中国的成长。Marteker邀请他们谈谈心路历程,以「身在此山中」的视角解读营销技术在中国的光荣与梦想。 「纸上得来终觉浅&#xf…

Swift - 枚举

文章目录 Swift - 枚举1. 枚举的基本用法2. 关联值(Associated Values)3. 关联值举例4. 原始值5. 隐式原始值(Implicitly Assigned Raw Values)6. 递归枚举(Recursive Enumeration)7. MemoryLayout Swift -…

ROS1快速入门学习笔记 - 07话题消息的定义与使用

目录 一、话题模型 二、自定义话题消息 1. 在功能包下创建msg目录用于存储话题文件 2. 在package.xml文件中添加功能包依赖; 3. 在CMakeLists.txt增加编译选项; 4. 完成编译 5. 配置CMakeLists.txt中的编译规则(增加发布者和订阅者&am…

Linux 第十三章

🐶博主主页:ᰔᩚ. 一怀明月ꦿ ❤️‍🔥专栏系列:线性代数,C初学者入门训练,题解C,C的使用文章,「初学」C,linux 🔥座右铭:“不要等到什么都没有了…

【办公类-22-13】周计划系列(5-5)“周计划-05 周计划表格内教案部分“节日”清空改成“节日“” (2024年调整版本)Win32

背景需求: 本学期19周,用了近10周的时间,终于把周计划教案部分的内容补全了(把所有教案、反思的文字都撑满一个单元格), 一、原始教案 二、新模板内的教案 三、手动添加文字后的样式(修改教案…

STM32之HAL开发——电容按键

电容按键原理 电容器 (简称为电容) 就是可以容纳电荷的器件,两个金属块中间隔一层绝缘体就可以构成一个最简单的电容。如图 32_1 (俯视图),有两个金属片,之间有一个绝缘介质,这样就构成了一个电容。这样一个电容在电路板上非常容…

Detla lake with Java--入门

最近在研究数据湖,虽然不知道研究成果是否可以用于工作,但我相信机会总是留给有准备的人。 数据湖尤其是最近提出的湖仓一体化概念,很少有相关的资料,目前开源的项目就三个,分别是hudi, detla lake, iceberg。最终选择…

常用算法代码模板 (3) :搜索与图论

AcWing算法基础课笔记与常用算法模板 (3) ——搜索与图论 常用算法代码模板 (1) :基础算法 常用算法代码模板 (2) :数据结构 常用算法代码模板 (3) :搜索与图论 常用算法代码模板 (4) :数学知识 文章目录 0 搜索技巧1 树与图的存…

机器学习:基于Sklearn、XGBoost框架,使用XGBClassifier、支持向量分类器和决策树分类器预测乳腺癌是良性还是恶性

前言 系列专栏:机器学习:高级应用与实践【项目实战100】【2024】✨︎ 在本专栏中不仅包含一些适合初学者的最新机器学习项目,每个项目都处理一组不同的问题,包括监督和无监督学习、分类、回归和聚类,而且涉及创建深度学…

MySQL:飞腾2000+Centos7.6 aarch64 部署MySQL8.0.36

目录 1.硬件环境 2.MySQL选择 Bundle版本【全部文件】​编辑 3.下载并安装 4.安装完成后检查mysql 5.初始化MySQL 6.那就问了,都初始化了啥? 7.尝试启动MySQL 8.给mysql文件授权 9.再次尝试启动正常 10.mysql初始化目录出现了mysql.sock 11.找…

为什么我的Mac运行速度变慢 mac运行速度慢怎么办 如何使用CleanMyMac X修复它

近些年伴随着苹果生态的蓬勃发展,越来越多的用户开始尝试接触Mac电脑。然而很多人上手Mac后会发现,它的使用逻辑与Windows存在很多不同,而且随着使用时间的增加,一些奇奇怪怪的文件也会占据有限的磁盘空间,进而影响使用…

android 分区存储(沙盒存储)适配总结

目录 一、分区存储概念 1.外部存储分类 2.分区存储如何影响文件访问 二、分区适配方案 1. 应用分区存储的文件访问规定 (1).应用专属目录--私有目录 (2).共享目录文件--公有目录 2.MediaStore API介绍 3.Storage Access Framework介绍 三、所有文件访问权限 四、总结…

【项目学习01_2024.04.27_Day02】

学习笔记 3 课程查询3.4 生成接口文档ApiOperation("课程查询接口") 和Api注解的区别Api(value "课程信息编辑接口",tags "课程信息编辑接口")其中的value和tags有什么用呢Swaager的常用注解如下:3.5 开发持久层3.5.1 生成mapper3.…

从NoSQL到NewSQL——10年代大数据浪潮下的技术革新

引言 在数字化浪潮的推动下,数据库技术已成为支撑数字经济的坚实基石。腾讯云 TVP《技术指针》联合《明说三人行》特别策划的直播系列——【中国数据库前世今生】,我们将通过五期直播,带您穿越五个十年,深入探讨每个时代的数据库演…

8_手眼标定总结_auboi5机械臂与海康平面相机

经过不断地学习与调试,不断地学习网络上其他同志分享的资料,opencv手眼标定迎来了阶段性结束。实际测试结果在机械臂坐标系中X方向差5mm左右。 代码参考《https://blog.csdn.net/wanggao_1990/article/details/81435660》 注意事项: ①标定…