반응형
nuxtj에 스크립트 태그를 쉽게 추가
기본적으로 스크립트를 index.html의 선두에 추가해야 합니다.
<script type="text/javascript" src="https://a.optmnstr.com/app/js/api.min.js" data-account="XXXXX" data-user="XXXXX" async></script>
그래서 제가 노력한 건...
nuxt.config.display에 추가되어 있습니다.
head: {
script: [
{
type: 'text/javascript',
src: 'https://a.optmnstr.com/app/js/api.min.js',
data-account: 'XXXXX',
data-user: 'XXXXX',
async: true
}
]
}
이제 확실히 이것은 효과가 없다.data-account그리고.data-user유효하지 않습니다.어떻게 하면 좋을까요?
어떤 도움이라도 주시면 감사하겠습니다!
고마워요.
이는 @Andrew1325로 지적되었습니다.
nuxt.js에서는 다음 명령어를 생성할 수 있습니다.app.html파일에 스크립트를 추가해서 제 경우엔app.html파일은 다음과 같습니다.
<!DOCTYPE html>
<html {{ HTML_ATTRS }}>
<head>
{{ HEAD }}
</head>
<body {{ BODY_ATTRS }}>
{{ APP }}
</body>
<script type="text/javascript" src="https://a.optmnstr.com/app/js/api.min.js" data-account="XXXX" data-user="XXXX" async></script>
</html>
IMO 이것은 어려운 스크립트를 프로젝트에 포함시키는 매우 쉬운 방법입니다.
메모
프로젝트를 재시작해야 합니다.app.html변화들
자세한 내용은 nuxtjs - app template를 참조하십시오.
다음과 같이 데이터 속성을 작은 따옴표로 묶을 수도 있습니다.
head: {
script: [
{
type: 'text/javascript',
src: 'https://a.optmnstr.com/app/js/api.min.js',
'data-account': 'XXXXX',
'data-user': 'XXXXX',
async: true
}
]
}
이게 도움이 될 거야
export default {
data () {
return {
message: '',
head: {
type: Object,
default: function () {
return {
title: ' Default Home page ',
meta: [
{
'hid': 'description',
'name': ' description',
'content': ' Home page content '
}
],
script: [
{
innerHTML: {
'url': 'https://www.example.com',
'logo': 'https://www.example.com/icon/logo.png',
'parentOrganization': {
'name': 'The X Company Inc',
'url': 'https://example.io',
'logo': 'https://example.io/logo-est.png',
'@type': 'Organization'
},
'foundingLocation': {
'address': {
'addressLocality': 'Dakar',
'addressRegion': 'Selegal',
'@type': 'PostalAddress'
},
'@type': 'Place'
},
'sameAs': ['https://www.facebook.com/example', 'https://www.twitter.com/example'],
'@context': 'http://schema.org',
'@type': 'Organization'
},
type: 'application/ld+json'
}
]
}
}
}
}
}
}
</script>언급URL : https://stackoverflow.com/questions/55272347/easily-add-script-tags-to-nuxtjs
반응형
'source' 카테고리의 다른 글
| VueJ에서 요소 높이 보기 (0) | 2022.09.01 |
|---|---|
| 제출할 때만 텍스트 필드 확인 (0) | 2022.09.01 |
| Vuex 게터에서 구성 요소 소품을 사용하는 올바른 방법은 무엇입니까? (0) | 2022.09.01 |
| Vue가 정의되지 않은 이유는 무엇입니까? (0) | 2022.09.01 |
| Java의 두 개체를 가능한 null 값과 비교합니다. (0) | 2022.09.01 |