Vue 2 Cli CSP构建问题- Eval &新功能问题

Question

由于CSP需求，我不得不在vue 2 CLI环境中转换静态Vue应用程序。

在阅读了大量在线文档之后，我意识到对于符合CSP的vue，您需要使用呈现函数和运行时版本的Vue.js。

我的问题是，在将我的旧静态vue应用程序转换为Vue CLI构建过程后，我仍然得到一个‘不安全-eval’是不允许的消息。我不知道为什么会这样，因为Vue 2的cli构建过程显然使用了CSP兼容的运行时vue版本，除非webpack的配置文件中另有规定。

导致CSP错误的特定代码(只有一个实例)可以在构建/输出vendor.js文件中找到。造成此问题的代码是：

function Ts(t, e) {
        try {
            return new Function(t)
        } catch (n) {
            return e.push({
                err: n,
                code: t
            }), D
        }
    }

我看了很远很远，想弄清楚为什么这个非CSP兼容的代码出现在Vue的构建的vendor.js文件中。任何建议都会很好。我已经阅读了Vue关于CSP的所有主要文档，并且应该重复使用Vue 2 CLI来构建和转换静态应用程序。

Answer 1

对于任何其他已经从Vue.js静态转换到非编译CSP转换的兔子洞的可怜灵魂来说，这两个步骤解决了我的问题：

1. 手动将csp\build\webpack.base.conf.js '$vue‘属性更改为：

单击以查看图像

1. 在您的main.js文件中，将vue实例化为以下模式，这是必需的，以便组件将与运行时构建单击以查看图像正确地挂载。