自vue-i18n@v9.0,用消息编译器处理locale消息,编译后将它们转换为javascript函数。在编译后,消息编译器将它们转换为javascript函数,这可以提高应用程序的性能。

然而,使用消息编译器,在某些环境下(如CSP),javascript函数的转换将不起作用。由于这个原因,vue-i18n@v9.0 及以后的版本提供了一个包括编译器和运行时的完整版本,以及一个只包括运行时的版本。

使用 vite 插件 vite-plugin-vue-i18n 处理这个问题

npm i --save-dev @intlify/vite-plugin-vue-i18n

vite.config.ts

import vueI18n from '@intlify/vite-plugin-vue-i18n'

export default defineConfig({
plugins: [
vue(),
vueI18n({
// you need to set i18n resource including paths !
include: path.resolve(__dirname, './path/to/src/locales/**')
})
]
})

参考资料:

vite vue i18n Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source的更多相关文章

  1. Element + Vue I18n动态import加载国际化语言包翻译文件

    需求 项目为多页应用,包含产品a.b.c.d.e,每个产品都有自己的翻译文件.一次加载所有翻译文件是极度不合理的.于是考虑动态加载. 实现 参考官方文档:延迟加载翻译 项目结构 │ ├── dist ...

  2. Vue, React, AngularJS, and Angular2. 我们对流行JavaScript框架们的选择

    2017-08-04 前端大全 (点击上方公众号,可快速关注) 英文:ANTONI ZOLCIAK  译文:众成翻译 www.zcfy.cc/article/vue-react-angularjs-a ...

  3. Vue I18n Vue.js 的国际化插件+elementUI的使用

    先附上插件官网 vue-i18n中文官网 我们的vue项目需要支持多语言时,可以使用这个插件 安装插件教程在官网可以找到 代码结构可以如下 zh.js 查看代码 export default { lo ...

  4. vite vue插件打包配置

    import { defineConfig, UserConfigExport, ConfigEnv } from "vite"; import externalGlobals f ...

  5. vite + vue安装 注意事项

    一.要求node版本必须>12.0.0 1.node 如何升级 · 执行npm cache clean -f 清除缓冲 · npm install -g n 安装 n 模块  n模块用于管理 n ...

  6. vite vue使用Markdown

    下载插件: npm i vite-plugin-md highlight.js github-markdown-css 配置插件: import Markdown from 'vite-plugin- ...

  7. How to get the query string by javascript?

    http://techfunda.com/Tools/XmlToJson http://beautifytools.com/xml-to-json-converter.php https://www. ...

  8. 006——VUE中的内容与属性中使用javascript表达式的方法

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. 记录MindSphere On Cloud Foundry的一次尝试过程

    试验背景: 开始时间:2019年12月11日 结束时间:2019年12月13日 自己编写一个后台程序,尝试推送到Cloud Foundry上,并开放从MindSphere以外访问的权限. 程序实现以下 ...

  10. GitHub页面布局乱了,怎么解决??

    GitHub页面布局乱了,怎么解决?? GitHub乱了,怎么解决?? 一年一度的布局又乱了!!! F12一下下面有东西加载不了,,,, Refused to evaluate a string as ...

随机推荐

  1. 快速查看kafka消息内容(支持指定group)

    下载开源的 kafka 界面客户端 KafkaKing:https://github.com/Bronya0/Kafka-King 在成功下载该客户端后,进行连接操作.连接完毕后,切换到 consum ...

  2. C++ 11之std::bind用法

    #include <iostream> #include <functional> #include <stdio.h> int funcA( int a, int ...

  3. 「Trick」常见错误

    爆 int 了吗? 爆 long long 了吗? 进行 \(\bmod\) 时有爆掉或负数吗? 数组开大了吗?(\(N,M\) 用反了?) 变量重名了吗? 赋初值了吗? 不要在 printf 或者 ...

  4. linux搭建natapp内网穿透服务器

    参考教程:window版本 https://www.jianshu.com/p/8897106c8d3dlinux版本 https://natapp.cn/article/natapp_newbie相 ...

  5. 袋鼠云数栈UI5.0焕新升级,全新设计语言DT Design,更懂视觉更懂你!

    数栈作为袋鼠云打造的一站式数据开发与治理平台,从2016年发布第⼀个版本开始,就始终坚持着以技术为核⼼.安全为底线.提效为⽬标.中台为战略的思想,坚定不移地⾛国产化信创路线,不断推进产品功能迭代.技术 ...

  6. 5分钟搞定!最全Dokploy部署n8n教程

    最近n8n太火了,官方的次数有限,很多人有自己部署的需求.但常规的部署方案总是耗时耗力,拖慢整个开发节奏. 今天我分享一个我自己实践总结的Dokploy部署n8n的超详细教程,帮助你在短短几分钟内完成 ...

  7. Nginx 本地代理转发请求 502 Bad Gateway

    问题 在使用 yum 安装 nginx 后可能会出现配置完成后却无法访问的问题,查看 audit.log 会发现类似于以下的错误信息 原因 出现此问题的原因是 SELinux 基于最小权限原则默认拦截 ...

  8. 如何让外汇WebSocket连接不断线?

    在量化交易系统或行情订阅程序中,WebSocket 是实现实时行情获取的关键通道.但在实际部署中,我们经常会遇到一个头痛的问题:WebSocket连接在运行一段时间后断开了,而我们的策略还以为数据一直 ...

  9. Windows 的桌面图标没有显示正确

    Windows系统会缓存桌面图标,如果缓存文件损坏,可能会导致图标不显示.我们可以通过以下步骤重建图标缓存: 打开"任务管理器",结束"Windows资源管理器" ...

  10. vue2和vue3插件的区别

    弹窗组件 这个vue2和vue3是一样的 <template> <div v-if="active" class="alert"> &l ...