鉴于公司有做的国际化需求,对于公司的vue项目,觉得页面还是挺多的。刚开始觉得很简单,就是把vue文件中的中文,替换成变量,提取成一个文件就可以了,谁知道人肉的提取的部分确实太痛苦了,而且容易出错。最开始本想着网上会有现成的完整自动化的解决方案,结果发现没有。于是我只有根据自己的思路,设计了一个方案,造了一个自动化收集的轮子(i18n-vue-cli工具),如下:

后续考虑开源......

config 定制化配置

自带翻译工具

正在找工作中...

基于vue项目一键国际化通用方案: vue-i18n + i18n-vue-cli(命令行工具)的更多相关文章

  1. 如何创建一个基于命令行工具的跨平台的 NuGet 工具包

    命令行可是跨进程通信的一种非常方便的手段呢,只需启动一个进程传入一些参数即可完成一些很复杂的任务.NuGet 为我们提供了一种自动导入 .props 和 .targets 的方法,同时还是一个 .NE ...

  2. 基于Typescript的Vue项目配置国际化

    基于Typescript的Vue项目配置国际化 简介 使用vue-i18n插件对基于Typescript的vue项目配置国际化,切换多种语言, 配合element-ui或者其他UI库 本文以配置中英文 ...

  3. 使用命令行工具npm新创建一个vue项目

    使用vue开发项目的前期工作可以参考前面写的:  Vue环境搭建及node安装过程整理 Vue.js 提供一个官方命令行工具,可用于快速搭建大型单页应用.该工具提供开箱即用的构建工具配置,带来现代化的 ...

  4. 从头创建一个新的vue项目------用npm|yarn下载vue-cli|vue-ui创建vue

    1.下载node或者是nvm node可以直接去node官网下载,http://nodejs.cn/,默认是长期维护的版本 如果想管理node的版本,可以下载nvm.这个是可选的.但是作为一个前端工程 ...

  5. Vue命令行工具vue-cli

    前面的话 Vue.js 提供一个官方命令行工具,可用于快速搭建大型单页应用.该工具提供开箱即用的构建工具配置,带来现代化的前端开发流程.只需几分钟即可创建并启动一个带热重载.保存时静态检查以及可用于生 ...

  6. Vue CLI 是如何实现的 -- 终端命令行工具篇

    Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统,提供了终端命令行工具.零配置脚手架.插件体系.图形化管理界面等.本文暂且只分析项目初始化部分,也就是终端命令行工具的实现. 0. 用法 ...

  7. 基于node和npm的命令行工具——tive-cli

    前端开发过程中经常会用到各种各样的脚手架工具.npm全局工具包等命令行工具,如:Vue脚手架@vue/cli.React脚手架create-react-app.node进程守卫工具pm2.本地静态服务 ...

  8. node命令行工具之实现项目工程自动初始化的标准流程

    一.目的 传统的前端项目初始流程一般是这样: 可以看出,传统的初始化步骤,花费的时间并不少.而且,人工操作的情况下,总有改漏的情况出现.这个缺点有时很致命. 甚至有马大哈,没有更新项目仓库地址,导致提 ...

  9. 轻松学习Ionic (二) 为Android项目集成Crosswalk(更新官方命令行工具)

        现在集成crosswalk不用这么麻烦了!官方的命令行工具已经能让我们一步到位,省去很多工作,只需在cmd中进入项目所在目录(不能有中文目录,还得FQ),执行: ionic browser a ...

随机推荐

  1. wordpress chronus主题 显示文章阅读数

    wordpress chronus主题 显示文章阅读数 第一步:将下面的代码拷贝到文件 /wp-content/themes/chronus/inc/template-tags.php 中 funct ...

  2. yii2 gridview checkbox

    给checkbox(在GridView里的)添加一个value 控制器:$dataProvidermStu->key = "student_no"; view:[ 'clas ...

  3. Collections类

    1:一个类对象之间的比较两种方法 1)实现Comparator<String>类并且从写Comparator类中的compare方法, public class A implements ...

  4. 自学stm32的一些个人经验

    1.首先我们先看看与STM32相关的文档 我们假定大家已经对STM32的书籍或者文档有一定的理解.如不理解,请立即阅读STM32的文档,以获取最基本的知识点. 如果你手上拥有ST官方主推的STM32神 ...

  5. Ultimate Facebook Messenger for Business Guide (Feb 2019)

    Ultimate Facebook Messenger for Business Guide (Updated: Feb 2019) By Iaroslav Kudritskiy November 2 ...

  6. less的使用(好文章)

    好文章链接:30分钟学会less 自己总结一下这篇文章中的几个关键字:变量.混合.函数.嵌套.@import 下面贴上自己照着上面写的一些代码: <template> <div cl ...

  7. 解决配置Windows Update失败问题

    大家都清楚电脑总是需要更新一些补丁,不过,很多系统用户发现更新了补丁之后,开机会出现windows update更新失败的情况,提示“配置Windows Update失败,还原更改,请勿关闭计算机”信 ...

  8. 解决No converter found for return value of type: class java.util.ArrayList

    十一月 02, 2018 7:37:44 下午 org.apache.catalina.core.StandardWrapperValve invoke 严重: Servlet.service() f ...

  9. SQL对照LinQ的基本语句

    查询全表: string sql = "SELECT * FROM UserInfo"; var lamAll = db.UserInfo; var LinAll = from u ...

  10. IP地址子网划分

    广播数据包: 要弄清为何需要划分子网,就需要了解网络传输过程中的广播概念. 经过多年的发展,交换机基本替代集线器,成为网络中主要的端终接入网络的基础设备,这也使得广播包发送数量有明显的减少,但交换机一 ...