【内网】WebStorm搭建Vue环境

news2024/11/24 3:36:16

文章目录

    • 安装node.js和npm
      • 1、 Node.js和npm简介
      • 2、下载Node.js
      • 3、安装Node.js
      • 4、检查是否安装成功
      • 5、环境配置(很重要!)
      • 6、配置内网离线库
    • 安装WebStorm并运行Vue项目
      • 1、新建项目
      • 2、测试

安装node.js和npm

1、 Node.js和npm简介

简单的说 Node.js 就是运行在服务端的 JavaScript。Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型,使其轻量又高效。Node.js 的包管理器 npm,是全球最大的开源库生态系统。
新版的Node.js已自带npm,安装Node.js时会一起安装,npm的作用就是对Node.js依赖的包进行管理,也可以理解为用来安装/卸载Node.js需要装的东西。

2、下载Node.js

打开官网下载链接:https://nodejs.org/en/download/
在这里插入图片描述

3、安装Node.js

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

4、检查是否安装成功

在键盘按下【win+R】键,输入cmd,然后回车,打开cmd窗口
在这里插入图片描述
安装完后的目录如下图所示:
在这里插入图片描述

5、环境配置(很重要!)

5.1、说明
这里的环境配置主要配置的是npm安装的全局模块所在的路径,以及缓存cache的路径,之所以要配置,是因为以后在执行类似:npm install express [-g] (后面的可选参数-g,g代表global全局安装的意思)的安装语句时,会将安装的模块安装到【C:\Users\用户名\AppData\Roaming\npm】路径中,占C盘空间。
例如:我希望将全模块所在路径和缓存路径放在我node.js安装的文件夹中,则在我安装的文件夹【D:\Develop\nodejs】下创建两个文件夹【node_global】及【node_cache】如下图:
请添加图片描述创建完两个空文件夹之后,打开cmd命令窗口,输入:

npm config set prefix "D:\Develop\nodejs\node_global"
npm config set cache "D:\Develop\nodejs\node_cache"

请添加图片描述
5.2、设置环境变量
关闭cmd窗口,“我的电脑”-右键-“属性”-“高级系统设置”-“高级”-“环境变量”
请添加图片描述
进入环境变量对话框,在【系统变量】下新建【NODE_PATH】,输入【D:\Develop\nodejs\node_global\node_modules】,将【用户变量】下的【Path】修改为【D:\Develop\nodejs\node_global】
请添加图片描述
请添加图片描述
请添加图片描述
在这里插入图片描述

6、配置内网离线库

将两个配置文件.npmrc和.yarnrc放到“C:\用户\用户名”文件夹下即可在内网连接库加载依赖包

安装WebStorm并运行Vue项目

1、新建项目

请添加图片描述
请添加图片描述
项目名一定不要有大写,要不然就提示:

Sorry, name can no longer contain capital letters 抱歉,名称不能再包含大写字母

名称不能有大写字母,驼峰命名含有大写字母也不可以,换成小写的就好了
请添加图片描述
等待完成就可以
请添加图片描述

2、测试

点击package.json的绿色箭头或者直接点击右上角的箭头
请添加图片描述
运行完毕后,直接点击控制台中的网址就可以跳转到相应的网站
请添加图片描述

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

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

相关文章

阿里云服务器-Linux

说明:自己想玩一下服务器,记录一下服务器安装的环境以及软件。包括JDK,Mysql,tomcat等。 一:JDK篇 服务器上也是需要安装JDK环境的,跑不掉的。阿里云服务器提供了命令安装,固定安装目录自动配…

【Jmeter】Oracle数据迁移,批量插入测试数据~

