当前位置: 首页 > news >正文

前端_005_Nodejs

文章目录

  • npm包管理器
  • cjs和mjs
  • Yarn包管理器

1.Node.js 是js的一个运行环境,从nodejs诞生后js代码不局限于只在浏览器中执行,此外还能再nodejs里写服务端,用js可以前后端全栈开发

2.Node.js不跟浏览器一样默认含有document,window对象,使用时需要引入

npm包管理器

通过package.json文件进行管理前端需要的包,

package-lock.json 会固化当前安装的每个软件包版本,运行npm update会更新该文件

npm分为本地模式和全局模式,一般带-g 都是全局安装

npm常用命令--save 或 -S: 添加到package.json文件的dependencies列表中(默认行为)。--save-dev 或 -D: 添加到package.json文件的devDependencies列表中,表示该包仅用于开发环境。
npm install --save-dev <PACKAGENAME>
--global 或 -g: 全局安装该包,而不是安装在当前项目中。@<版本号>: 安装指定版本的包。
npm install <package-name>@<version>npm init  //初始化
npm install //安装模块
npm run //执行脚本
npm uninsall //卸载模块
npm update //更新模块
npm ls //查看已安装包
npm run <task-name> //执行脚本任务
npm cache clean //清理npm缓存
npm get registry //获得当前使用镜像源
npm config set registry https://registry.npmjs.org/ //修改镜像源
npm root -g //查看全局安装路径

package.json常用属性

{"name": "test-project","version": "1.0.0","description": "A Vue.js project","main": "src/main.js","private": true,"scripts": {"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js","start": "npm run dev","unit": "jest --config test/unit/jest.conf.js --coverage","test": "npm run unit","lint": "eslint --ext .js,.vue src test/unit","build": "node build/build.js"},"dependencies": {"vue": "^2.5.2"},"devDependencies": {"autoprefixer": "^7.1.2","babel-core": "^6.22.1","babel-eslint": "^8.2.1","babel-helper-vue-jsx-merge-props": "^2.0.3","babel-jest": "^21.0.2","babel-loader": "^7.1.1","babel-plugin-dynamic-import-node": "^1.2.0","babel-plugin-syntax-jsx": "^6.18.0","babel-plugin-transform-es2015-modules-commonjs": "^6.26.0","babel-plugin-transform-runtime": "^6.22.0","babel-plugin-transform-vue-jsx": "^3.5.0","babel-preset-env": "^1.3.2","babel-preset-stage-2": "^6.22.0","chalk": "^2.0.1","copy-webpack-plugin": "^4.0.1","css-loader": "^0.28.0","eslint": "^4.15.0","eslint-config-airbnb-base": "^11.3.0","eslint-friendly-formatter": "^3.0.0","eslint-import-resolver-webpack": "^0.8.3","eslint-loader": "^1.7.1","eslint-plugin-import": "^2.7.0","eslint-plugin-vue": "^4.0.0","extract-text-webpack-plugin": "^3.0.0","file-loader": "^1.1.4","friendly-errors-webpack-plugin": "^1.6.1","html-webpack-plugin": "^2.30.1","jest": "^22.0.4","jest-serializer-vue": "^0.3.0","node-notifier": "^5.1.2","optimize-css-assets-webpack-plugin": "^3.2.0","ora": "^1.2.0","portfinder": "^1.0.13","postcss-import": "^11.0.0","postcss-loader": "^2.0.8","postcss-url": "^7.2.1","rimraf": "^2.6.0","semver": "^5.3.0","shelljs": "^0.7.6","uglifyjs-webpack-plugin": "^1.1.1","url-loader": "^0.5.8","vue-jest": "^1.0.2","vue-loader": "^13.3.0","vue-style-loader": "^3.0.1","vue-template-compiler": "^2.5.2","webpack": "^3.6.0","webpack-bundle-analyzer": "^2.9.0","webpack-dev-server": "^2.9.1","webpack-merge": "^4.1.0"},"engines": {"node": ">= 6.0.0","npm": ">= 3.0.0"},"browserslist": ["> 1%", "last 2 versions", "not ie <= 8"]
}

cjs和mjs

1.mjs是ECMA module,加载ES相关模块, 使用import和export,这个是ES6标准

cjs是node.js独有的模块,commonjs,使用require()加载和module.exports输出

require()是同步加载,后面的代码必须等待这个命令执行完,才会执行。import命令则是异步加载

