body, html {
height: 100%;
}mounted() {
this.app_id = +document.getElementById("app_id").innerHTML;
}<template>
<div>
...
<div id="shadow-dom" v-if="isTrueDomHidden"> ... </div>
<div class="true-dom" :class="{'is-hidden': isTrueDomHidden}"> ... </div>
...
</div>
</template>
<script>
export default {
data() {
return {
mainFeed: [], // mainFeed должна получаться и забираться где-то в другом месте внутри vue
isTrueDomHidden: true
}
},
mounted() {
if (this.mainFeed.length) setTimeout(() => {
this.isTrueDomHidden = false;
}, 2000);
}
};
</script>
в консоль пишет:
, а вы вопросы пишите сюда?
{src: require('@/assets/file/1.jpg')} происходит на этапе сборки и в код попадает уже что-то типа:{src: '/img/1.fd5gdf.jpg'} или там {src: 'data:image/jpeg;base64,...'} {src: a("18c2")}, которое возвращает уже соответственно '/img/1.fd5gdf.jpg' или 'data:image/jpeg;base64,...', т.е. результат обработки require('@/assets/file/1.jpg'))testже становится действительна только во время исполнения.{src: require(`@/assets/file/${test}.jpg`)}, но никакой магии тут всё равно нет: в таких случаях webpack просто обрабатывает require для всех файлов по маске @/assets/file/*.jpg(что может сильно раздуть размер бандла если в папке много лишнего мусора) и заменяет require(`@/assets/file/${test}.jpg`) на соответствующую условную конструкцию с применением переменной test.{src: require(test)} ты не даёшь webpack'у даже намёка, на то что бы там следовало грузить и откуда.
<template>
<div>
<div id="sp-7O1Ya5yaBAGp"></div>
</div>
</template>
<script>
export default {
mounted() {
(function(w, n) {
w[n] = w[n] || [];
w[n].push({
spId: "7O1Ya5yaBAGp",
blockId: "sp-7O1Ya5yaBAGp"
});
})(window, "superProjectRender");
},
head: {
script: [
{
src: "https://superproject.com/sp.js"
}
]
}
};
</script>