我正在开始使用nuxt。屏幕截图中的项目结构中,我有一个vuetify轮播组件,该组件可以将url作为src正常工作。现在,我想尝试提供本地静态文件。我尝试过:
<template>
<v-carousel>
<v-carousel-item v-for="(item,i) in items" :key="i" :src="item.src"></v-carousel-item>
</v-carousel>
</template>
<script>
export default {
data () {
return {
items: [
{
src: '/static/52lv.PNG'
},
{
src: 'https://cdn.vuetifyjs.com/images/carousel/sky.jpg'
},
{
src: 'https://cdn.vuetifyjs.com/images/carousel/bird.jpg'
},
{
src: 'https://cdn.vuetifyjs.com/images/carousel/planet.jpg'
}
]
}
}
}
</script>
但是现在当我运行开发服务器时,我得到了:
$ npm run dev
> nuxt4@1.0.0 dev ....\js\nuxt4
> nuxt
i Preparing project for development 20:23:25
i Initial build may take a while 20:23:25
√ Builder initialized 20:23:25
ERROR Could not compile template ....nuxt4\\node_modules\\@nuxt\\vue-app\\template\\App.js: Cannot resolve "~/assets/style/app.styl" from "E:\ENVS\js\nuxt4\assets\style\app.styl"
at Promise.all.templatesFiles.map (node_modules\@nuxt\builder\dist\builder.js:6009:17)
我在做什么错了?
答案 0 :(得分:0)
我也从Nuxt.js开始!到目前为止,至少对于链接了静态页面的导航栏,我的静态文件已路由到nuxt.config.js
下的generate : { routes: ["file/", "file2/"] }
文件中。这些文件都是我的pages
目录下的.vue文件。现在,当我运行npm run dev
时,可以单击导航栏上的每个文件,它们会完美显示。希望这可以帮助!如果不清楚,请在下面发表评论。
答案 1 :(得分:0)
我遇到了确切的问题,事实证明这是我的nuxt.config.js文件中css和脚本部分下的路径问题。我添加了一个资产文件夹,其中包含子文件夹和其中的文件,例如static> asset> etc,但是在我的配置文件中它是〜/ assets。
我将其更改为〜/ static / assets /,现在可以正确编译。
希望这会有所帮助。