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

后端程序员学习前端开发之第一步环境搭建

一、安装 Node.js

Node.js 是一个开源的、跨平台的 JavaScript 运行时环境。Node.js官网

二、安装 npm 镜像

因为 npm 是国外的,所以使用起来速度比较慢。我们这里使用了淘宝的 cnpm 镜像安装 vue。使用淘宝的 cnpm 命令管理工具代替默认的 npm 管理工具。
进入cmd 输入命令: npm install -g cnpm --registry=https://registry.npm.taobao.org

三、安装全局 vue-cli 脚手架

npm 镜像安装完成之后,接下来安装全局 vue-cli 脚手架。
进入 cmd,输入命令:cnpm install --global vue-cli 然后回车。

以上步骤全部完成后可以使用 vue 命令测试一下,出现如下结果为安装正常

PS E:\IdeaProjects\Reid\前端> vue
Usage: vue <command> [options]Options:-V, --version  output the version number-h, --help     output usage informationCommands:init           generate a new project from a templatelist           list available official templatesbuild          prototype a new projectcreate         (for v3 warning only)help [cmd]     display help for [cmd]

如果执行 vue 命令报错:vue : 无法加载文件C:\Users\xxx\AppData\Roaming\npm\vue.ps1,因为在此系统上禁止运行脚本。有关详细信息,请参阅  https:/go.microsoft.com/fwlink/?LinkID=135170

解决方法:

1、以管理员身份运行 PowerShell
2、执行:get-ExecutionPolicy,回复 Restricted,表示状态是禁止的
3、执行:set-ExecutionPolicy RemoteSigned
4、选择:Y

四、创建项目

可以使用 vue create 项目名称 或 vue init webpack 项目名称 进行项目创建。

vue create 和 vue init webpack 的区别?
1、vue create:vue -cli3.x 版本的初始方式 ,启动方式默认为 npm run serve
2、vue init webpack : vue -cli2.x 版本的初始化方式,启动方式默认为 npm run dev ,webpack 为官方推荐模板

五、安装项目依赖

可以使用开发工具一键安装或者命令方式进入项目根目录使用命令 cnpm install 安装项目依赖环境即可。

六、运行项目

可以使用开发工具一键启动或者参考第四步按照创建项目方式进行启动即可。

相关文章:

后端程序员学习前端开发之第一步环境搭建

一、安装 Node.js Node.js 是一个开源的、跨平台的 JavaScript 运行时环境。Node.js官网 二、安装 npm 镜像 因为 npm 是国外的&#xff0c;所以使用起来速度比较慢。我们这里使用了淘宝的 cnpm 镜像安装 vue。使用淘宝的 cnpm 命令管理工具代替默认的 npm 管理工具。 进入c…...

【记录问题】RuntimeError:working outside of application context. Flask使用SQLAlchemy数据库

前提&#xff1a;Flask使用SQLAlchemy数据库 本质&#xff1a;依赖包版本不匹配 问题1&#xff1a;报错RuntimeError&#xff1a;working outside of application context. 运行程序报错&#xff0c;如下错误&#xff1a; 原因&#xff1a;flask-sqlalchemy 版本过高导致&am…...

自动化测试难点案例分析,其实自动化你用错方向还不如不用

随着国内企业软件开发及测试水平的提升&#xff0c;许多企业开始尝试开展自动化测试的应用&#xff0c;以提高测试效率和测试质量。虽然在国外自动化测试工具应用已经很普遍&#xff0c;但国内许多企业对于软件自动化测试的理解还停留在表面上&#xff0c;没有深入的理解到企业…...

866363-70-4,N3-C5-NHS ester,叠氮-C5-NHS 主要物理性质分享

●外观以及性质&#xff1a;Azido-Aca-NHS淡黄色或无色油状&#xff0c;叠氮化物可以与炔烃、DBCO和BCN进行铜催化的点击化学反应。NHS酯可以与胺基反应&#xff0c;形成稳定的酰胺键。●中文名&#xff1a;叠氮-C5-NHS ester&#xff0c;6-叠氮己酸活性酯●英文名&#xff1a;…...

字符流定义及如何深入理解字符流的编码

IputSrem类和OupuSrem类在读写文件时操作的都是字节&#xff0c;如果希望在程序中操作字符&#xff0c;使用这两个类就不太方便&#xff0c;为此JDK提供了字符流。同字节流样&#xff0c;字符流也有两个抽象的顶级父类&#xff0c;分别是Reader和Writer其中&#xff0c;Reader是…...

什么是pod类型

很久很久以前&#xff0c;C 语言统一了江湖。几乎所有的系统底层都是用 C 写的&#xff0c;当时定义的基本数据类型有 int、char、float 等整数类型、浮点类型、枚举、void、指针、数组、结构等等。然后只要碰到一串01010110010 之类的数据&#xff0c;编译器都可以正确的把它解…...

2023年中小企业实施智能制造的建议

