sof*_*ode 10 javascript vue.js
我有一些需要在各种页面上加载的EXTERNAL脚本,例如Google Places Autocomplete,Facebook API等.
显然,在每条路径上加载它们是没有意义的,但是文档并没有解决这种相当常见的情况.
此外,Vue实例安装在正文中的标记上,因为
在所有情况下,已安装的元素将替换为Vue生成的DOM.因此,建议不要将根实例挂载到<html>或<body>.
现实世界的应用程序目前如何应对这种情况？
我建议使用https://www.npmjs.com/package/vue-head，它的设计目的是将您想要的组件中的数据注入到文档的头部。非常适合 SEO 标题和元标签。
像这样使用：
export default {
data: () => ({
title: 'My Title'
}),
head: {
// creates a title tag in header.
title () {
return {
inner: this.title
}
},
meta: [
// creates a meta description tag in header.
{ name: 'description', content: 'My description' }
]
}
}
这在文档中没有解决，因为这不是 Vue 的工作。Vue 旨在创建单页应用程序（SPA）等。在单页应用程序中，您通常会在第一次加载站点时加载所有供应商脚本（Google、Facebook 等）以及您自己的脚本和样式。
许多现实世界的应用程序只是使用 Webpack、Gulp、Grunt 或其他一些捆绑工具将所有供应商脚本捆绑到一个文件中（例如：vendor.js）。基本原理是您可以将所有这些脚本打包到一个文件中，缩小它们，使用 gzip 压缩为它们提供服务，然后它只是一个请求。
如果你正在使用require()或import导入你的模块，像 Webpack 和 Browserify 这样更智能的打包器可以遍历依赖树。这可以允许您将依赖项拆分为几个逻辑块，以便组件和库仅在加载它们本身时加载它们的依赖项。
| 归档时间： |
|
| 查看次数： |
5800 次 |
| 最近记录： |