1.Vue自动化工具安装(Vue-cli)

 

目录

1.node.js 安装:

2 npm 安装

3 安装Vue-cli 

4总结:


 

一般情况下,单文件组件,我们运行在 自动化工具vue-CLI中,可以帮我们编译单文件组件。所以我们在学习时一般需要在系统中先搭建vue-CLI工具

下面就是一些我在安装过程中的记录

官网:https://cli.vuejs.org/zh/

Vue CLI 需要 Node.js 8.9 或更高版本 (推荐 8.11.0+)。你可以使用 nvm 或 nvm-windows在同一台电脑中管理多个 Node 版本。

nvm工具的下载和安装(参考):

nvm介绍及使用 - 简书一、介绍 我们可能同时在进行2个项目,而2个不同的项目所使用的node版本又是不一样的,或者是要用更新的node版本进行试验和学习。这种情况下,对于维护多个版本的no... https://www.jianshu.com/p/d0e0935b150a

Mac OS 下 NVM 的安装与使用 - 简书nvm,node,npm之间的区别。 nvm:nodejs 版本管理工具。也就是说:一个 nvm 可以管理很多 node 版本和 npm 版本。nodejs:在项目开发时的所... https://www.jianshu.com/p/622ad36ee020

 

安装过程一些记录:

打开:https://github.com/coreybutler/nvm-windows/releases

nvm list   # 列出目前在nvm里面安装的所有node版本
nvm install node版本号      # 安装指定版本的node.js例子:nvm install 12.13.1nvm uninstall node版本号    # 卸载指定版本的node.js
nvm use node版本号          # 切换当前使用的node.js版本	

 

 

如果使用nvm工具,则直接可以不用自己手动下载,如果使用nvm下载安装 node的npm比较慢的时候,可以修改nvm的配置文件(在安装根目录下)  

# settings.txt
root: C:\tool\nvm    [这里的目录地址是安装nvm时自己设置的地址,要根据实际修改]
path: C:\tool\nodejs
arch: 64
proxy: none
node_mirror: https://mirrors.tuna.tsinghua.edu.cn/nodejs-release// 
npm_mirror: https://mirrors.tuna.tsinghua.edu.cn/npm/

1.node.js 安装:

使用上一部分nvm 工具安装

nvm install node版本号      # 安装指定版本的node.js

node.js的版本有两大分支:

官方发布的node.js版本:0.xx.xx 这种版本号就是官方发布的版本(推荐)

社区发布的node.js版本:xx.xx.x 就是社区开发的版本

Node.js如果安装成功,可以查看Node.js的版本,在终端输入如下命令:

node -v

2 npm 安装

在安装node.js完成后,在node.js中会同时帮我们安装一个npm包管理器npm。我们可以借助npm命令来安装node.js的包。这个工具相当于python的pip管理器。

npm install -g 包名              # 安装模块   -g表示全局安装,如果没有-g,则表示在当前项目安装
npm list                        # 查看当前目录下已安装的node包
npm view 包名 engines            # 查看包所依赖的Node的版本 
npm outdated                    # 检查包是否已经过时,命令会列出所有已过时的包
npm update 包名                  # 更新node包
npm uninstall 包名               # 卸载node包
npm 命令 -h                      # 查看指定命令的帮助文档

3 安装Vue-cli 

npm install -g vue-cli
npm install -g vue-cli --registry https://mirrors.tuna.tsinghua.edu.cn/

如果安装速度过慢,一直超时,可以考虑切换npm镜像源  :

https://mirrors.tuna.tsinghua.edu.cn/

指令:

1     //临时使用2     npm install jquery --registry https://registry.npm.taobao.org3 4     //可以把这个选型配置到文件中,这样不用每一次都很麻烦5     npm config set registry https://registry.npm.taobao.org6 7     //验证是否配置成功 8     npm config list 或者 npm config get registry9 
10     //在任意目录下都可执行,--global是全局安装,不可省略
11     npm install --global cnpm 或者 npm install -g cnpm --registry=https://mirrors.tuna.tsinghua.edu.cn/
12 
13     //安装后直接使用
14     cnpm install jquery

 npm和cnpm介绍(参考)

