草庐IT

nodeJS安装(超详细小白教程)

小滦不秃头‍♂️ 2023-11-12 原文

目录

1、Node.js是什么

2、什么是npm

一、Node.js环境搭建

1、下载

2、解压

3、配置环境变量

 4、配置npm全局模块路径和cache默认安装位置

 5、下载github的Vue的项目解压

 6、在解压的项目中是没有node_modules的,在工程的根目录下需要通过npm   install进行再次依赖下载(package.json) 

7、在通过npm run dev 启动项目(按住shift键,右键选择打开Powershell窗口) 

二、了解elementUi


1、Node.js是什么

1.1 Node.js是一个基于Chrome V8引擎的[JavaScript运行环境]。 Node.js使用了一个事件驱动、非阻塞式I/O 的模型。

1.2 Node.js是一个让JavaScript运行在服务端的开发平台,它让JavaScript成为与PHP、Python、Perl、Ruby等服务端语言平起平坐的脚本语言 

  注1:Node.js-->JavaScript运行环境,开发语言是:javascript
          J2EE   -->Java运行环境, 开发语言是java
  注2:Node.js v10.15.3文档地址:
fs 文件系统 | Node.js API 文档

2、什么是npm

  npm其实是Node.js的包管理工具(package manager)。

  为啥我们需要一个包管理工具呢?因为我们在Node.js上开发时,会用到很多别人写的JavaScript代码。
   如果我们要使用别人写的某个包,每次都根据名称搜索一下官方网站,下载代码,解压,再使用,非常繁琐。
   于是一个集中管理的工具应运而生:大家都把自己开发的模块打包后放到npm官网上,如果要使用,
   直接通过npm安装就可以直接用,不用管代码存在哪,应该从哪下载。

   更重要的是,如果我们要使用模块A,而模块A又依赖于模块B,模块B又依赖于模块X和模块Y,
   npm可以根据依赖关系,把所有依赖的包都下载下来并管理起来。否则,靠我们自己手动管理,肯定既麻烦又容易出错。

   注1:npm==maven  有点类似

一、Node.js环境搭建

前言:由于Node.js平台是在后端运行JavaScript代码,所以,必须首先在本机安装Node环境。
   想一想,java开发的第一步:是不是安装JDK,再配置环境变量java_home/classpath/path


1、下载

 下载地址:https://nodejs.org/zh-cn/download/
 选择相应的版本下载,本章使用的是:node-v10.15.3-win-x64.zip    

注1:Node有两个版本线: LTS是长期维护的稳定版本Current是新特性版本

2、解压

② 将文件解压到指定位置(例如:D:\initPath,一定是要在非中文目录下),并在解压后的目录下建立node_global和node_cache  

  注1:新建目录说明
           node_global:npm全局安装位置
           node_cache:npm缓存路径

 注2:本教程是将文件解压到D:\nodeJS目录,后面都以此为例,实际开发中请修改成自己的解压  目录D:\nodeJS\node-v10.15.3-win-x64 

3、配置环境变量

新增NODE_HOME,值为:D:\nodeJS\node-v10.15.3-win-x64

修改PATH并在最后添加:;%NODE_HOME%;%NODE_HOME%\node_global

 注1:环境变量查看
           echo %node_home%
           echo %path%

 注2:测试安装是否成功:打开cmd窗口,输出如下命令会输出NodeJs和npm的版本号
           node -v
           npm -v

 4、配置npm全局模块路径和cache默认安装位置

打开cmd,分开执行如下命令:

        npm config set cache "D:\nodeJS\node-v10.15.3-win-x64\node_cache"
        npm config set prefix "D:\nodeJS\node-v10.15.3-win-x64\node_global"
        npm config set registry https://registry.npm.taobao.org/

       注1:将步骤一创建的node_global(npm全局安装位置)和node_cache(npm缓存路径)与npm联系起来

      注2:如果执行命令卡死,可以删除C:\Users\用户名\.npmrc 后重新执行。(用户名:为当前电脑的用户名)

      注3:"D:\nodeJS\node-v10.15.3-win-x64\node_global",双引号不能少

 对比 .npmrc中路径是否与填写一致

 5、下载github的Vue的项目解压

 6、在解压的项目中是没有node_modules的,在工程的根目录下需要通过npm   install进行再次依赖下载(package.json) 

