vuejs3 - “新功能”中的 VUE3 CSP 问题

Question

我正在将 vue 3.1.5 和 vue cli 4.5.0 用于 chrome 扩展等特殊应用程序并收到以下错误

“拒绝将字符串评估为 JavaScript，因为 'unsafe-eval' 不是以下内容安全策略指令中允许的脚本来源：“script-src chrome://resources 'self'”。

在 runtime-core.esm-bundler.js

function compileToFunction(source, options = {}) {
...
   // compile
        const { code } = baseCompile(source, options);
        // evaluate function
        const msg = new Function(return ${code})();
...
}

有没有办法构建与 CSP 兼容的 vue3 应用程序？

我已经尝试过这些选项

• config.resolve.alias.set('vue$', 'vue/dist/vue.esm.js');
• configureWebpack: { devtool: inline-source-map }
• 配置Webpack：{开发工具：假}

还有其他选择还是我错过了什么？

问候， 帕维尔

标签： vuejs3content-security-policy

Answer 1

是的，Vuenew Function用于模板的运行时编译。
如果您不希望'unsafe-eval'在 CSP 中允许，则必须将模板预编译为渲染函数。