安装插件

npm install language-packer

插件使用方法（以下以 Vue 使用为例，但不只限于 Vue 使用）

自动挂载 Vue.prototype.$t

import LanguagePacker from 'language-packer/index'

Vue.use(LanguagePacker, { list: [{ name: '中文', code: 'zh' }, { name: '英文', code: 'en' }] })

手动挂载 Vue.prototype.$t

import LanguagePacker from 'language-packer/src/index'

Vue.prototype.$t = LanguagePacker({ list: [{ name: '中文', code: 'zh' }, { name: '英文', code: 'en' }] })

LanguagePacker(options) options 配置说明

• list 语言选择列表，数据结构 [{ name: '中文', code: 'zh' }]
• code 默认语言（list 第一个）
• status 运行状态（false）
• autoKey 自动生成语言 key，采用 crc32 算法生成 （false）
• mark 检索标记（'<$$$-LanguagePacker-$$$>'）
• title 弹框标题（翻译）
• cancelBtnName 弹框取消按钮名称（取消）
• confirmBtnName 弹框确定按钮名称（确定）
• zIndex 弹框、翻译按钮层级（默认 666666）

设置语言

this.$t.setCode('zh')

开启（true）、关闭（false）翻译

this.$t.setStatus(true)

启用插件（以下 webpack 为例，vue-cli 在 configureWebpack 下配置）

const LanguageService = require('language-packer/src/service')

configureWebpack: {
    plugins: [
        new LanguageService()
    ]
}

翻译后不刷新浏览器，添加以下配置（文件变化导致热更刷新浏览器）

vue.config.js 添加配置，ignored 忽略目录（LanguageService 配置的 outDir 目录）

configureWebpack: {
    devServer: {
      watchOptions: {
        ignored: [/src\/language/]
      }
    }
}

注意：LanguagePacker 一般在 main.js 中执行；LanguageService 以插件的方式挂载，两者必须同时使用。