Question

我讨厌在代码中重复一些事情。现在我在main.js中导入这样的vue文件。

import Default     from '../../src/components/default.vue';
import Home        from '../../src/components/home.vue';
import hakkinda    from '../../src/components/hakkinda.vue';
import projeler    from '../../src/components/projeler.vue';
import servisler   from '../../src/components/servisler.vue';
import yetenekler  from '../../src/components/yetenekler.vue';
import yetenek     from '../../src/components/yetenek.vue';
import referanslar from '../../src/components/referanslar.vue';
import iletisim    from '../../src/components/iletisim.vue';

有没有办法用更少的线做同样的事情？如果我可以从filename分配变量名称，那可能会很棒。 PHP可以帮忙吗？但那么如何编译main.js？我没弄明白。

Answer 1

我在名为＆＃34; index.js＆＃34;的文件中使用此脚本。 to＆＃34;导出当前文件夹中每个文件的默认所有导出默认值＆＃34;有点事：

const files = require.context('.', false, /\.js$/)
const modules = {}
files.keys().forEach((key) => {
  if (key === './index.js') return
  modules[ key.replace(/(\.\/|\.js)/g, '') ] = files(key).default
})
export default modules

然后您可以通过导入整个目录来导入整个目录，如下所示：

import folder from '../path/to/folder'

我希望这会有所帮助。

Answer 2

基于Potray和Fosuze的工作答案，以方便参考：

const files = require.context('.', false, /\.vue$/)
const modules = {}
files.keys().forEach((key) => {
     if (key === './index.js') return
     modules[key.replace(/(\.\/|\.vue)/g, '')] = files(key)
})
export default modules

是否可以在文件夹中导入* .vue文件？

2 个答案: