是否可以只在需要的地方而不是在 nuxtjs 的 nuxt.config.js 中实现包含脚本
Is it possible to implement include a script only where it is needed rather than in nuxt.config.js in nuxtjs
我正在使用 Razorpay 进行支付服务。除了结账页面,没有其他页面使用它。我已将其包含在 nuxt.config.js 文件中。在 nuxtjs 中是否可以仅在您可能需要的地方使用脚本?不在所有页面中。 (我的灯塔分数因此而下降)
是的,这是可能的。您可以使用 Local Settings 将您的资源包含在 pages/
目录内的 .vue
文件中(此处在 head 函数中):
<template>
<h1>About page with jQuery and Roboto font</h1>
</template>
<script>
export default {
head () {
return {
script: [
{ src: 'https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js' }
],
link: [
{ rel: 'stylesheet', href: 'https://fonts.googleapis.com/css?family=Roboto&display=swap' }
]
}
}
}
</script>
<style scoped>
h1 {
font-family: Roboto, sans-serif;
}
</style>
这里,这个jQuery
js文件和Roboto font
css只会包含在这个页面,而不是所有页面。
我正在使用 Razorpay 进行支付服务。除了结账页面,没有其他页面使用它。我已将其包含在 nuxt.config.js 文件中。在 nuxtjs 中是否可以仅在您可能需要的地方使用脚本?不在所有页面中。 (我的灯塔分数因此而下降)
是的,这是可能的。您可以使用 Local Settings 将您的资源包含在 pages/
目录内的 .vue
文件中(此处在 head 函数中):
<template>
<h1>About page with jQuery and Roboto font</h1>
</template>
<script>
export default {
head () {
return {
script: [
{ src: 'https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js' }
],
link: [
{ rel: 'stylesheet', href: 'https://fonts.googleapis.com/css?family=Roboto&display=swap' }
]
}
}
}
</script>
<style scoped>
h1 {
font-family: Roboto, sans-serif;
}
</style>
这里,这个jQuery
js文件和Roboto font
css只会包含在这个页面,而不是所有页面。