7、在通过npm run dev 启动项目(按住shift键,右键选择打开Powershell窗口) 

      npm install

 以上命令执行完毕后,会生成如下文件          %node_home%\node_global\node_modules\webpack  

 🐷👉   注意:下载过程中出现warn不用管,出现Error,删掉下载的破碎文件重新下载

以下为运行成功(安装依赖时间可能较长最夸张不过半小时): 

 在通过npm run dev 启动项目

项目能跑起来说明成功了

扣取以上登录网站运行结果:

二、了解elementUi

1. ElementUI简介
我们学习VUE,知道它的核心思想式组件和数据驱动,但是每一个组件都需要自己编写模板,样式,添加事件,数据等是非常麻烦的, 所以饿了吗推出了基于VUE2.0的组件库,它的名称叫做element-ui,提供了丰富的PC端组件

 ElementUI官网:https://element.eleme.cn/#/zh-CN

注1:类似前端框架还有iview

## demo1.html(非模块化)
## hello elementUI

2. Vue+ElementUI安装
2.1 CDN方式

      <!-- 1. 导入css -->
      <link href="https://cdn.bootcss.com/element-ui/2.8.2/theme-chalk/index.css"                           rel="stylesheet">
      <!-- 2. 引入vue和vue-router-->
      <script src="https://cdn.bootcss.com/vue/2.6.10/vue.js"></script>
      <!-- 未使用vue路由功能可不导入 -->
      <script src="https://cdn.bootcss.com/vue-router/3.0.6/vue-router.js"></script>
      <!-- 3. 引入ElementUI组件 -->
      <script src="https://cdn.bootcss.com/element-ui/2.8.2/index.js"></script> 

 2.2 NPM(需要配置NodeJs环境) 

本期内容结束~~~~~~~~~~~~~~~~~~~

