NUXT:无法编译模板

时间:2019-01-03 01:42:09

标签: javascript vue.js nuxt.js

enter image description here

我正在开始使用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)

我在做什么错了?

2 个答案:

答案 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 /,现在可以正确编译。

希望这会有所帮助。