前言~1.准备事项1.1 梳理脚本 2.动起手来2.1 了解 JDBC Connection Configuration2.2 配置 JDBC请求 3.生成测试链路3.1 获取表主键信息3.2 获取目标表表结构3.3 拼接数据并生成sql3.4 插入数据 4.优化脚本(主键信息4.1 添加Beshell后置处理器4.2 优化拼接数据请求&…

C++类与对象——this指针

文章目录 概述this指针的引出this指针的特性将this指针用于多个对象的比较this指针可以为空吗? 概述 本篇博客主要讲解C类和对象模块中的this指针的知识,将会深入探究this指针的使用细节即使用时需要注意的点,并且简单讲解一下底层的实现原理…

Maven(五):Maven的使用——依赖的测试

Maven(五):Maven的使用——依赖的测试 前言一、实验六:测试依赖的范围1、依赖范围1.1 compile 和 test 对比1.2 compile 和 provided 对比1.3 结论 二、实验七:测试依赖的传递性1、依赖的传递性1.1 概念1.2 传递的原则…

内网渗透之横向移动rdpwinrmwinrsspnkerberos

0x00 准备 环境:god.org cs上线 win2008web 提权利用ms14-058 抓取hash和明文密码(当获取到其他主机就重复提权和抓取密码) 扫描存活主机,扫描端口 代理转发-转发上线,生成反向连接木马,绑定监听器,上传至web根目录(方…

hardhat 本地连接matemask钱包

Hardhat 安装 https://hardhat.org/hardhat-runner/docs/getting-started#quick-start Running a Local Hardhat Network Hardhat greatly simplifies the process of setting up a local network by having an in-built local blockchain which can be easily run through a…

制作一个高质量的FAQ页面需要考虑哪些因素?

作为现代企业不可缺少的知识库,FAQ页面(Frequently Asked Questions)是集中呈现重要信息供用户查询和解决问题的权威场所。如果您在网站上提供了不错的产品或服务,很多客户都会通过访问FAQ页面找到他们需要的答案。 在设计和创建…

Linux Ansible安装以及环境搭建

Ansible介绍 Ansible是一种基于Python的自动化配置工具,通过OpenSSH的方式管理被管理节点,实现批量系统配置、批量程序部署、批量运行命令等功能。 当管理节点需要管理被管理节点时,只需要在管理节点安装ansible,无需在被管理节…

23种设计模式-代理模式

代理模式 在代理模式(Proxy Pattern)中,一个类代表另一个类的功能。这种类型的设计模式属于结构型模式。 在代理模式中,我们创建具有现有对象的对象,以便向外界提供功能接口。 介绍 意图:为其他对象提供…

【KingSCADA】什么是精灵图以及如何创建精灵图

大家好,我是雷工! 本篇学习精灵图的制作,以下为学习内容及相关笔记。 一、什么是精灵图 精灵图是一种在外观上类似组合图,但内部嵌入了比较丰富的动画链接与逻辑控制,工程开发人员只要将其从精灵图库中调出来放置在开…

[Netty] Mpsc Queue (十七)

JCTools 是适用于 JVM 并发开发的工具,主要提供了一些 JDK 确实的并发数据结构,例如非阻塞 Map、非阻塞 Queue 等。其中非阻塞队列可以分为四种类型,可以根据不同的场景选择使用。 Spsc 单生产者单消费者Mpsc 多生产者单消费者Spmc 单生产者…

大模型(LLM)训练微调综述学习

总览 介绍大模型训练的微调方法,包括prompt tuning、prefix tuning、LoRA、p-tuning和AdaLoRA等。介绍使用deepspeed和LoRA进行大模型训练的相关代码。给出petals的介绍,它可以将模型划分为多个块,每个用户的机器负责其中一块,分…

PS学习记录-PPI与DPI

先说两者的重点: dpi是印刷图像时候用的,ppi是设计图像时候用的dpi:【点/英寸】 是印刷计量单位,是每英寸上所印刷的【墨点数】,打印图片一般300dpi左右,代表打印的解析度。ppi:【像素/英寸】是…

快速精通Git

一、 版本控制工具 1.1. 什么是版本控制系统? 版本控制系统(Version Control System):是一种记录一个或若干文件内容变化,以便将来查阅特定版本修订情况的系统。版本控制系统不仅可以应用于软件源代码的文本文件,而且…

温度调制式差示扫描量热法(MTDSC)中的正弦波温度控制技术

摘要:在调制温度式差式扫描量热仪(MTDSC)中,关键技术之一是正弦波加热温度的实现,此技术是制约目前国内无法生产MTDSC量热仪的重要障碍,这主要是因为现有的PID温控技术根本无法实现不同幅值和频率正弦波这样…

uie-base使用记录(paddlenlp)

参考文章:https://aistudio.baidu.com/aistudio/modelsdetail?modelId22 参考文章:https://paddlenlp.readthedocs.io/zh/latest/FAQ.html 参考文章:https://developer.aliyun.com/article/1066857 参考文章:https://github.com/…

【计算机基本原理-数据结构】八大数据结构分类

【计算机基本原理-数据结构】八大数据结构分类 1)数组2)链表3)队列4)栈5)树6)图7)堆8)散列表(哈希表) 数据结构是计算机存储、组织数据的方式。一种好的数据结构可以带来更高的运行或…

Java基础(十三)系统相关类

1. 系统相关类 1.1 java.lang.System类 System类代表系统,系统级的很多属性和控制方法都放置在该类的内部。该类位于java.lang包。 由于该类的构造器是private的,所以无法创建该类的对象。其内部的成员变量和成员方法都是static的,所以也可…

Netty(一)深入Hotspot源码与Linux内核理解NIO与Epoll

深入Hotspot源码与Linux内核理解NIO与Epoll 前言介绍Netty 的介绍Netty 的应用场景理解阻塞和同步关键字初始BIO、NIO、AIOBIO(Blocking IO)缺点:应用场景: NIO(Non Blocking IO)应用场景:NIO非阻塞代码示例存在的问题 NIO 有三大核心组件&am…

Mybatis学习基础篇(一)——使用Maven快速搭建一个mybatis项目,并实现简单的增删改查

题外话: 在了解mybatis框架之前,我先说明一句,目前主流的框架技术层出不穷,每个人都有自己喜欢的技术框架,自己喜欢用就行。技术并没有高低之分,喜欢用就用,虽然目前大部分人都喜欢向新技术看齐…