智能制造的载体是制造系统&#xff0c;制造系统从微观到宏观有不同的层次&#xff0c;主要包括制造装备、制造单元、制造车间&#xff08;工厂&#xff09;、制造企业和企业生态等。随着智能制造的深入推进&#xff0c;未来智能制造将向以下五个方向发展。 &#xff08;一&…...

【LeetCode】剑指 Offer 19. 正则表达式匹配 p124 -- Java Version

题目链接&#xff1a;https://leetcode.cn/problems/zheng-ze-biao-da-shi-pi-pei-lcof/ 1. 题目介绍&#xff08;19. 正则表达式匹配&#xff09; 请实现一个函数用来匹配包含. 和*的正则表达式。模式中的字符.表示任意一个字符&#xff0c;而’*表示它前面的字符可以出现任意…...

linux和windows中安装emqx消息服务器

大家好&#xff0c;我是雄雄&#xff0c;欢迎关注微信公众号雄雄的小课堂 现在是&#xff1a;2023年3月1日21:53:55 前言 最近几天看了下mqtt&#xff0c;通过不断的搜索资料&#xff0c;也将mqtt集成到项目中&#xff0c;跑了个demo运行&#xff0c;和预想中的差不多&#x…...

【XXL-JOB】XXL-JOB的搭建和使用

【XXL-JOB】XXL-JOB的搭建和使用 文章目录【XXL-JOB】XXL-JOB的搭建和使用1. 任务调度1.1 实现任务调度1.1.1 多线程实现1.1.2 Timer实现1.1.3 ScheduledExecutor实现2. 分布式任务调度2.1 采用分布式的原因3. XXL-JOB3.1 XXL-JOB介绍3.2 执行流程4. 搭建XXL-JOB4.1 创建数据库…...

HCIP-5OSPF基本原理及基本配置学习笔记

1、OSPF基本原理 开放式最短路径优先OSPF&#xff08;Open Shortest Path First&#xff09;协议是IETF定义的一种基于链路状态的内部网关路由协议。 RIP是一种基于距离矢量算法的路由协议&#xff0c;存在着收敛慢、易产生路由环路、可扩展性差等问题&#xff0c;目前已逐渐被…...

Migrate your data into databend with DataX

现在互联网应用越来越复杂&#xff0c;每个公司都会有多种多样的数据库。通常是用最好的硬件来跑 OLTP&#xff0c;甚至还在 OLTP 中进行分库分表来满足业务&#xff0c;这样对于一些分析&#xff0c;聚合&#xff0c;排序操作非常麻烦。这也有了异构数据库的数据同步需求&…...

ssh: Permission denied (publickey,gssapi-keyex,gssapi-with-mic,password)

【ansible 设置host为localhost&#xff0c;执行ping命令报错】 [eniq-slocalhost ansible]$ ansible all -m ping -i inventory localhost | UNREACHABLE! > { "changed": false, "msg": "Failed to connect to the host via ssh: Perm…...

有限元中三角形的一些积分公式

文章目录有限元中三角形的相关积分公式有限元中三角形的相关积分公式 在 xyxyxy 平面中&#xff0c; 通过三个点 (xi,yi),(xj,yj),(xm,ym)(x_i, y_i), (x_j, y_j), (x_m, y_m)(xi​,yi​),(xj​,yj​),(xm​,ym​) 定义一个三角形&#xff0c; 令坐标原点位于其中心(或者重心)…...

【docker-compose】安装mongodb

1. 安装方式 压缩包容器安装docker&#xff08;推荐&#xff0c;一分钟安装&#xff09; 2. 环境 linux服务器已安装好 docker docker-compose &#xff08;不了解的客官&#xff0c;请点击进入&#xff09; 3. 步骤&#xff1a; Step 1&#xff1a; linux下建立如下目录…...

【ClickHouse源码】物化视图的写入过程

本文对 ClickHouse 物化视图的写入流程源码做个详细说明&#xff0c;基于 v22.8.14.53-lts 版本。 StorageMaterializedView 首先来看物化视图的构造函数&#xff1a; StorageMaterializedView::StorageMaterializedView(const StorageID & table_id_,ContextPtr local_…...

.NET 使用NLog增强日志输出

引言 不管你是开发单体应用还是微服务应用&#xff0c;在实际的软件的开发、测试和运行阶段&#xff0c;开发者都需要借助日志来定位问题。因此一款好的日志组件将至关重要&#xff0c;在.NET 的开源生态中&#xff0c;目前主要有Serilog、Log4Net和NLog三款优秀的日志组件&…...

一道阿里类的初始化顺序笔试题

问题很简单&#xff0c;就是下面的代码打印出什么&#xff1f; public class InitializeDemo {private static int k 1;private static InitializeDemo t1 new InitializeDemo("t1" );private static InitializeDemo t2 new InitializeDemo("t2");priv…...

cuda找不到路径报错

