通常我們使用的是單個檔案引入，但是這樣就會有很多程式碼是重複的，怎樣才能實現“按需“引入呢？

1、常見的引入單個vue檔案的寫法：import Header from '@/view/layout/Header';

2、實現”按需“引入的寫法：

”按需“引入多個vue檔案的寫法：import {Header,Footer,Content} from '@/view/layout';

使用步驟：

（1）這些被引入的檔案放置在同一個檔案下

可以看到 Header、Footer、Content都是在layout資料夾下的；

（2）配置（1）資料夾下的index.js 檔案內容

   該index.js檔案為自己建立的；

   配置如下：

export { default as vue檔名 } from './vue檔名';

將layout資料夾下的需要引入的檔案都以這種方式寫在這裡；

接下來只需要在需要使用這些vue元件的檔案中以這種方式引入，並設定成元件即可。

<script>
import {Header,Footer,Content} from '@/view/layout';
//import Header from '@/view/layout/Header';
export default {
  name: 'Layout',
  data () {
    return {
      msg: 'layout'
    }
  },
  components: {
      Header,
      Content,
      Footer
    },
}
</script>
 

本人的理解：

在沒有標明檔案的字尾時，先去找的是名一樣，如果沒有其他干擾項，基本上就是這個檔案。

或者：

先去找js檔案，有export匯出的檔案，再其他檔案。