vue-i18n的9以上版本中@被用作特殊字符处理,直接用会报错问题

 更新时间:2022年08月24日 09:45:27   作者:清风明月的博客  
这篇文章主要介绍了vue-i18n的9以上版本中@被用作特殊字符处理,直接用会报错问题,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

vue-i18n的9以上版本中@被用作特殊字符处理

vue3项目中使用vue-i18n的9以上的版本实现国际化,使用过程中出现报错:

国际化使用 "validation.regExp.name": "仅允许输入字母、数字与_.@字符"报如下错误

Message compilation error: Invalid linked format
1  |  仅允许输入字母、数字与_.@字符
Message compilation error: Unexpected lexical analysis in token: '字符'
1  |  仅允许输入字母、数字与_.@字符
Message compilation error: Unexpected empty linked key
1  |  仅允许输入字母、数字与_.@字符

报错原因:vue-i18n的9以上的版本中@被用作特殊字符处理,直接用会报错

解决方法

把@改为{'@'}。例如:"validation.regExp.name": "仅允许输入字母、数字与_.{'@'}字符"

vue@2.6.14安装vue-i18n报错

peer vue@“^3.0.0“ from vue-i18n@9.1.9

在vue2环境下,默认安装 npm install vue-i18n 的版本是 vue-i18n@9.1.9,所以报错信息如下:

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: x-touch@0.1.0
npm ERR! Found: vue@2.6.14
npm ERR! node_modules/vue
npm ERR!   vue@"^2.6.11" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer vue@"^3.0.0" from vue-i18n@9.1.9
npm ERR! node_modules/vue-i18n
npm ERR!   vue-i18n@"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!

**peer vue@“^3.0.0” from vue-i18n@9.1.9 ** 这段意思是 版本不匹配

我们可以使用下面命令查看 vue-i18n 所有版本:

npm view vue-i18n versions --json

然后找到合适的版本即可,这里使用的是 5.0.0

npm install vue-i18n@5

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • ElementUI实现el-form表单重置功能按钮

    ElementUI实现el-form表单重置功能按钮

    本文主要介绍了Element使用el-form时,点击重置按钮或者取消按钮时会实现表单重置效果,具有一定的参考价值,感兴趣的可以了解一下
    2021-07-07
  • Vue项目业务逻辑模块介绍

    Vue项目业务逻辑模块介绍

    这篇文章主要介绍了Vue项目业务逻辑,不同的项目有不同的功能,不同的功能需要不同的实现,实现这些核心功能的代码就叫业务逻辑。所以说业务逻辑是指一个实体单元为了向另一个实体单元提供服务,应该具备的规则与流程
    2022-11-11
  • Vue项目部署到IIS后刷新报错404的问题及解决方法

    Vue项目部署到IIS后刷新报错404的问题及解决方法

    这篇文章主要介绍了Vue项目部署到IIS后,刷新报错404,这里需要用到URL重写工具 --URL Rewrite,需要的话需要自己下载安装,本文通过图文并茂的形式给大家介绍的非常详细,需要的朋友可以参考下
    2022-10-10
  • Nuxt.js实现一个SSR的前端博客的示例代码

    Nuxt.js实现一个SSR的前端博客的示例代码

    这篇文章主要介绍了Nuxt.js实现一个SSR的前端博客的示例代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-09-09
  • Vue实现购物车计算总价功能

    Vue实现购物车计算总价功能

    这篇文章主要为大家详细介绍了Vue实现购物车计算总价功能,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-04-04
  • TSX常见简单入门用法之Vue3+Vite

    TSX常见简单入门用法之Vue3+Vite

    Vue3的确可以直接使用tsx开发,唯一需要处理的就是children,而且处理起来还是比较不爽的,下面这篇文章主要给大家介绍了关于TSX常见简单入门用法之Vue3+Vite的相关资料,需要的朋友可以参考下
    2022-08-08
  • Composition API思想封装NProgress示例详解

    Composition API思想封装NProgress示例详解

    这篇文章主要为大家介绍了Composition API思想封装NProgress示例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-08-08
  • vue页面批量引入组件的操作代码

    vue页面批量引入组件的操作代码

    这篇文章主要介绍了vue页面批量引入组件,本文结合示例代码给大家讲解的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2022-12-12
  • 详解axios全局路由拦截的设置方法

    详解axios全局路由拦截的设置方法

    这篇文章主要介绍了axios全局路由拦截的设置方法,axios全局路由代码通常是在构建axios实例注入的,本文通过实例代码介绍的非常详细,需要的朋友可以参考下
    2023-09-09
  • vue使用el-upload实现文件上传的实例代码

    vue使用el-upload实现文件上传的实例代码

    这篇文章主要为大家详细介绍了vue使用el-upload实现文件上传,文中示例代码介绍的非常详细,对大家的学习或工作有一定的帮助,感兴趣的小伙伴们可以参考一下
    2024-01-01

最新评论