编译C文件时出现&#xff1a;error: [Errno 2] No such file or directory: :/usr/local/cuda:/usr/local/cuda/bin/nvcc 在终端输入&#xff1a; export CUDA_HOME/usr/local/cuda...

Elasticsearch进阶之(核心概念、系统架构、路由计算、倒排索引、分词、Kibana)

Elasticsearch进阶之&#xff08;核心概念、系统架构、路由计算、倒排索引、分词、Kibana&#xff09; 1、核心概念&#xff1a; 1.1、索引&#xff08;Index&#xff09; 一个索引就是一个拥有几分相似特征的文档的集合。比如说&#xff0c;你可以有一个客户数据的索引&…...

观成科技:隐蔽隧道工具Ligolo-ng加密流量分析

1.工具介绍 Ligolo-ng是一款由go编写的高效隧道工具&#xff0c;该工具基于TUN接口实现其功能&#xff0c;利用反向TCP/TLS连接建立一条隐蔽的通信信道&#xff0c;支持使用Let’s Encrypt自动生成证书。Ligolo-ng的通信隐蔽性体现在其支持多种连接方式&#xff0c;适应复杂网…...

零门槛NAS搭建:WinNAS如何让普通电脑秒变私有云?

一、核心优势&#xff1a;专为Windows用户设计的极简NAS WinNAS由深圳耘想存储科技开发&#xff0c;是一款收费低廉但功能全面的Windows NAS工具&#xff0c;主打“无学习成本部署” 。与其他NAS软件相比&#xff0c;其优势在于&#xff1a; 无需硬件改造&#xff1a;将任意W…...

【杂谈】-递归进化:人工智能的自我改进与监管挑战

递归进化&#xff1a;人工智能的自我改进与监管挑战 文章目录 递归进化&#xff1a;人工智能的自我改进与监管挑战1、自我改进型人工智能的崛起2、人工智能如何挑战人类监管&#xff1f;3、确保人工智能受控的策略4、人类在人工智能发展中的角色5、平衡自主性与控制力6、总结与…...

基于距离变化能量开销动态调整的WSN低功耗拓扑控制开销算法matlab仿真

目录 1.程序功能描述 2.测试软件版本以及运行结果展示 3.核心程序 4.算法仿真参数 5.算法理论概述 6.参考文献 7.完整程序 1.程序功能描述 通过动态调整节点通信的能量开销&#xff0c;平衡网络负载&#xff0c;延长WSN生命周期。具体通过建立基于距离的能量消耗模型&am…...

Appium+python自动化(十六)- ADB命令

简介 Android 调试桥(adb)是多种用途的工具&#xff0c;该工具可以帮助你你管理设备或模拟器 的状态。 adb ( Android Debug Bridge)是一个通用命令行工具&#xff0c;其允许您与模拟器实例或连接的 Android 设备进行通信。它可为各种设备操作提供便利&#xff0c;如安装和调试…...

Opencv中的addweighted函数

一.addweighted函数作用 addweighted&#xff08;&#xff09;是OpenCV库中用于图像处理的函数&#xff0c;主要功能是将两个输入图像&#xff08;尺寸和类型相同&#xff09;按照指定的权重进行加权叠加&#xff08;图像融合&#xff09;&#xff0c;并添加一个标量值&#x…...

汽车生产虚拟实训中的技能提升与生产优化​

在制造业蓬勃发展的大背景下&#xff0c;虚拟教学实训宛如一颗璀璨的新星&#xff0c;正发挥着不可或缺且日益凸显的关键作用&#xff0c;源源不断地为企业的稳健前行与创新发展注入磅礴强大的动力。就以汽车制造企业这一极具代表性的行业主体为例&#xff0c;汽车生产线上各类…...

全球首个30米分辨率湿地数据集(2000—2022)

数据简介 今天我们分享的数据是全球30米分辨率湿地数据集&#xff0c;包含8种湿地亚类&#xff0c;该数据以0.5X0.5的瓦片存储&#xff0c;我们整理了所有属于中国的瓦片名称与其对应省份&#xff0c;方便大家研究使用。 该数据集作为全球首个30米分辨率、覆盖2000–2022年时间…...

HBuilderX安装(uni-app和小程序开发)

下载HBuilderX 访问官方网站&#xff1a;https://www.dcloud.io/hbuilderx.html 根据您的操作系统选择合适版本&#xff1a; Windows版&#xff08;推荐下载标准版&#xff09; Windows系统安装步骤 运行安装程序&#xff1a; 双击下载的.exe安装文件 如果出现安全提示&…...

LLM基础1_语言模型如何处理文本

基于GitHub项目&#xff1a;https://github.com/datawhalechina/llms-from-scratch-cn 工具介绍 tiktoken&#xff1a;OpenAI开发的专业"分词器" torch&#xff1a;Facebook开发的强力计算引擎&#xff0c;相当于超级计算器 理解词嵌入&#xff1a;给词语画"…...