将 Typescript 添加到 Vue + Rails 应用程序 - 导入不再起作用？答案

【问题标题】：Adding Typescript to Vue + Rails app - Imports no longer work?将 Typescript 添加到 Vue + Rails 应用程序 - 导入不再起作用？
【发布时间】：2019-01-09 02:27:17
【问题描述】：

我正在尝试将 TypeScript 添加到现有的 VueJS + Rails 应用程序中。我克隆了这个演示（https://github.com/gbarillot/rails-vue-demo-app），然后按照https://github.com/rails/webpacker的说明进行操作

$ bundle exec rails webpacker:install:vue
$ bundle exec rails webpacker:install:typescript

然后我按照here 的描述修改了config/webpack/loaders/typescript.js。

一切似乎都可以编译了，但是当我进入“主页”视图并将script 更改为打字稿时：

<script lang="ts">
import Layout from '../shared/layout';

export default {
  components: {
    Layout
  }
}
</script>

我收到以下错误：

Failed to compile.

/Users/matt/projects/rails-vue-demo-app/app/javascript/packs/components/home/index.vue.ts
[tsl] ERROR in /Users/matt/projects/rails-vue-demo-app/app/javascript/packs/components/home/index.vue.ts(13,20)
      TS2307: Cannot find module '../shared/layout'.

为什么我在启用 typescript 后找不到布局文件？

【问题讨论】：

@AbM - 修复了它！如果您将其发布为答案，我会将其标记为已接受。

标签： ruby-on-rails typescript webpack vue.js

【解决方案1】：

我记得在演示组件中遇到过类似的问题。尝试在shared/layout 中添加一个空的导出，以便打字稿可以拾取它：

<script lang="ts">
  export default {}
</script>

【讨论】：