Vue & <noscript> 问题

Question

我已经部署了一个 vue 应用程序并从功能的角度按预期工作，但是每当我尝试在浏览器（更准确地说是任何浏览器）中查看渲染页面的源代码时，实际内容是不可见的，并且正文部分以以下内容开头：

<noscript>
  <strong>We're sorry but this site doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>

当我检查单个元素时可以看到源代码。

使用yarn dev和来自yarn build 的dist包进行测试时，结果相同。

vue --version
2.9.6

Vue 更新了以下内容：

yarn global upgrade @vue/cli

不用说，这是一个主要的 SEO 问题。

这是应用程序配置还是 vue 的环境问题？

Answer 1

根据 W3schools.com

“noscript”标签定义了要向在浏览器中禁用脚本或拥有不支持脚本的浏览器的用户显示的替代内容。

“noscript”元素可以在“head”和“body”标签中使用。当在“head”内部使用时，“noscript”元素只能包含“link”、“style”和“meta”元素。

所以我们很容易得出结论，如果任何浏览器不支持或禁用了 javascript，那么我们可以在 <noscript%gt; 中编写一些标签。标签来通知用户这一点。例如“抱歉，您的浏览器不支持 javascript 或已禁用，请启用它。

在 Vue 的上下文中，index.html 中有一个标签，如下所示：

<noscript>
  <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>

只是说，如果您没有看到我们的应用程序在您的浏览器中运行，那么可能您的浏览器不支持 JavaScript。由于整个应用程序是用 Vue 编写的，而 Vue 是用 javascript 编写的。

因此，要么您的浏览器禁用了 javascript，这可能是下划线问题，要么您的浏览器不支持 javascript，这令人难以置信，因为所有现代浏览器都支持它，除非您使用的是旧浏览器。