JavaScript快速入门-01-环境搭建

1 环境搭建

搭建JavaScript开发环境有很多种组合,本文中采用 Visual Studio Code和Node.js的组合,详细如下所示:

1.1 Node.js环境搭建

1.1.1 下载Node.js

不管是基于Windows还是Linux,都需要下载相应的安装包,到Node.js官网根据系统下载相应版本的Node.js版本。下载地址如下:

https://nodejs.org/en/download/

1.1.2 安装Node.js

1.1.2.1 基于Windows

1.1.2.1.1 安装Node.js

在Windows中安装比较简单,按照向导提示安装即可。

1.1.2.1.2 配置Node.js
  • 1、在安装目录中创建两个文件夹 node_cache和 *node_global

这里创建的两个文件夹主要是用来配置npm安装的全局模块所在的路径和缓存cache的路径。若在以后执行npm install express -g 语句时,会将安装的模块安装到 %USERPROFILE%\AppData\Roaming\npm。如果希望自定义安装位置,则创建以上两个文件夹,再打开命令行窗口,执行以下命令即可:

npm config set prefix "D:\Program Files\Nodejs\node_global"
npm config set cache "D:\Program Files\Nodejs\node_cache"

npm默认的源地址在国外,访问比较慢,可以配置为国内源,设置如下所示:

C:\Users\Surpass>npm config set registry https://registry.npmmirror.com
C:\Users\Surpass> npm get registry
https://registry.npmmirror.com/
  • 2、配置环境变量

在path中添加node的安装位置,如本例中Node.js安装目录为:D:\Program Files\Nodejs\node_modules
新建一个系统变量,并按如下所示进行设置:

环境变量名称:NODE_PATH
环境变量值:D:\Program Files\Nodejs\node_global\node_modules
  • 3、打开命令行窗口,输入以下命令
PS C:\Users\Surpass> node -v
v17.8.0
PS C:\Users\Surpass> npm -v
8.5.5

输入node -v显示node版本说明已经安装成功
输入npm -v显示npm版本说明自带的npm已经安装成功,其作用就是对Node.js依赖的包进行管理
环境变量这一步,在安装时,若勾选Add to PATH则不需要单独配置环境变量

  • 4、测试,配置完成,安装一个module测试一下,以express为例,示例如下所示:
C:\Users\Surpass> npm install express -g
added 48 packages, and changed 2 packages in 2s

注意: 如果安装时不加-g参数,则安装的模块会安装在当前路径下

1.1.2.1 基于Linux

1.1.2.1.1 安装Node.js

将下载下来的Node.js版本包解压,并放置相应的目录,如下所示:

tar -xf node-v17.8.0-linux-x64.tar.xz -C /usr/local/node.js/
1.1.2.1.2 配置Node.js
  • 1、配置环境变量
vim /etc/profile
 增加以下内容
export NODEJS_HOME=/usr/local/node.js
export PATH=$PATH:$NODEJS_HOME/bin
source /etc/profile
  • 2、测试配置
node -v
 v17.8.0
npm -v
 8.5.5

另外,也可以通过创建软链接的方式实现同样的效果

1.2 开发环境配置

1.2.1 安装Visual Studio Code

Visual Studio Code,简称为VS Code是微软开源的一款文本编辑器,在安装种类插件之后,也可以做一款轻型的IDE工具,下载完成之后,按照提示即可,下载地址如下:

https://code.visualstudio.com/

1.2.2 配置VS Code

  • 1、使用VS Code选择打开或新建文件夹,示例文件夹如下所示:

C:\Users\Surpass\Documents\NodejsProjects

  • 2、 新建一个js文件,输入以下代码:
(function name(params) {
    console.log("Hello world")
})();

按F5键,并选择Node.js运行即可

  • 也可以安装插件Code Runner,在代码右键选择Run Code
  • 如果不需要编写工程化的代码,在Chrome也可以编写一些简章的JavaScript代码,打开浏览器按F12键,切换到Console选项卡即可。

原文地址:https://www.jianshu.com/p/f197706f9dbf

本文同步在微信订阅号上发布,如各位小伙伴们喜欢我的文章,也可以关注我的微信订阅号:woaitest,或扫描下面的二维码添加关注:

JavaScript快速入门-01-环境搭建

Original: https://www.cnblogs.com/surpassme/p/16586710.html
Author: Surpassme
Title: JavaScript快速入门-01-环境搭建

原创文章受到原创版权保护。转载请注明出处:https://www.johngo689.com/581655/

转载文章受原作者版权保护。转载请注明原作者出处!

(0)

