环境搭建 我的开发环境是windows10+vscode 安装Node.js 我推荐使用LTS(长期支持版本) Node.js下载地址: https://nodejs.org/en/download/...CentOS 下源码安装 Node.js 1、下载源码,你需要在https://nodejs.org/en/download/下载最新的Nodejs版本,本文以v0.10.24为例: cd /usr/...local/src/ wget http://nodejs.org/dist/v0.10.24/node-v0.10.24.tar.gz 2、解压源码 tar zxvf node-v0.10.24.tar.gz...IDE环境 我使用的是vscode环境,不为别的,就因为vscode的高性能和强大的功能 其它IDE也可以,例如Jetbrain家的IDEA之类的 创建第一个应用 新建一个空白目录,并在此目录下新建app.js...应用前,让我们先了解下 Node.js 应用是由哪几部分组成的: 引入 required 模块:我们可以使用 require 指令来载入 Node.js 模块。
[TOC] (1)Node.js 简介与安装 1.Nodejs简介 Node.js是目前非常火热的技术(正式开启JavaScript的后端开发之旅),但是它的诞生经历却很奇特。...命令 npm其实是Node.js的包管理工具(package manager),通过CommonJS实现,大家都把自己开发的模块打包后放到npm官网上,然后通过npm安装就可以直接用; 解决依赖性问题...(删除就是uninstall) npm install babel-cli --save-dev #-D => 将下载的包保存在项目配置信息(开发依赖)里面 npm list #显示项目里面安装那些模块...npm与mode.js n stable #nodejs也更新 #指定版本安装模块 npm info 模块名 #查看可用版本 npm i 模块名@版本 npm outdated #显示项目中需要更新的模块...WeiyiGeek.VScode (4) nodejs入坑记 Q;问题1安装node.js爆出C++版本过低?
前言 之前编写了一个vscode插件用vscode写博客和发布,然后有园友要求写一篇来介绍如何开发一个vscode扩展插件,或者说介绍开发这个插件的过程。...然而文章还没有写,园子里面已经有人发布一个文章,是园友上位者的怜悯的VSCODE 插件初探介绍了自己开发的一个插件与如何简单的开发一个插件。...虽然已经有这么一个文章,但是我觉得还是可以更仔细的来介绍如何来开发一个vscode插件,也算之前说好要写这么一个文章的一个承诺吧,于是就有了还这么篇文章。...在os系统上可以通过用上下键来选择要创建哪种类型的项目,在win可以通过输入1、2、3这样的数字然后按回车来选择。...项目运行起来后,会调用一个新的vscode窗口在标题栏的地方显示一个[扩展开发主机]的标题,然后这个窗口是支持我们刚才运行的插件项目的命令。 ?
目录标题 1、安装Python3 2、集成开发环境:Pycharm 3、安装webdriver扩展。 4、安装chrome浏览器,没谷歌写什么程序 5、安装chromedriver。...6、上代码 补充说明: 1、安装Python3 下载链接: https://www.python.org/ 检查 Python3 是否正常可用:python3 -V 2、集成开发环境:Pycharm...下载链接: https://www.jetbrains.com/pycharm/download/#section=windows 你用vscode也行!...3、安装webdriver扩展。 它是Selenium模块的一部分。Selenium是一个用于Web应用程序测试的工具,用于测试你的应用程序看是否能够很好得工作在不同浏览器和操作系统之上。...下载地址: http://chromedriver.storage.googleapis.com/index.html或者https://npm.taobao.org/mirrors/chromedriver
CSS3的标准并没有全部定稿,目前CSS3的标准分成了不同的模块,具体的标准由各个模块推动标准和定稿,标准制定的过程中,浏览器也在不断的发新的版本来兼容新的标准。...浏览器有时会给一些在试验阶段或非标准阶段的css属性添加前缀, 这样开发者就可以使用 浏览器行为的改变不会破坏标准. 开发人员应等待包含无前缀属性,直到浏览器行为标准化。 1....插件实现css3前缀的自动化处理 由于添加前缀工作都是否枯燥和没有意义,这些工作可以直接交给开发工具或者第三方的工具来自动化的实现处理。...而vscode也有对应的自动化的插件进行自动化的添加代码前缀。 vscode 自动化插件: Autoprefixer,可以自动化的给css、less、sass文件进行自动化的添加css3前缀。 ?...$ npm init -y # 初始化项目的npm配置文件 $ npm i -S gulp # 安装gulp到本地项目(仅开发时使用,S大写) $ npm i -S gulp-autoprefixer
跨平台] 应用场景 Node.js 在大部分领域都占有一席之地,尤其是I/O密集型的 Web 应用:Express / Koa 前端构建: WebpackGUI 客户端软件: VSCode / 网易云音乐...,缓存的原因:同步加载 文件模块查找耗时,如果每次require 都需要重新遍历查找,性能会比较差; 在实际开发中,模块可能包含副作用代码 // 有缓存 const mod1 = require('..../foo'); console.log(mod1 === mod3); // false 其他模块化规范 AMD 是 RequireJS 在推广过程中规范化产出,异步加载,推崇依赖前置 CMD...开发依赖 repository 代码托管地址 更多 package.json 配置 https://docs.npmjs.com/cli/v7/configuring-npm/package-json...Koa 对象 response / request / context / application 等扩展 Koa 常用中间件库 公司内部服务支持 进程管理 脚手架
微软认为JavaScript只是一门脚本语言,设计理念简单,缺乏对类与模块的支持,并不能真正用于开发大型Web应用。基于此,微软内部开始出现需要自定义工具去强化JavaScript开发的需求。...如果使用npm方式进行安装,只需要在终端执行如下的命令即可。 npm install –g typescript 不过,在实际项目开发过程中,并不需要对TypeScript进行全局安装。...VSCode的安装也非常简单,打开VSCode的官网,然后根据当前系统版本下载对应的安装包即可,如图1-1所示。...VSCode每次启动会自动检查是否为最新版本,并提示用户自动更新,所以无须担心当前是否为最新版本。 除了VSCode外,WebStrom也是一款不错的前端开发工具,开发时可以根据情况进行选择。...module:载入扩展模块。 target:设置ECMA版本。 declaration:额外生成一个扩展名为.d.ts的文件。 removeComments:删除文件的注释。
初始化项目 安装 Yeoman[2] 和 VS Code Extension Generator[3]: $ npm install -g yo generator-code 这个脚手架会生成一个可以立马开发的项目...而且 vscode 扩展的规模往往增长很快。它们是在多个源文件中编写的,并依赖于 npm 的模块。分解和重用是开发的最佳实践,但在安装和运行扩展时,它们是有代价的。...// vscode 这个模块包含了 VS Code 扩展的 API import vscode from 'vscode'; // 这个方法当你的扩展激活时调用,扩展会在命令首次执行时激活 export...插件(扩展)开发实战[29] 一文中我终于知道了 vscode webview 内部是不允许发送 ajax 请求,所有 ajax 请求都是跨域的,因为 webview 本身是没有 host 的。...https://vscode-api-cn.js.org/interfaces/Webview.html#onDidReceiveMessage [29] VSCode WebView插件(扩展)开发实战
它的出现使得JavaScript不再局限于浏览器端,开发人员可以使用JavaScript来构建高性能的网络应用程序。Node.js在性能、可扩展性、开发效率和用户体验方面有着持续的发展趋势。...Node.js拥有一个强大的包管理工具npm,它是世界上最大的开源库生态系统之一。开发者可以通过npm轻松地安装、发布、共享和管理第三方模块,加快开发速度。...tar -xvJf node-v16.17.0-linux-x64.tar.xz 采用创建软链接的方法,使得在任意目录下都可以直接使用node和npm命令。...七、总结 Node.js是一个非常适合构建高性能、可扩展的应用程序的平台,它能够快速地处理大量的并发请求,并且具有简单和灵活的部署过程。...同时,使用yarn工具可以更快、更稳定、更方便地管理项目依赖包,提高开发效率和项目的可靠性。在部署excalidraw-白板工具时,首先需要确保Node.js和npm(或yarn)已经正确安装。
VSCode 拥有一个庞大的开源社区。它的增长和潜力是无限的,在未来学习如何编码和编码本身将会更容易。 ---- 1. 自动闭合 HTML 标签 ? 图片 拥有这种扩展是必须的。...图片 对于大多数开发人员来说,处理括号是一种痛苦,尤其是在处理大型项目时。如果你有意大利面条式的代码,那就更糟糕了。相信我,Bracket Pair Colorizer 会减轻你所有的压力。...图片 这个扩展是我生活中不可或缺的。相信我,这会节省你很多时间。我很健忘,作为一个拥有大量组件、扩展、包(特别是 React 格式)的前端开发人员,我需要一些东西来帮助我处理文件路径。...图片 每个现代开发人员都已经知道 NPM 是什么以及为什么它很重要。Node Package Manager 是一个扩展,可以帮助您管理 Package.json 文件。...vscode-icons下载地址[25] ---- 23. Color Picker ? 图片 颜色选择器扩展可以帮助您轻松地在 CSS 文件中选择颜色。它将立即反映或应用于您当前正在处理的属性。
我们开发 vscode 插件,实际上就是在通过这些能力对 vscode 进行扩展。 这六类能力具体包括的功能和使用场景可以看下图。...vscode 插件的形态和一个 npm 包非常相似,需要在项目的根目录添加 package.json,并且在其中增加一些 vscode 独家的设置。...这两个函数需要在插件 npm 模块的入口文件 export 出去给 vscode 主动调用。 其中,activate 会在 vscode 认为合适的时机调用,并且在插件的运行周期内只调用一次。...从手写 paser 到 TextMate 在最初,微软的工程师们为web开发中常见的开发语言都手写了 paser。这类 paser 执行效率很高,但对开发者的能力要求也比较高,不太适合未来的插件扩展。...的 c++ 模块来加速正则表达式解析速度。
ESLint可以帮助你保持组织性,并且随着对Vue3的支持的增加,你可以编写可扩展的Vue项目。...Vue VSCode Snippets 这个插件基于最新的Vue官方语法高亮文件添加了语法高亮,并且依据Vue 2的API添加了代码片段。...Bookmarks 许多VSCode插件只有在大型项目时才真正展现出其全部潜力。 Bookmarks 可以让我们在代码中标记和命名位置。然后,可以在这些不同的书签之间跳转来提高我们的开发速度。...这个小的优化可以帮助防止很多错误,特别是在处理大型模板时. NPM Intellisense 在导入包时,NPM Intellisense都会自动完成我们的npm模块。...这样可以节省我们记住npm模块确切名称的时间,这也是我必备的插件之一。 ~完,我是刷碗智,我要去刷碗了,我们下期见!
前言 由于 Windows 和 Mac 原生的应用程序开发难度比较大,所以使用 Electron 版 TRTC 的能力就成了一个不错的选择。...不过由于国内网络环境比较复杂,而 Electron 的很多开发资源由位于境外服务器上,所以很多客户在初次对接时会遇到很多的环境配置问题。...这里我总结了一下使用 Electron 时可能遇到的各种问题,涉及【安装】 > 【开发】 > 【发布】的全过程,希望能够帮助到大家。...方案 B:给 vscode 授权:在“【系统偏好设置】>【安全与隐私】” 中允许 vscode 的授权。...这个过程很快,数秒内即可完成。
Check Point最近发现,网络攻击者在微软的 VSCode Marketplace中上传了3个恶意扩展,并被Windows 开发人员下载了 46600 次。...此扩展用于窃取有关开发人员系统的基本信息,包括主机名、操作系统、CPU 平台、总内存和有关中央处理器。到被发现时,该扩展程序已被下载超过 45000 次。...虽然允许用户上传的软件存储库(例如 NPM 和 PyPi)已经一次又一次地被证明存在安全风险,但针对VSCode Marketplace的恶意软件渗透还没有太多先例。...而AquaSec 已在 1 月份证明,将恶意扩展上传到 VSCode Marketplace 相当容易,并提出了一些高度可疑的案例,但是最终没能找到任何确凿的恶意程序。...Check Point 发现的案例表明,如同攻击者在NPM 和 PyPI 等软件存储库中的做法,他们正积极尝试通过上传恶意程序感染 Windows 开发人员,Check Point 建议 VSCode
1. 什么是第三方模块 写好的、具有特定功能的、我们能直接使用的模块即第三方模块,由于第三方模块通常都是由多个文件组成并且被放置在一个文件夹中,所以又名包。...第三方模块有两种存在形式: 以js文件的形式存在,提供实现项目具体功能的API接口。 以命令行工具形式存在,辅助项目开发 2....npm (node package manager): node的第三方模块管理 工具 下载: npm install 模块名称 卸载: npm unintall package模块名称 全局安装与本地安装...第三方模块nodemon nodemon是一个命令行工具, 用以辅助项目开发。 在Node.js中,每次修改文件都要在命令行具中重新执行该文件,非常繁琐。...第三方模块gulp 基于node平台开发的前端构建工具 将机械化操作编写成任务,想要执行机械化操作时执行一个命令行命令任务就能自动执行了 用机器代替手工,提高开发效率。 6.
版本管理我们在开发中,会有node版本不同的问题,如何快速切换node.js的版本,就是借助于版本管理工具n:一个npm全局的开源包,是依赖于npm来全局安装、使用的fnm: 快速简单,兼容性支持.node-version...1->2,就出出现报错 全局变量存在命名冲突,占用内存无法被回收 当我们多人进行开发的时候,如果变量命名相同,就会出现内存无法销毁,一直占用的问题,如果是严格模式还会报错,导致程序无法运行 IIFE...都需要重新遍历查找,性能会比较差在实际开发中,模块可能包含副作用代码实际项目中可能会引入模块的新版本,这个时候就需要读取新版本,而不是缓存区的旧版本,就需要编写无缓存的方式编写代码//有缓存const...那么这种情况我们一般想到的都是回调,即在fn1函数里面去调用fn2,如果需要多层的调用关系,就会出现fn3在fn2里面,fn4在fn3里面,代码不仅繁琐,还不利于阅读和扩展,这就是回调地狱。...Web应用开发http模块搭建一个最简单的http服务,Node.js内置的http模块const http = require('http')http.createServer((req,res)=
后续就可以直接通过npm run build或者npm run watch来编译了。...中集成ESLint配置 为了开发方便我们可以在 VSCode 中集成 ESLint 的配置,一是用于实时提示,二是可以在保存时自动 fix。...vscode-demo 1.安装 VSCode 的 ESLint 插件。...//指定vscode的eslint所处理的文件的后缀 "extensions": [ ".js", // ".vue",...上述代码中的path_1实际是{default:module.exports},因此path_1.default指向的是原 path 模块,可以看出转换是正常的。
处理模块 一些重要的创新涉及模块。其中,开发人员长期以来一直要求的功能是动态导入。但是,让我们按顺序进行详细介绍。...加载模块后,click事件处理程序将使用loadList()模块导出的功能。请注意如何通过字符串插值指定要导入的模块。 导入元数据 该import.meta对象提供当前模块的元数据。...在每次迭代时,该exec()方法都会在输入字符串上运行,并且您将获得如下结果: ["page 1", "1", index: 5, input: "text page 1 text text page...如果至少一个诺言被拒绝,则返回的诺言被拒绝。最终承诺的拒绝原因与第一个拒绝的承诺相同。 当至少一个承诺被拒绝时,这种行为无法为您提供直接获得所有承诺结果的方法。...const errors = results .filter(p => p.status === 'rejected') .map(p => p.reason); 特别是,此代码使您知道每个被拒绝的承诺失败的原因
1....汉化 4. code-translate 悬浮翻译插件 5.JavaScript (ES6) code snippets 该扩展包含十几个代码片段,可以使用它们来生成ES6代码片段 6. npm Intellisense...npm 装包后,require 时的包智能提示,import 语句中自动填充 npm 模块。...vscode 官方钦定 Vue 插件,Vue开发者必备 8.Path Intellisense 插件自动提示文件路径,支持各种文件无脑快速引入,非常方便。 9....ES7 React/Redux/GraphQL/React-Native snippets React/Redux/Reatc Native/react-router 语法智能提示,React 开发者必备
VSCode React Refactor 这是一个专门为 React 开发人员设计的 VS Code 扩展。在处理大型项目时,重构可能很有挑战性。...React Native Tools React Native Tools 扩展由 Microsoft 团队构建,它为 React Native 项目提供了一个开发环境。...npm Intellisense 该插件为 import 语句中的 npm 模块提供了自动完成功能。npm 模块的所有导入都会使用此扩展自动处理。...它通过 CSS 变量、预处理器变量、hsl/hsla 颜色、跨浏览器颜色、exa、rgb、rgba和argb的彩色背景将 CSS 颜色可视化,帮助开发者快速区分颜色。...你还知道哪些好用的 VSCode 插件,欢迎在评论区留言~ ---- 最后,欢迎学编程的朋友们加入鱼皮的 编程知识星球 ,鱼皮会 1 对 1 解决你的问题,直播带你做出项目、为你定制学习计划和求职指导
领取专属 10元无门槛券
手把手带您无忧上云