• 我转过几个弯 绕过那个小雨楼
  • 拿着蒲扇摆着衣衫渡着紧箍咒
  • 不问天涯不停留 喝过几壶酒
  • 不过年少白头道义放胸口
  • 倘若明天之后 遥看前尘剑封侯
  • 似那天上神仙无所求
  • 朝朝暮暮君如梦醒十分不为何理由
  • 是真是假是惶恐是无休
  • 路过这风雨花满楼 片刻都不停留
  • 我本这书生进京赶考留下许多愁
  • 你问有没有时候 我叹这天道默悠悠
  • 能否与我一醉方休
  • 又过了几个弯 算尽天量道莫慌
  • 踏这田园闻这芳草香
  • 跌跌撞撞仗剑天涯折煞不枉无笔良
  • 是梦是幻是温柔是家乡
  • 路过这风雨花满楼 片刻都不停留
  • 我本这书生进京赶考留下许多愁
  • 你问有没有时候 我叹这天道默悠悠
  • 能否与我一醉方休
  • 路过这风雨花满楼 片刻都不停留
  • 我本这书生进京赶考留下许多愁
  • 你问有没有时候 我叹这天道默悠悠
  • 能否与我一醉方休
  • 谁能与我一醉方休

moment 语言包按需加载

moment作为一个时间插件,使用的地方是非常广泛的,但是我们使用moment的时候,需要注意下他的语言包。

默认情况下,他的语言包是全加载的,也就是有多少个预设的语言包,就加载多少个。

为此,我们需要对他进行优化

优化前

优化

打开vue.config.js文件

const webpack = require('webpack');
module.exports = {
  //...
  configureWebpack: {
    plugins: [
      // Ignore all locale files of moment.js
      new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
    ],
  },
};

这段代码的含义是使用webpack的方法,屏蔽moment自己所引入的所有语言包。

既然我们屏蔽了所有,所以要使用的时候,需要自己引入对应的语言包

const moment = require('moment');
require('moment/locale/zh-cn');

moment.locale('zh-cn');

不想使用node的require语法,我们可以使用import

import moment from require('moment');
import "moment/locale/zh-cn";

moment.locale('zh-cn');

效果是一样的。

然后我们进行打包,查看效果

优化后

效果非常明显,语言包就剩一个了,不仔细看都看不到,他在右边那个小长方形里面。

0
  • 本文分类:vue 开发实战
  • 本文标签:vuemoment语言包按需加载
  • 流行热度:已超过 164 人围观了本文
  • 最后更新:2020年12月12日 - 23时17分48秒
  • 发布日期:2020年12月12日 - 23时17分48秒
  • 版权申明:本文系作者@木灵鱼儿原创发布在木灵鱼儿 - 有梦就能远航站点。未经许可,禁止转载。

相关文章

微信收款码
微信收款码