标签：NPM npm 管理器 模块 Babel js json install babel
04、NPM包管理器
4.1、简介
官方网站：https://www.npmjs.com/ NPM全称Node Package Manager，是Node.js包管理工具，是全球最大的模块生态系统，里面所有的模块都是开源免费的；也是Node.js的包管理工具，相当于java的Maven 。
#在命令提示符输入 npm -v 可查看当前npm版本
4.2、使用npm管理项目
1、创建文件夹npm
2、项目初始化
最后会生成package.json文件
npm init 初始化——得到package.json 内容如下：
{
"name": "npm", // 工程名
"version": "1.0.1", // 版本
"description": "我是一个node工程", // 描述
"main": "index.js", // 入口js
"scripts": { // 运行脚本
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [
"耨肉"
],
"author": "taohy", // 作者
"license": "ISC" // 授权协议
}
package.json类似于maven中的pom.xml文件
可以直接使用npm init -y 省去中间输入的部分，直接生成package.json，可以在这里面改作者名，项目名等
-
快速安装依赖第三方模块？
-
npm install xxx 或者 npm i xxx模块名 比如npm install mysql , npm i redis
-
安装模块放在什么地方？
-
安装的模块会放入项目的node_modules文件夹中
-
安装模块如何使用？
-
新建js文件，require导入模块 (以下语句相当于导包)
const mysql= require("mysql");
-
-
模块和package.json有什么关系？
-
install的包都会在package.json中的dependencies中显示出来
-
package.json中有个依赖： "dependencies": { "jquery": "^3.6.0", "mysql": "^2.18.1", "redis": "^4.1.0", "vue": "^3.2.37" }
-
通过npm install xxx 会记录在package.json这个文件中。记录的作用，就是方便未来复用。 以后如果新建项目，直接把package.json拷贝到新项目中：在package.json所在目录中执行命令 npm install ，会把pacakge.json中的依赖全部执行一遍。这样就可以避免重复下载模块。很方便去集成的第三方模块。为什么不直接拷贝第三方模块？因为，下载的模块依赖过多，文件过大，而且文件比较混乱。拷贝速度慢。
-
-
如果安装模块很慢 怎么办？
-
阿里云npm镜像 官网地址 https://developer.aliyun.com/mirror/NPM
-
在终端输入npm install -g cnpm --registry=https://registry.npm.taobao.org
-
以后就可以用cnpm install xxx 下载包了
-
-
如何运行？
-
cmd窗口运行 node xxx.js ，后缀.js可以省略，停止运行ctrl+c
-
如何下载多个？
-
npm install xxx xxxx，例如npm install jquery vue mysql
-
下载指定的版本号？
-
npm install xxx@版本号，具体的版本号，查看官网，不指定版本号，下载最新的版本
-
如何卸载模块？
-
npm uninstall xxx xxx
-
4.3、修改npm镜像
1、修改npm镜像
-
NPM官方的管理的包都是从 http://npmjs.com下载的，但是这个网站在国内速度很慢。
-
这里推荐使用淘宝 NPM 镜像 http://npm.taobao.org/
-
在终端输入npm install -g cnpm --registry=https://registry.npm.taobao.org
-
以后就可以用cnpm install xxx 下载包了
-
4.4、其他命令
#更新包（更新到最新版本）npm update 包名
#全局更新npm update -g 包名
#卸载包npm uninstall 包名
#全局卸载npm uninstall -g 包名
05、Babel
5.1、简介
ES6的某些高级语法在浏览器环境甚至是Node.js环境中无法执行。
Babel是一个广泛使用的转码器，可以将ES6代码转为ES5代码，从而在现有环境执行执行。
这意味着，你可以现在就用 ES6 编写程序，而不用担心现有环境是否支持。
5.2、安装
安装命令行转码工具
Babel提供babel-cli工具，用于命令行转码。它的安装命令如下：
npm install -g babel-cli 或者cnpm install -g babel-cli
#查看是否安装成功babel --version
npm install -g @babel/cli 和 npm install -g @babel/core
5.3、Babel的使用
1、创建babel文件夹,在目录输入cmd
2、初始化项目
npm init -y
3、创建文件 src/example.js ，下面是一段ES6代码：
//ES6
let name ='taohy';
const title='北京';
let arr=[1,2,3,4,5];
let newarr = arr.map(a=>a*2);
console.log(name);
console.log(title);
console.log(newarr);
运行
4、配置 .babelrc
Babel的配置文件是.babelrc，存放在项目的根目录下，该文件用来设置转码规则和插件，基本格式如下。
{
"presets": [],
"plugins": []
}
presets字段设定转码规则，将es2015规则加入 .babelrc：
// 新建文件 .babelrc
{
"presets":["es2015"],
"plugins":[]
}
5、安装转码器，在项目中安装
cnpm install --save-dev babel-preset-es2015
6、转码
// 在dist下面新增example.js
babel src -d dist
执行完成后，会生成一个list文件夹，里面放置的是转码后的文件（example.js转码后的文件）
5.4、Babel自定义脚本
-
改写package.json
{
"name": "babelpro",
"version": "1.0.0",
"main": "index.js",
"devDependencies": {
"babel-preset-es2015": "^6.24.1"
},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"dev":"babel src -d dist" // 自定义 名字为dev 将src目录下的文件转码到list目录中
},
"keywords": [],
"author": "",
"license": "ISC",
"description": ""
}
-
转码的时候，执行下面代码
npm run dev(上面自定义的名字)
标签：NPM,npm,管理器,模块,Babel,js,json,install,babel 来源： https://www.cnblogs.com/shanzha/p/16585136.html
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。