PhpStorm 替换 vuejs 分隔的脚本标签

问题描述

当我向 Vue.js 模板中的新组件添加标签时，PHPStorm 会自动替换我分离的脚本标签。我知道你不明白我刚刚写了什么。这是发生的事情的一个例子。

我原来的 App.vue 看起来像这样：

<template>
  <my-other-component></my-other-component>
<template>

// Note the script link to a separate Ts file.
<script src="./App.ts"></script>

App.ts 文件：

import { Vue } from 'vue-property-decorator'
import { Component } from 'vue-property-decorator'

@Component()
export default class App extends Vue {
}

从这里一切都很好。

当我向模板中的另一个新组件添加标签并让 PHPStorm 处理导入时，问题就出现了，它将我的 script 标签替换为：

<script>
import Vue from 'vue'
import { Component } from 'vue-class-component'
import AttributeBindingSelector from '@/components/Properties/Types/AttributeBindingSelector'
@Component({
  components: { AttributeBindingSelector }
})
export default class App extends Vue {
}
</script>

请注意，PHPStorm 生成的 script 标记替换了我的 <script src="./App.ts"></script>，而不是将组件导入到我的 ./App.ts 打字稿文件中。

以下是有关正在发生的事情的视频：https://drive.google.com/file/d/1Kv7R3WKToWjAlCRyGNQjm_UNlLWTezXV/view?usp=sharing

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

vue.js webstorm webstorm