有关nodeJS安装(超详细小白教程)的更多相关文章

  1. ruby - 在 64 位 Snow Leopard 上使用 rvm、postgres 9.0、ruby 1.9.2-p136 安装 pg gem 时出现问题 - 2

    我想为Heroku构建一个Rails3应用程序。他们使用Postgres作为他们的数据库,所以我通过MacPorts安装了postgres9.0。现在我需要一个postgresgem并且共识是出于性能原因你想要pggem。但是我对我得到的错误感到非常困惑当我尝试在rvm下通过geminstall安装pg时。我已经非常明确地指定了所有postgres目录的位置可以找到但仍然无法完成安装:$envARCHFLAGS='-archx86_64'geminstallpg--\--with-pg-config=/opt/local/var/db/postgresql90/defaultdb/po

  2. ruby - 完全离线安装RVM - 2

    我打算为ruby​​脚本创建一个安装程序,但我希望能够确保机器安装了RVM。有没有一种方法可以完全离线安装RVM并且不引人注目(通过不引人注目,就像创建一个可以做所有事情的脚本而不是要求用户向他们的bash_profile或bashrc添加一些东西)我不是要脚本本身,只是一个关于如何走这条路的快速指针(如果可能的话)。我们还研究了这个很有帮助的问题:RVM-isthereawayforsimpleofflineinstall?但有点误导,因为答案只向我们展示了如何离线在RVM中安装ruby。我们需要能够离线安装RVM本身,并查看脚本https://raw.github.com/wayn

  3. ruby-on-rails - rails 目前在重启后没有安装 - 2

    我有一个奇怪的问题:我在rvm上安装了ruby​​onrails。一切正常,我可以创建项目。但是在我输入“railsnew”时重新启动后,我有“程序'rails'当前未安装。”。SystemUbuntu12.04ruby-v"1.9.3p194"gemlistactionmailer(3.2.5)actionpack(3.2.5)activemodel(3.2.5)activerecord(3.2.5)activeresource(3.2.5)activesupport(3.2.5)arel(3.0.2)builder(3.0.0)bundler(1.1.4)coffee-rails(

  4. ruby - 如何为 emacs 安装 ruby​​-mode - 2

    我刚刚为fedora安装了emacs。我想用emacs编写ruby。为ruby​​提供代码提示、代码完成类型功能所需的工具、扩展是什么? 最佳答案 ruby-mode已经包含在Emacs23之后的版本中。不过,它也可以通过ELPA获得。您可能感兴趣的其他一些事情是集成RVM、feature-mode(Cucumber)、rspec-mode、ruby-electric、inf-ruby、rinari(用于Rails)等。这是我当前用于Ruby开发的Emacs配置:https://github.com/citizen428/emacs

  5. ruby-on-rails - 无法在centos上安装therubyracer(V8和GCC出错) - 2

    我正在尝试在我的centos服务器上安装therubyracer,但遇到了麻烦。$geminstalltherubyracerBuildingnativeextensions.Thiscouldtakeawhile...ERROR:Errorinstallingtherubyracer:ERROR:Failedtobuildgemnativeextension./usr/local/rvm/rubies/ruby-1.9.3-p125/bin/rubyextconf.rbcheckingformain()in-lpthread...yescheckingforv8.h...no***e

  6. ruby - 通过 RVM (OSX Mountain Lion) 安装 Ruby 2.0.0-p247 时遇到问题 - 2

    我的最终目标是安装当前版本的RubyonRails。我在OSXMountainLion上运行。到目前为止,这是我的过程:已安装的RVM$\curl-Lhttps://get.rvm.io|bash-sstable检查已知(我假设已批准)安装$rvmlistknown我看到当前的稳定版本可用[ruby-]2.0.0[-p247]输入命令安装$rvminstall2.0.0-p247注意:我也试过这些安装命令$rvminstallruby-2.0.0-p247$rvminstallruby=2.0.0-p247我很快就无处可去了。结果:$rvminstall2.0.0-p247Search

  7. ruby - 如何在 Lion 上安装 Xcode 4.6,需要用 RVM 升级 ruby - 2

    我实际上是在尝试使用RVM在我的OSX10.7.5上更新ruby,并在输入以下命令后:rvminstallruby我得到了以下回复:Searchingforbinaryrubies,thismighttakesometime.Checkingrequirementsforosx.Installingrequirementsforosx.Updatingsystem.......Errorrunning'requirements_osx_brew_update_systemruby-2.0.0-p247',pleaseread/Users/username/.rvm/log/138121

  8. ruby - Fast-stemmer 安装问题 - 2

    由于fast-stemmer的问题,我很难安装我想要的任何ruby​​gem。我把我得到的错误放在下面。Buildingnativeextensions.Thiscouldtakeawhile...ERROR:Errorinstallingfast-stemmer:ERROR:Failedtobuildgemnativeextension./System/Library/Frameworks/Ruby.framework/Versions/2.0/usr/bin/rubyextconf.rbcreatingMakefilemake"DESTDIR="cleanmake"DESTDIR=

  9. ruby - 安装 Ruby 时遇到问题(无法下载资源 "readline--patch") - 2

    当我尝试安装Ruby时遇到此错误。我试过查看this和this但无济于事➜~brewinstallrubyWarning:YouareusingOSX10.12.Wedonotprovidesupportforthispre-releaseversion.Youmayencounterbuildfailuresorotherbreakages.Pleasecreatepull-requestsinsteadoffilingissues.==>Installingdependenciesforruby:readline,libyaml,makedepend==>Installingrub

  10. ruby - 通过 RVM 安装 Ruby 1.9.2 永远行不通! - 2

    当我执行>rvminstall1.9.2时一切顺利。然后我做>rvmuse1.9.2也很顺利。但是当涉及到ruby​​-v时..sam@sjones:~$rvminstall1.9.2/home/sam/.rvm/rubies/ruby-1.9.2-p136,thismaytakeawhiledependingonyourcpu(s)...ruby-1.9.2-p136-#fetchingruby-1.9.2-p136-#downloadingruby-1.9.2-p136,thismaytakeawhiledependingonyourconnection...%Total%Rece

随机推荐