nodejs详细介绍2以及vue脚手架

前言

首先给宝子们说声抱歉,因为自己在使用vscode执行vue脚手架的时候出现了很多问题,在经过解决之后还是有一个对应的我弄了一天没弄好,就是“vscode的终端将被任务重用,按任意键关闭”然后导致的是自己没心情学习一点,也导致了上一篇文章的潦草结束,现在我就把注意事项介绍一下

正题

  • 下载

官网下载页链接:Node.js官网下载页

这里注意的是我们在下载的时候一定要下载对应的长期维护版本,要不然会导致后续的很多问题

  • 安装

安装界面大家直接下一步

ok这里我们也是要确定勾选上

路径选择,一定要安装在对应的D盘或E盘

这里也直接下一步就可以

这里也是直接下一步

然后完成安装

检查与配置

然后我们检查,在命令行下输入对应的代码既可以,只要显示出来就说明安装成功

这里我们需要创建对应的global以及cache文件夹,然后去设置全局安装以及备份

然后我们进行对应的淘宝镜像的配置,之后我们就是检查对应的配置

npm config set registry https://registry.npm.taobao.org
npm config list

ok到这里就是说明我们的配置也没问题,这里的镜像网站就是加速下载

环境变量

在你创建的global文件里面在创建一个文件夹node_modules

然后我们就去配置环境变量

在电脑鼠标右键执行然后找到属性,之后去找到高级系统设置

进入环境变量

3.2.3 在打开的环境变量窗口中,新建系统变量,如下图所示:

变量名:NODE_PATH

变量值:这里是你的对应的安装nodejs文件里面对应的上面新创建的文件夹node_modules

变量值是之前新创建在node.js安装目录中node_global文件夹内的node_modules文件夹的位置(绝对路径)。

然后点击确定。

选择系统变量中的 “Path” 并点击 ”编辑“,进入编辑环境变量窗口。点击 ”新建“,添加如下内容:

%NODE_PATH%

在用户变量中选择 “Path” 并点击 ”编辑“,进入编辑环境变量窗口。选中“C:\Users\Administrator\AppData\Roaming\npm”(这里就是要找到你自己安装路径下的这个文件地址) 然后点击编辑,将其修改为自己新建的node_global文件夹,完成后点击 “确定”。

 到此环境变量修改完成,依次点击 “确定” 关闭环境变量窗口和系统属性窗口。

配件下载

cmd命令以管理员身份打开

之后分别执行对应的安装配置组件

先安装对应的vue组件

npm install vue -g

然后安装webpack组件

npm install webpack -g

webpack-cli组件

npm install webpack-cli -g

vue-cli脚手架组件

npm install @vue/cli -g

最后检查一下

vue -V
# 注:参数为大写的字母V

到这里我们就介绍完了


项目构建

我们打开一个文件夹,再里面的路径不要删除,直接输入cmd

然后我们输入vue ui就可以自己生成项目了

然后就是项目的配置,这里大家可以去看看黑马程序员的最新课程javaweb的vue项目构建就可以啦

之后我们在vscode上打开就可以啦

这里我们的项目就构建好了(自动生成的),然后我们找到对应的npm脚本执行就可以啦,选择对应的server就可以啦

因为我的vscode一点问题就是一直这样报错那么我就是这样执行,在对应的文件里面执行cmd命令

这里一定要注意是在对应的nodejs文件里面执行cmd命令

然后我们出现这个就是啦,直接点击那个链接加ctrl就可以打开啦


总结

我们在自己学编程的路上,可能会遇到对应的各种问题,但是我们不需要像我一样,一下子就卡了1天,导致了学习兴趣都被打击了,为此希望大家明白有些bug我们解决不了的就不要再耗下去了,就是选择性的放弃。最后祝大家在寒假里富自己所学,今日分享到此结束

少年啊,我们孤独且绽放

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

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

相关文章

人工视觉仍然需要图像采集卡

