重构所有 Vue 组件导入以附加 .vue 扩展名

Question

Vue CLI 正在放弃对无扩展导入的支持，并且 Vetur 等 VS Code 扩展支持的各种功能不适用于无扩展导入。

我需要修改从 .vue 文件导入的每个默认组件，以便在整个代码库中附加扩展。由于文件的数量，这是不可能手工完成的，需要一些自动化的方法。

示例：

转：

import Baz from '@/components/Baz'
import Thing from './LocalThing'
import OtherThing from '../../OtherThing'

进入：

import Baz from '@/components/Baz.vue'
import Thing from './LocalThing.vue'
import OtherThing from '../../OtherThing.vue'

如何实现？

Answer 1

正则表达式查找替换为

查找:

^import (.*?)(?<!\.vue)'$

替换

import .vue'

不要替换已经完成的。

它应该在 Find/Replace 文件中工作。

编辑

然后你必须根据以 .vue

结尾的文件名构造一个正则表达式

find . -name "*.vue"

然后用文件基名构造一个正则表达式：

^import (.*?(?:Baz|LocalThing|OtherThing))(?<!\.vue)'$

Refactor all Vue component imports to append .vue extension