Vue SPA - 如何在浏览器中呈现时隐藏 .vue 文件

Question

我正在开发一个用 Vue.js 开发的单页应用程序，托管在 Node.js 服务器上。

目前它仍在开发中，但最终将暴露给外部客户，并且由于我们将处理敏感数据，我们希望避免在用户检查元素时看到 .vue 文件和相对文件树结构在开发工具中。

请参阅随附的屏幕截图作为示例，其中显示了我想要隐藏的文件。

有办法实现吗？

Answer 1

通过使用配置文件，我能够使 webpack 将 SPA 导出到捆绑包中。

在文件中./config/index.js我更改了以下标志：

build: {
    // other code...

    devtool: '',  // Previously it was set as '#source-map'
    productionSourceMap: false, // Previously it was set as true
    cssSourceMap: false, // Previously set as true

    // other code...
}

我通过阅读 webpack 文档找到了解决方案，其中解释了设置的作用： https: //webpack.js.org/configuration/devtool/#product

感谢大家让我走上正确的方向。