参考博客: npm 和 cnpm 区别_cnpm和npm-CSDN博客文章浏览阅读4.9w次,点赞6次,收藏41次。本文介绍了NodeJS的包管理器NPM的基本操作,包括安装、卸载、更新插件的方法,以及如何将插件信息保存到项目的package.json文件中。此外,还介绍了为了解决NPM下载速度慢的问题,国内开发者常用的CNPM工具及其安装和使用方法。 https://blog.csdn.net/jack_bob/article/details/80644376

4总结:

安装vue-cli

nvm是node.js的版本管理工具

1 安装node.js 自带npm

2 通过npm 安装vue-cli 它的运行需要依赖node.js的环境

 

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

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

相关文章

IP数据报

IP数据报组成 IP数据报(IP Datagram)是网络中传输数据的基本单位。 IP数据报头部 版本(Version) 4bit 告诉我们使用的是哪种IP协议。IPv4版本是“4”,IPv6版本是“6”。 头部长度(IHL,Intern…

Leetcode 2158. 每天绘制新区域的数量【Plus题】

1.题目基本信息 1.1.题目描述 有一幅细长的画,可以用数轴来表示。 给你一个长度为 n 、下标从 0 开始的二维整数数组 paint ,其中 paint[i] [starti, endi] 表示在第 i 天你需要绘制 starti 和 endi 之间的区域。 多次绘制同一区域会导致不均匀&…

Git Flow

Git Flow深度解析:企业级分支管理实战指南 前言 在持续交付时代,分支策略决定团队协作效率。Git Flow作为经典的分支管理模型,被Apache、Spring等知名项目采用。2023年JetBrains开发者调查报告显示,Git Flow仍是中大型项目最常用…

[Swift]pod install成功后运行项目报错问题error: Sandbox: bash(84760) deny(1)

操作: platform :ios, 14.0target ZKMKAPP do# Comment the next line if you dont want to use dynamic frameworksuse_frameworks!# Pods for ZKMKAPPpod Moyaend pod install成功后运行报错 报错: error: Sandbox: bash(84760) deny(1) file-writ…

[管理与领导-129]:向上管理-组织架构、股权架构、业务架构、流程架构,看每个人在组织中的位置和重要性

目录 一、股权架构:反映所有权与控制权 二、组织架构:定义角色与汇报关系 三、业务架构:定义业务单元与价值链 四、流程架构:规范业务运作与协作 五、综合分析:个人在组织中的综合影响力 六、案例:某…

小红书爬虫,小红书api,小红书数据挖掘

背景: 小红书(Xiaohongshu)是一款结合社交、购物和内容分享的移动应用,近年来在中国以及全球范围内拥有大量的用户群体。小红书上的内容包括用户的消费体验、生活方式、旅行分享、时尚搭配等。通过这些内容,用户可以了…

玩转Docker | 使用Docker部署tududi任务管理工具

玩转Docker | 使用Docker部署tududi任务管理工具 前言一、tududi介绍Tududi简介核心功能特点二、系统要求环境要求环境检查Docker版本检查检查操作系统版本三、部署tududi服务下载镜像创建容器创建容器检查容器状态检查服务端口安全设置四、访问tududi服务访问tududi首页登录tu…

大屏设计与汇报:政务服务可视化实践

大屏设计与汇报:政务服务可视化实践 引言 在政务服务数字化转型浪潮中,大屏设计成为展现业务能力与数据价值的关键手段。本文围绕政务大屏设计,从设计要点、业务逻辑到汇报技巧展开深入探讨,为相关从业者提供全面参考。 一、大屏设计核心要点 (一)多维度考量 设计大…

字节(抖音)golang后端

Golang知道哪些并发模式,你觉得哪个更好,为什么 在使用channel的时候有哪些需要考虑和注意的地方 进程和线程的区别 线程里有哪些字段 TCP和UDP的区别,各自的优劣势 TCP 更适合需要可靠性、顺序和连接管理的场景,如文件传输和网页…

Python语法系列博客 · 第6期[特殊字符] 文件读写与文本处理基础

上一期小练习解答(第5期回顾) ✅ 练习1:字符串反转模块 string_tools.py # string_tools.py def reverse_string(s):return s[::-1]调用: import string_tools print(string_tools.reverse_string("Hello")) # 输出…

Unity运行时查看日志插件 (IngameDebugConsole)

Unity运行时查看日志插件 (IngameDebugConsole) 文章目录 Unity运行时查看日志插件 (IngameDebugConsole)一、介绍二、使用步骤1.导入插件2.开始使用 结束 一、介绍 In-game Debug Console插件可以在打包发布以后,程序运行时方便的看到控制台信息,在一些…

spark-SQL核心编程课后总结

通用加载与保存方式 加载数据:Spark-SQL的 spark.read.load 是通用加载方法,借助 format 指定数据格式,如 csv 、 jdbc 、 json 等; load 用于指定数据路径; option 在 jdbc 格式时传入数据库连接参数。此外&#xff0…

蔡浩宇的AIGC游戏革命:从《原神》到《Whispers》的技术跨越

目录 引言:游戏行业的AI革命前夜 一、《Whispers》的技术突破与市场挑战 1.1 多模态AI技术的集成应用 1.2 与传统游戏的差异化体验 1.3 面临的商业化难题 二、从《原神》到《Whispers》的技术演进 2.1 《原神》成功的时代因素分析 2.2 蔡浩宇的技术路线转变 …

Spring Boot中定时任务Cron表达式的终极指南

Spring Boot中定时任务Cron表达式的终极指南 一、Cron表达式基础二、Spring Boot中定时任务的实现三、Cron表达式高级用法四、调试与验证技巧五、常见问题与解决方案六、最佳实践总结 定时任务是后端开发中实现周期性业务逻辑的核心技术之一。在Spring Boot生态中,结…

国产SMT贴片机自主技术突破解析

内容概要 随着电子信息产业对精密制造需求的持续升级,国产SMT贴片机的技术突破已成为装备自主化进程的关键节点。本文聚焦设备研发的三大核心领域:高动态运动控制系统通过线性电机与数字信号处理技术的融合,将重复定位精度提升至5μm级别&am…

uni-app 安卓10以上上传原图解决方案

在Android 10及以上版本中,由于系统对文件访问的限制,使用chooseImage并勾选原图上传后,返回的是图片的外部存储路径,如:file:///storage/emulated/0/DCIM/Camera/。这种外部存储路径,无法直接转换成所需要…

迭代器模式:统一不同数据结构的遍历方式

迭代器模式:统一不同数据结构的遍历方式 一、模式核心:分离数据遍历与数据表示 在开发中,我们经常需要遍历不同的数据结构,如数组、链表、树等。若在客户端代码中直接编写遍历逻辑,不仅会导致代码冗余,而…

Oracle 如何停止正在运行的 Job

Oracle 如何停止正在运行的 Job 先了解是dbms_job 还是 dbms_scheduler,再确定操作命令。 一 使用 DBMS_JOB 包停止作业(适用于旧版 Job) 1.1 查看正在运行的 Job SELECT job, what, this_date, this_sec, failures, broken FROM user_j…

真实波幅策略思路

该策略是一种基于ATR(Average True Range)指标的交易策略,主要用于期货市场中的日内交易。策略的核心思想是利用ATR指标来识别市场的波动范围,并结合均线过滤来确定买入和卖出的时机。 交易逻辑思维 1. 数据准备与初始化 - 集合竞…

Web3技术如何提升用户数据保护

在这个信息爆炸的时代,用户数据保护已成为全球关注的焦点。Web3 技术,作为下一代互联网的代表,以其去中心化、安全性和用户主权等特点,为用户数据保护提供了新的解决方案。本文将探讨 Web3 技术如何提升用户数据保护。 去中心化存…