nuxt.js 生成的默认文件 components/Logo.vue 源码大概如下:

 1 <template>
2 <svg
3 class="NuxtLogo"
4 >
5 </svg>
6 </template>
7 <style>
8 .NuxtLogo {
9 margin: auto;
10 }
11 </style>

在 page/index.vue 文件中引入 `import Logo from '~/components/Logo.vue';` 会报错:`File 'xxx/components/Logo.vue' is not a module. Vetur(2306)`。

typescript 提示新增 vue-shims.d.ts ( https://github.com/Microsoft/TypeScript-Vue-Starter#single-file-components ),试过还是不行。

github issue 翻了一下,最后找到这个:https://github.com/vuejs/vetur/issues/1709

给 components/Logo.vue 添加 export 即可:

 1 <template>
2 <svg
3 class="NuxtLogo"
4 >
5 </svg>
6 </template>
7 <style>
8 .NuxtLogo {
9 margin: auto;
10 }
11 </style>
12 <script lang="ts">
13 import Vue from 'vue';
14
15 export default Vue.extend({
16 name: 'LOGO',
17 });
18 </script>

添加之后,还需关闭重启 VSCode !

nuxt.js 使用 Typescript 在 VSCode 报错: File 'xxx/components/Logo.vue' is not a module. Vetur(2306)的更多相关文章

  1. nuxt.js 初始化 npm run dev 报错

    在初始化 npm install 了基本依赖后: npm run dev 报错: error in ./server/index.js Module build failed: Error: Plug ...

  2. Angular5 import interface 报错:XXX is not a module

    在项目里定义了一个interface,device.ts.然后在component.ts中要使用这个interface,import之后,VSCode报错:‘xxx/xxx/xxx/device.ts ...

  3. vue使用v-for时vscode报错 Elements in iteration expect to have 'v-bind:key' directives

    vue使用v-for时vscode报错 Elements in iteration expect to have 'v-bind:key' directives Vue 2.2.0+的版本里,当在组件 ...

  4. vscode源代码管理(vscode报错 未找到Git,请安装Git,或在"git.path" 设置中配置)

    vscode源代码管理(vscode报错 未找到Git,请安装Git,或在"git.path" 设置中配置) 直接上图,电脑上已经安装git,由于vscode没有找到git,所以v ...

  5. Vscode报错: error:0308010C:digital envelope routines::unsupported错误记录解决

    Vscode报错: error:0308010C:digital envelope routines::unsupported错误记录解决 因为安装了新版本的node才报的错误:node版本: v18 ...

  6. centos7 安装nginx和php5.6.25遇到 无法访问php页面 报错file not found 问题解决

    php-fpm安装完成,nginx安装完成 netstap -ntl| 发下端口正常开启 iptables -L 返现9000端口已经开放 ps -aux|grep nginx 发下nginx进程正常 ...

  7. 树莓派(Raspberry Pi 3) centos7使用yum命令报错File "/usr/bin/yum", line 30 except KeyboardInterrupt, e:

    使用yum命令报错 File "/usr/bin/yum", line 30 except KeyboardInterrupt, e: ^SyntaxError: invalid ...

  8. yum命令报错File "/usr/bin/yum", line 30 except KeyboardInterrupt, e:

    使用yum命令报错File "/usr/bin/yum", line 30 except KeyboardInterrupt, e: 问题出现原因:yum包管理是使用python2 ...

  9. Egret项目Typescript的编译报错

    今天编译项目,出现了一个奇怪的报错,如下: E:\engine\egret-core-3.1.2\tools\lib\typescript\tsclark.js:41531 1> if (fil ...

  10. nuxt 运行项目后 中总是报错

    报错的内容: nuxt.config.js中的图片 如果出现第一张图的中的错误: 请注释掉第二张图中extend里面的loader:'eslit-loader',或者把extend里面if下面的内容全 ...

随机推荐

  1. kubeadm init问题

    1.解析不到对应的主机 [WARNING Hostname]: hostname "k8s-master-01" could not be reached  [WARNING Ho ...

  2. Qt编写可视化大屏电子看板系统19-横向柱状图

    一.前言 横向柱状图的绘制这玩意当初还着实花费了一些时间,因为从v1版本开始,默认XY坐标轴是没有交换位置的处理的,也只有垂直的柱状图,要想换成横向的柱状图必须是自己拿到数据重新绘制,数据值的设置一般 ...

  3. Qt开源作品37-网络中转服务器

    一.前言 用Qt做开发10年了,其中做过好多项目,基于现在web和移动互联网发展如此迅猛,大量的应用场景需要一个网络中转服务器,可以实现手机app或者其他客户端远程回控设备,现在物联网发展非常迅猛,这 ...

  4. 解决pip命令报错及Python环境配置指南:从安装到优化

    1. 错误日志 当我在 Linux 机器(使用 Debian 或 Ubuntu 或衍生发行版)上运行 pip install xyz 时,会出现这样的错误: error: externally-man ...

  5. [转]BeanUtils.copyProperties使用总结以及注意事项

    1.前言开发过程中,讲一个对象的属性和值赋值到另一个对象上,大量使用了get.set方法,看着很臃肿,思考下肯定不只有我有这种想法,所以技术上肯定有方法能解决这个问题,所以查阅了一些资料发现了Bean ...

  6. java EE进行Web开发时*.jsp页面的<%@显示“The superclass "javax.servlet.http.HttpServlet" was not found on the Java Build Path”错误,webcontent文件夹总是出现红x或者java源码出现The import javax.servlet cannot be resolved 的解决方法

    我们在用Eclipse进行Java web开发时,可能会出现这样的错误:The superclass javax.servlet.http.HttpServlet was not found on t ...

  7. 基于开源IM即时通讯框架MobileIMSDK:RainbowChat-iOS端v7.0版已发布

    关于MobileIMSDK MobileIMSDK 是一套专门为移动端开发的开源IM即时通讯框架,超轻量级.高度提炼,一套API优雅支持 UDP .TCP .WebSocket 三种协议,支持 iOS ...

  8. Web网页端IM产品RainbowChat-Web的v5.0版已发布

    一.关于RainbowChat-Web RainbowChat-Web是一套Web网页端IM系统,是RainbowChat的姊妹系统(RainbowChat是一套基于开源IM聊天框架 MobileIM ...

  9. 零基础快速入门WebRTC:基本概念、关键技术、与WebSocket的区别等

    本文引用自Hussein Nasser的两个视频分享,原文内容由卢冰聪翻译整理,即时通讯网收录时有大量修订和重新排版. 1.内容概述 本文是专为学习开源实时音视频工程WebRTC的入门者编写的速成指南 ...

  10. Python多分类Logistic回归详解与实践

    在机器学习中,Logistic回归是一种基本但非常有效的分类算法.它不仅可以用于二分类问题,还可以扩展应用于多分类问题.本文将详细介绍如何使用Python实现一个多分类的Logistic回归模型,并给 ...