简介
在前端开发中使用 moment.js 库进行日期格式化时，由于该库支持全球多种语言的时间格式，且支持按需加载，因此开发者可以根据需要选择加载对应语言包减小包体积。但是，在使用 webpack 打包时会遇到一个问题：所有的语言包都会被打包进去，即使你并没有使用到。
build-plugin-moment-locales 是一个 webpack 插件，可以在打包时只打包需要的 moment.js 语言包，减小包体积。
安装
首先需要在项目中安装 moment.js 和 webpack 插件 build-plugin-moment-locales：
--- ------- ------ --------------------------- ----------
使用
- 在 webpack.config.js 中引入插件：
----- ------------------------ - ---------------------------------------
-------------- - -
-- ---
-------- -
-- ---
--- --------------------------
-------- ------ ---------
---
--
-- ---
-- 修改代码中的引入 moment.js 方式，更改为按需加载：
------ ------ ---- --------- ------ ---------------------- -----------------------
这样，就只会打包需要的语言包，减小了包体积。
意义
- 减小包体积，提高应用启动速度和加载速度。
- 更好的国际化支持，避免将不需要的语言包打包到应用中。
- 提升前端性能，减少无用代码对渲染性能的影响。
示例代码
-- -----------------
----- ------------------------ - ---------------------------------------
-------------- - -
-- ---
-------- -
-- ---
--- --------------------------
-------- ------ ---------
---
--
-- ---
-
-- --------
------ ------ ---- ---------
------ ----------------------
-----------------------进一步扩展
在上述示例中，我们只选择了两个语言包。如果你需要支持更多的语言包，只需要在配置中增加即可：
-- -----------------
----- ------------------------ - ---------------------------------------
-------------- - -
-- ---
-------- -
-- ---
--- --------------------------
-------- ------ -------- ----- ----- ----- ----- ----- ------
---
--
-- ---
-
-- --------
------ ------ ---- ---------
------ ----------------------
------ -------------------
------ -------------------
------ -------------------
------ -------------------
------ -------------------
------ -------------------
-----------------------同时，为了方便配置，我们还可以将 locales 数组单独抽离出来，通过 require 的方式引入：
-- -----------------
----- ------------------------ - ---------------------------------------
----- ------- - ---------------------
-------------- - -
-- ---
-------- -
-- ---
--- --------------------------
--------
---
--
-- ---
-
-- ----------
-------------- - ------ -------- ----- ----- ----- ----- ----- ------
-- --------
------ ------ ---- ---------
------ ------- ---- ------------
------------------------ -- -
----------------------------------
---
-----------------------这样，可以更加方便地扩展和维护多语言包的支持。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/build-the-plugin-moment-locales