学做网站网,wordpress 食谱网站,12345东莞网站,最新网页游戏排行榜2021文章目录 npm包管理器cjs和mjsYarn包管理器 1.Node.js 是js的一个运行环境#xff0c;从nodejs诞生后js代码不局限于只在浏览器中执行#xff0c;此外还能再nodejs里写服务端#xff0c;用js可以前后端全栈开发 2.Node.js不跟浏览器一样默认含有document,window对象#xf… 文章目录 npm包管理器cjs和mjsYarn包管理器 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-nameversionnpm 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
