ES6初始化与模块化实践-优快云博客

本文链接：https://blog.youkuaiyun.com/m0_65214572/article/details/126999184

本文介绍了ES6项目的初始化，包括使用npm快速初始化项目，安装及配置Babel以将ES6转换为ES5。接着讲解了模块化的概念，如CommonJS与ES6模块化，以及包管理工具NPM的相关知识，包括如何设置镜像源以优化包的下载速度。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

bacel

初始化项目

npm init

npm init -y

安装转码工具

cnpm install -g babel-cli

cnpm install --save -dev babel-cli babel-preset-latest

安装转换规则

cnpm install -g babel-preset-latest

指定转换规则新建.balelrc

{

"presets":["lastest"]

}

cnpm install --save-dev babel-cli babel-preset-latest

babel工具在项目中是在开发阶段使用的工具

jquery工具在项目中是在产品阶段使用的工具

也可以将ES6转换为ES5之后的文件输入到另一个文件当中

模块化

模块化机制（commonjs与es6）

包管理机制（npm、cnpm、yarn）

NPM是Javascript开发者能够更方便的分享和复用以及更新代码的工具，被复用的代码被称为包或者模块，一个模块中包含了一到多个js文件。在模块中一般还会包含一个package.json的文件，该文件中包含了该模块的配置信息。该文件是个json文件，其配置信息如下：

name 模块名称

version 模块版本

description 描述信息

main 指定模块入口文件

type 当type值为module的时候，支持es模块化

scripts 脚本，使用' npm run 脚本名'可以调用

dependencies 依赖关系

devDependencies 环境依赖或测试依赖

cnpm 更新

npm config set registry https://registry.npmmirror.com/

npm install -g cnpm --registry=https://registry.npmmirror.com

// 项目中配置映射修改规则

npm.taobao.org => npmmirror.com

registry.npm.taobao.org => registry.npmmirror.com

\# 旧

npm config set registry http://registry.npm.taobao.org/

\# 新

npm config set registry https://registry.npmmirror.com/

\# 旧

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

\# 新

npm install -g cnpm --registry=https://registry.npmmirror.com

\# 旧

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

\# 新

npm install -g yarn --registry=https://registry.npmmirror.com