最新公告
  • 欢迎您光临起源地模板网,本站秉承服务宗旨 履行“站长”责任,销售只是起点 服务永无止境!立即加入钻石VIP
  • 前端开发-开发环境的安装与配置

    正文概述 掘金(Nara)   2021-02-24   532

    一.nvm和node的安装及使用

    1.nvm是什么?

    nvm(node.js version management),它是一个nodejs的版本管理工具。通过它可以安装和切换不同版本的node。

    2.下载nvm

     可在点此在github上下载最新版本,本次下载安装的是windows版本。打开网址我们可以看到有两个版本:

    • nvm-noinstall.zip:绿色免安装版,但使用时需进行配置。
    • nvm-setup.zip:安装版,推荐使用

    3.安装

    a.双击nvm-setup.exe,按照提示进行安装

    前端开发-开发环境的安装与配置

    b.选择nvm安装路径

    前端开发-开发环境的安装与配置

     c.选择nodejs路径

    前端开发-开发环境的安装与配置

    d.确认安装即可

    前端开发-开发环境的安装与配置

    e.安装完确认

    打开CMD,输入命令 nvm ,安装成功则如下显示。可以看到里面列出了各种命令,后面会列出这些命令的中文示意。

    前端开发-开发环境的安装与配置

    4.安装,管理node.js

    1.查看本地安装的所有node版本;有可选参数available,显示所有可下载的版本。

    nvm list [available]
    

    2.安装,命令中的版本号可自定义,具体参考命令1查询出来的列表

    nvm install 15.0.1
    

    3.使用特定版本

    nvm use 15.0.1
    

    测试是否安装成功

    node --vresion
    
    npm --vresion
    

    4.卸载特定版本

    nvm uninstall 15.0.1
    

    5.命令提示

    1. nvm arch :显示node是运行在32位还是64位。
    2. nvm install <version> [arch] :安装node, version是特定版本也可以是最新稳定版本latest。可选参数arch指定安装32位还是64位版本,默认是系统位数。可以添加--insecure绕过远程服务器的SSL。
    3. nvm list [available] :显示已安装的列表。可选参数available,显示可安装的所有版本。list可简化为ls。
    4. nvm on :开启node.js版本管理。
    5. nvm off :关闭node.js版本管理。
    6. nvm proxy [url] :设置下载代理。不加可选参数url,显示当前代理。将url设置为none则移除代理。
    7. nvm node_mirror [url] :设置node镜像。默认是https://nodejs.org/dist/。如果不写url,则使用默认url。设置后可至安装目录settings.txt文件查看,也可直接在该文件操作。
    8. nvm npm_mirror [url] :设置npm镜像。https://github.com/npm/cli/archive/。如果不写url,则使用默认url。设置后可至安装目录settings.txt文件查看,也可直接在该文件操作。
    9. nvm uninstall <version> :卸载指定版本node。
    10. nvm use [version] [arch] :使用制定版本node。可指定32/64位。
    11. nvm root [path] :设置存储不同版本node的目录。如果未设置,默认使用当前目录。
    12. nvm version :显示nvm版本。version可简化为v。

    6.注意

      本节列出node.js版本管理工具nvm的安装及使用,需要注意的是安装路径最好不要出现中文和空格。

    二.包管理工具

    • cnpm

      npm install -g cnpm --registry=https://registry.npm.taobao.org

    • yarn

      npm i -g -yarn

    测试是否安装成功

    yarn --vresion
    

    安装依赖

    yarn global add @vue/cli
    

    三.vsCode安装及插件的安装

    vsCode是目前大多数前端从业者的喜爱的开发工具 vscode下载地址 在此列举开发中常用的几个插件

    • Chinese (Simplified) Language Pack for Visual Studio Code

    中文(简体)语言包为 VS Code 提供本地化界面。

    前端开发-开发环境的安装与配置

    • Auto Close Tag

    自动添加HTML/XML关闭标记。

    前端开发-开发环境的安装与配置

    • Auto Rename Tag

    自动重命名配对的HTML/XML标记,与Visual Studio IDE一样。

    前端开发-开发环境的安装与配置

    • Beautify

    美化代码,代码书写更显眼,层级区分更明细

    前端开发-开发环境的安装与配置

    • Bracket Pair Colorizer

    这个扩展允许匹配括号与颜色识别。用户可以定义要匹配的字符和要使用的颜色。

    前端开发-开发环境的安装与配置

    • ESLint

    扩展使用安装在打开的工作区文件夹中的ESLint库

    前端开发-开发环境的安装与配置

    • GitLens — Git supercharged

    git多人协作的时候需要查看日志,如果能在当前代码中查看到那是很方便的一件事,能省去很多时间去其他工具查看,提高工作效率。

    前端开发-开发环境的安装与配置


    起源地下载网 » 前端开发-开发环境的安装与配置

    常见问题FAQ

    免费下载或者VIP会员专享资源能否直接商用?
    本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。更多说明请参考 VIP介绍。
    提示下载完但解压或打开不了?
    最常见的情况是下载不完整: 可对比下载完压缩包的与网盘上的容量,若小于网盘提示的容量则是这个原因。这是浏览器下载的bug,建议用百度网盘软件或迅雷下载。若排除这种情况,可在对应资源底部留言,或 联络我们.。
    找不到素材资源介绍文章里的示例图片?
    对于PPT,KEY,Mockups,APP,网页模版等类型的素材,文章内用于介绍的图片通常并不包含在对应可供下载素材包内。这些相关商业图片需另外购买,且本站不负责(也没有办法)找到出处。 同样地一些字体文件也是这种情况,但部分素材会在素材包内有一份字体下载链接清单。
    模板不会安装或需要功能定制以及二次开发?
    请QQ联系我们

    发表评论

    还没有评论,快来抢沙发吧!

    如需帝国cms功能定制以及二次开发请联系我们

    联系作者

    请选择支付方式

    ×
    迅虎支付宝
    迅虎微信
    支付宝当面付
    余额支付
    ×
    微信扫码支付 0 元