最初,图像采集卡被用作模拟视频数字转换器和图像缓冲器,但如今它们能够执行复杂的任务,例如图像处理。图像采集卡的设计不断发展,旨在提高系统性能并减少计算机处理需求。 除了图像采集之外,图像采集卡还执行机器视觉…

WebService的services.xml问题

WebService有多种实现方式,这里使用的是axis2 问题: 在本地开发,访问本地的http://localhost:8080/services/ims?wsdl,正常访问 但是打成jar包,不管是linux还是window启动,都访问不到,报错…

构建基于Flask的跑腿外卖小程序

跑腿外卖小程序作为现代生活中的重要组成部分,其技术实现涉及诸多方面,其中Web开发框架是至关重要的一环。在这篇文章中,我们将使用Python的Flask框架构建一个简单的跑腿外卖小程序的原型,展示其基本功能和实现原理。 首先&…

外汇天眼:澳大利亚法院判决西太平洋银行因不合理行为在利率互换交易中支付180万美元

联邦法院宣布,西太平洋银行在2016年10月执行120亿美元的利率互换交易时涉及不合理行为。西太平洋银行将支付与该行为相关的最高罚款180万美元,以及澳大利亚证券投资委员会(ASIC)的1800万美元的诉讼和调查费用。 西太平洋银行的不…

鸿蒙会取代Android吗?听风就是雨

现在说取代还谈不上,毕竟这需要时间。安卓作为全球第一的手机操作系统,短时间内还无法取代。持平iOS甚至超过iOS有很大可能,最终会呈现“三足鼎立”有望超过安卓基数。 作为全新的鸿蒙操作系统,其现在已经是全栈自研底座。按照鸿…

awk命令以及用法

awk:是列处理工具,把一行提取出来,然后一列一列的对比,读取一行,处理一行。 sed:是行编辑器,无法取列,也是读取一行,处理一行。 -F 以什么为分隔符 {print $n} 打印第…

异步任务的一些思考

前言 XXL-Job部署教程 项目中,必然少不了数据的导入导出,针对数据的导入导出简单复盘一下。 为了不占用资源消耗时间,影响用户体验,大量数据的导入导出一般都是异步执行 导入的时候,如果数据量很大,一次…

腾讯云部署vue+node项目

文章目录 一、安装宝塔二、vue项目部署三、node项目部署 前言: 关于项目部署,一开始也是找了很多资料,费了点时间,所以记录一下。希望能对各位有所帮助。 一、安装宝塔 1.首先在控制台,进入云服务器的终端界面 2.输入命令和密码获取权限,并且安装宝塔界面 yum install -y w…

配置IPv6静态路由

1、静态路由简介 静态路由是一种需要管理员手工配置的特殊路由。 静态路由在不同网络环境中有不同的目的: 当网络结构比较简单时,只需配置静态路由就可以使网络正常工作。 在复杂网络环境中,配置静态路由可以改进网络的性能,并…

Java中实例化的一般过程

在Java中,当你有几个类(如 ManualTriggerStartNode, EndNode, TimerTriggerStartNode)继承自一个基类(如 BaseNode),实例化这些子类时的确定性主要依赖于你的具体需求和上下文。 实例化的一般过程&#xf…

Wireshark网络协议分析 - Wireshark速览

在我的博客阅读本文 文章目录 1. 版本与平台2. 快速上手2.1. 选择网络接口进行捕获(Capture)2.2. 以Ping命令为例进行抓包分析2.3. 设置合适的过滤表达式2.4. 数据包详情2.5. TCP/IP 四层模型 3. 参考资料 1. 版本与平台 Wireshark是一个开源的网络数据…

【ASP.NET Core 基础知识】--Web API--创建和配置Web API(一)

一、简介 Web API(Web Application Programming Interface)的重要性在于其在现代软件开发中扮演着关键的角色。以下是一些关于Web API重要性的方面: 跨平台交互: Web API允许不同平台、不同技术栈的应用程序进行通信。无论是Web…