大家都在看

  • 上篇:34个JavaScript栗子,从易到难。

    alert("hello world") document.write("hello world") console.log("好…

    Linux 2023年6月7日
    089
  • js中div显示和隐藏钮为什么页面总是跳一下到最上面

    中心动态 产权动态 财经聚焦 点击onclick事件 是因为的href属性,使用了#的缘故,你点击a的时候回到页面的开始,然后才在做click函数,你可以不使用href属性。但是这…

    Linux 2023年6月13日
    0108
  • JavaScript 做的网页版扫雷小游戏

    闲来无事做了个网页版扫雷小游戏,基本实现了扫雷客户端的全部功能。但是感觉面向对象用的还不是很好,有待优化。 游戏地址:http://twgdh.com/saolei/index.h…

    Linux 2023年6月13日
    0120
  • 如何在EMACS 设置格式

    如何设置Emacs的各种模式, 这个教程要观摩一下的 http://www.emacswiki.org/emacs/IndentingC#toc1 Original: https:…

    Linux 2023年6月14日
    0109
  • python递归查找文件目录

    1 # -*- coding:utf-8 -*- 2 3 import os 4 5 allfile = [] 6 def get_all_file(path): 7   allf…

    Linux 2023年6月6日
    086
  • 嵌入式软件架构设计-程序分层

    1 前言 在嵌入式MCU软件开发过程中,程序分层设计也是重中之重,关系到整个软件开发过程中的协同开发,降低系统软件的复杂度(复杂问题分解)和依赖关系、同时有利于标准化,便于管理各层…

    Linux 2023年6月7日
    0147
  • Redis集群的节点通信原理

    Redis集群搭建中,数据如何在节点分布的原理,下面来介绍一下节点之间是如何进行通信(节点握手) 一、基础通讯原理 1、维护集群的元数据的两种方案介绍及对比 在分布式存储中需要提供…

    Linux 2023年5月28日
    0148
  • Linux 逻辑卷&精简卷报错问题解决

    一、 故障 描述 现象1 :oraclelog 目录提示坏道信息,进行修复后执行删除文件操作,目录不可使用。 现象2 :lsblk 看到目录出现重复,并且有tmeta,tdata …

    Linux 2023年6月13日
    0109
  • 【Docker搭建】3. 在Docker中搭建Zookeeper集群

    docker pull zookeeper docker run –name zk1 -d zookeeper apt-get update apt-get install vi…

    Linux 2023年6月13日
    096
  • 拓扑排序

    拓扑排序 简介 拓扑排序是将偏序的数据线性化的一种排序方法。复习下偏序和全序的概念: 全序关系是偏序关系的一个子集。 全序是集合内任何一对元素都是可比较的,比如数轴上的点都具有一个…

    Linux 2023年6月13日
    0116
  • 云主机搭建WordPress个人博客

    安装宝塔控制面板 宝塔面板是一个简单、好用的面板,它的功能就是将LNMP和服务器的各种管理集成到一个可视化的WEB环境来管理,通过面板,我们普通人不需要掌握具体的技术,只需要动动鼠…

    Linux 2023年6月8日
    0109
  • 设计模式——结构性设计模式

    结构性设计模式 针对类与对象的组织结构。(白话:类与对象之间的交互的多种模式 类/对象适配器模式 当需要传入一个A类型参数,但只有B类型类时,就需要一个A类型的适配器装入B类的数据…

    Linux 2023年6月7日
    0127
  • Linux之虚拟专用网络—VPN

    404. 抱歉,您访问的资源不存在。 可能是URL不正确,或者对应的内容已经被删除,或者处于隐私状态。 [En] It may be that the URL is incorre…

    Linux 2023年5月27日
    0113
  • 40+倍提升,详解 JuiceFS 元数据备份恢复性能优化之路

    JuiceFS 支持多种元数据存储引擎,且各引擎内部的数据管理格式各有不同。为了便于管理,JuiceFS 自 0.15.2 版本提供了 dump 命令允许将所有元数据以统一格式写入…

    Linux 2023年6月14日
    0109
  • Linux下如何部署FTP服务器

    FTP 是 File Transfer Protocol 的缩写,即文件传输协议,它通过网络在服务器和客户端之间传输文件,现在已经成为一种广泛使用的标准工具 vsftpd 是 ve…

    Linux 2023年6月13日
    093
  • k8s 用pod 创建的prometheus ,虚拟机断电关机,导致普米无法起来,报错Opening storage failed unexpected end of JSON input

    虚拟机重新启动后,查看Prometheus 查看容器日志 这个问题出现的原因是因为断电关机,导致Prometheus 数据损坏,无法启动,因为我这个Prometheus 是测试使用…

    Linux 2023年6月14日
    082
亲爱的 Coder【最近整理,可免费获取】👉 最新必读书单  | 👏 面试题下载  | 🌎 免费的AI知识星球