2.Node.js 遇到.mjs文件,就认为它是 ES6 模块,默认启用严格模式,默认是加载commonjs

.mjs文件总是以 ES6 模块加载,.cjs文件总是以 CommonJS 模块加载,.js文件的加载取决于package.json里面type字段的设置。 {type:“module”}

3.网页中引入使用module 的js 可以指定script 其type 为modules

Ps:
Es模块只能通过http 协议工作,不支持file:// 本地打开文件 所以只能通过搭建服务器的方式打开使用Es 模块的网页

另外不要尝试用vs code里liveserver 插件尝试使用import 或者require 方式,这个插件起的服务器是找不到这种方式引入的模块


其他nodejs提供许多后端语言支持的特性,如文件操作,异步…等等 这个用到时查找官方手册即可

node.js手册

ackage.json里面type`字段的设置。 {type:“module”}

Yarn包管理器

yarn.lock 锁定依赖包版本

yarn init
yarn install
yarn add [package]
yarn add [package]@[version]
yarn add [package]@[tag]
yarn add [package] --dev  # dev dependencies
yarn add [package] --peer # peer dependencies
yarn up [package]
yarn up [package]@[version]
yarn up [package]@[tag]
yarn remove [package]
yarn config set <name> <value>
yarn config set registry
``

相关文章:

前端_005_Nodejs

文章目录 npm包管理器cjs和mjsYarn包管理器 1.Node.js 是js的一个运行环境&#xff0c;从nodejs诞生后js代码不局限于只在浏览器中执行&#xff0c;此外还能再nodejs里写服务端&#xff0c;用js可以前后端全栈开发 2.Node.js不跟浏览器一样默认含有document,window对象&#xf…...

SpringCache缓存介绍

1.为什么需要缓存 ​ 前台请求&#xff0c;后台先从缓存中取数据&#xff0c;取到直接返回结果&#xff0c;取不到时从数据库中取&#xff0c;数据库取到更新缓存&#xff0c;并返回结果&#xff0c;数据库也没取到&#xff0c;那直接返回空结果&#xff1a; 使用缓存是一个很…...

python实战(一)——iris鸢尾花数据集分类

一、任务背景 本文是python实战系列专栏的第一篇文章&#xff0c;我们将从分类开始由浅入深逐步学习如何使用python完成常规的机器学习/深度学习任务。iris数据集是经典的机器学习入门数据集&#xff0c;许多分类任务教程都会以这个数据集作为示例&#xff0c;它的数据量是150条…...

k8s-对命名空间资源配额

对k8s命名空间限制的方法有很多种&#xff0c;今天来演示一下很常用的一种 用的k8s对象就是ResourceQuota 一&#xff1a;创建命名空间 kubectl create ns test #namespace命名空间可以简写成ns 二&#xff1a; 对命名空间进行限制 创建resourcequota vim resourcequ…...

Failed to connect to github.com port 443

git push无法连接443端口 **问题1****方法一&#xff1a;取消代理设置**git命令 其他解决方案1. **设置 Git 使用 HTTP 而不是 HTTPS**2. **检查证书**3. **配置 Git 忽略 SSL 验证&#xff08;不推荐&#xff09;**4. **检查代理设置** 问题1 Failed to connect to github.com…...

【设计模式系列】简单工厂模式

一、什么是简单工厂模式 简单工厂模式&#xff08;Simple Factory Pattern&#xff09;是一种设计模式&#xff0c;其中包含一个工厂类&#xff0c;根据传入的参数不同&#xff0c;返回不同类的实例。这个工厂类封装了对象的创建逻辑&#xff0c;使得客户端代码可以从直接创建…...

给定一个正整数n随机生成n个字节即生成2n个十六进制数将其组成字符串返回secrets.token_hex(n)

【小白从小学Python、C、Java】 【考研初试复试毕业设计】 【Python基础AI数据分析】 给定一个正整数n 随机生成n个字节 即生成2n个十六进制数 将其组成字符串返回 secrets.token_hex(n) [太阳]选择题 根据题目代码&#xff0c;执行的结果错误的是&#xff1f; import secrets …...

[Gtk] 工程

MediaPlayer 可执行文件工程 结构 . ├── BUILD ├── ButtonHelper.cpp ├── ButtonHelper.h ├── CMakeLists.txt ├── DrawingAreaHelper.cpp ├── DrawingAreaHelper.h ├── layout.ui └── main.cpp CMakeLists.txt # 1) cmake basic cmake_minimum_r…...

基于Multisim的汽车尾灯控制电路设计与仿真

假设汽车尾部左右量测各有3个指示灯&#xff08;用发光二极管模拟&#xff09;1. 汽车正常运行时指示灯全灭&#xff1b;2.右转弯时&#xff0c;右侧3个指示灯按右循环顺序点亮&#xff1b;.3. 左转弯时&#xff0c;左侧3个指示灯按左循环顺序点亮&#xff1b;4.临时刹车时所有…...

Leetcode 3326. Minimum Division Operations to Make Array Non Decreasing

Leetcode 3326. Minimum Division Operations to Make Array Non Decreasing 1. 解题思路2. 代码实现 题目链接&#xff1a;3326. Minimum Division Operations to Make Array Non Decreasing 1. 解题思路 这一题的话就是要看出来题中给出的operation的本质事实上就是将任意…...

redo文件误删除后通过逻辑备份进行恢复

问题描述 开发同事让在一个服务器上查找下先前库的备份文件是否存在&#xff0c;如果存在进行下恢复。翻了服务器发现备份文件存在&#xff0c;多愁了一眼竟翻到了该备份文件于2024.6.17日恢复过的日志&#xff0c;赶紧和开发沟通说2024.6.17号已经恢复过了为啥还要恢复&#x…...

7805的输出电压如何调整?

7805稳压集成电路的输出电压通常是固定的&#xff0c;标称为5V。然而&#xff0c;在实际应用中&#xff0c;可以通过一些方法调整其输出电压&#xff0c;尽管这些调整方法可能会使电路变得更加复杂或需要额外的元件。以下是几种可能的调整方法&#xff1a; 1. 使用不同型号的稳…...

git命令使用一览【自用】

git常见操作&#xff1a; git initgit remote add master【分支名字】 gitgits.xxxxx【仓库中获取的ssh链接或者http协议的链接】检查远程仓库是否链接成功。 git remote -v出现以下画面就可以git pull,git push了...

MES系列-报表和分析

MES系列-报表和分析 MES系列文章目录 ISA-95制造业中企业和控制系统的集成的国际标准-(1) ISA-95制造业中企业和控制系统的集成的国际标准-(2) ISA-95制造业中企业和控制系统的集成的国际标准-(3) ISA-95制造业中企业和控制系统的集成的国际标准-(4) ISA-95制造业中企业和控制…...

如何在分布式环境中实现高可靠性分布式锁

目录 一、简单了解分布式锁 &#xff08;一&#xff09;分布式锁&#xff1a;应对分布式环境的同步挑战 &#xff08;二&#xff09;分布式锁的实现方式 &#xff08;三&#xff09;分布式锁的使用场景 &#xff08;四&#xff09;分布式锁需满足的特点 二、Redis 实现分…...

Vue基础(4)

自定义指令 除了默认设置的核心指令( v-model 和 v-show ), Vue 也允许注册自定义指令。在vue中使用directive来创建自定义指令 钩子函数 指令定义函数提供了几个钩子函数&#xff08;可选&#xff09;&#xff1a; bind: 只调用一次&#xff0c;指令第一次绑定到元素时调用&…...

Redis高阶篇之Redis单线程与多线程

文章目录 0 前言1. 为什么Redis是单线程&#xff1f;1.1 Redis单线程1.2 为什么Redis3时代单线程快的原因1.3 使用单线程原因 2.为什么逐渐加入多线程呢&#xff1f;2.1 如何解决 3.redis6/7的多线程特性和IO多路复用入门3.1主线程和IO线程怎么协作完成请求处理的3.2 Unix网络编…...

【C++】STL——priority_queue优先级队列

目录 前言priority_queue的使用简单使用在OJ中的使用 priority_queue的模拟实现基本功能仿函数在这里插入图片描述 前言 上一节我们说了stack和queue这两种容器适配器&#xff0c;而priority_queue&#xff08;优先级队列&#xff09;同样也是属于容器适配器&#xff0c;它会优…...

大数据新视界 --大数据大厂之大数据在智慧城市建设中的应用:打造智能生活的基石

&#x1f496;&#x1f496;&#x1f496;亲爱的朋友们&#xff0c;热烈欢迎你们来到 青云交的博客&#xff01;能与你们在此邂逅&#xff0c;我满心欢喜&#xff0c;深感无比荣幸。在这个瞬息万变的时代&#xff0c;我们每个人都在苦苦追寻一处能让心灵安然栖息的港湾。而 我的…...

使用枚举来实现策略模式

使用很多if else的场景 public void save(String type,Object data){if("db".equals(type)){saveInDb(data);}else if("file".equals(type)){saveInFile(data);}else if("oss".equals(type)){saveInOss(data);}}使用枚举来解决 public enum Save…...

HTML 列表、表格、表单

1 列表标签 作用&#xff1a;布局内容排列整齐的区域 列表分类&#xff1a;无序列表、有序列表、定义列表。 例如&#xff1a; 1.1 无序列表 标签&#xff1a;ul 嵌套 li&#xff0c;ul是无序列表&#xff0c;li是列表条目。 注意事项&#xff1a; ul 标签里面只能包裹 li…...

【机器视觉】单目测距——运动结构恢复

ps&#xff1a;图是随便找的&#xff0c;为了凑个封面 前言 在前面对光流法进行进一步改进&#xff0c;希望将2D光流推广至3D场景流时&#xff0c;发现2D转3D过程中存在尺度歧义问题&#xff0c;需要补全摄像头拍摄图像中缺失的深度信息&#xff0c;否则解空间不收敛&#xf…...

什么是库存周转?如何用进销存系统提高库存周转率?

你可能听说过这样一句话&#xff1a; “利润不是赚出来的&#xff0c;是管出来的。” 尤其是在制造业、批发零售、电商这类“货堆成山”的行业&#xff0c;很多企业看着销售不错&#xff0c;账上却没钱、利润也不见了&#xff0c;一翻库存才发现&#xff1a; 一堆卖不动的旧货…...

ETLCloud可能遇到的问题有哪些?常见坑位解析

数据集成平台ETLCloud&#xff0c;主要用于支持数据的抽取&#xff08;Extract&#xff09;、转换&#xff08;Transform&#xff09;和加载&#xff08;Load&#xff09;过程。提供了一个简洁直观的界面&#xff0c;以便用户可以在不同的数据源之间轻松地进行数据迁移和转换。…...

Redis数据倾斜问题解决

Redis 数据倾斜问题解析与解决方案 什么是 Redis 数据倾斜 Redis 数据倾斜指的是在 Redis 集群中&#xff0c;部分节点存储的数据量或访问量远高于其他节点&#xff0c;导致这些节点负载过高&#xff0c;影响整体性能。 数据倾斜的主要表现 部分节点内存使用率远高于其他节…...

蓝桥杯3498 01串的熵

问题描述 对于一个长度为 23333333的 01 串, 如果其信息熵为 11625907.5798&#xff0c; 且 0 出现次数比 1 少, 那么这个 01 串中 0 出现了多少次? #include<iostream> #include<cmath> using namespace std;int n 23333333;int main() {//枚举 0 出现的次数//因…...

Angular微前端架构:Module Federation + ngx-build-plus (Webpack)

以下是一个完整的 Angular 微前端示例&#xff0c;其中使用的是 Module Federation 和 npx-build-plus 实现了主应用&#xff08;Shell&#xff09;与子应用&#xff08;Remote&#xff09;的集成。 &#x1f6e0;️ 项目结构 angular-mf/ ├── shell-app/ # 主应用&…...

Java毕业设计:WML信息查询与后端信息发布系统开发

JAVAWML信息查询与后端信息发布系统实现 一、系统概述 本系统基于Java和WML(无线标记语言)技术开发&#xff0c;实现了移动设备上的信息查询与后端信息发布功能。系统采用B/S架构&#xff0c;服务器端使用Java Servlet处理请求&#xff0c;数据库采用MySQL存储信息&#xff0…...

阿里云Ubuntu 22.04 64位搭建Flask流程(亲测)

cd /home 进入home盘 安装虚拟环境&#xff1a; 1、安装virtualenv pip install virtualenv 2.创建新的虚拟环境&#xff1a; virtualenv myenv 3、激活虚拟环境&#xff08;激活环境可以在当前环境下安装包&#xff09; source myenv/bin/activate 此时&#xff0c;终端…...

绕过 Xcode?使用 Appuploader和主流工具实现 iOS 上架自动化

iOS 应用的发布流程一直是开发链路中最“苹果味”的环节&#xff1a;强依赖 Xcode、必须使用 macOS、各种证书和描述文件配置……对很多跨平台开发者来说&#xff0c;这一套流程并不友好。 特别是当你的项目主要在 Windows 或 Linux 下开发&#xff08;例如 Flutter、React Na…...