VueでExportのいろいろ書き方を纏めておきます

成功した構文

Vueのファイル：index.vue

index.vue

<template>
  <div>
  <p>{{ msg }}</p>
  </div>
</template>
<script>
import { t1m1, t1m2 } from './t1'
import { t2 } from './t2'
import { t3m1 } from './t3'
export default {
  name: 'test',
  data () {
    return {
      msg: 'you are ok.'
    }
  },
  mounted () {
    t1m1()
    t2.t2m1()
    t1m2()
    t2.t2m2()
    t3m1()
  }
}
</script>

Javascriptファイル１

t1.js

const t1m1 = function () {
  console.log('t1m1 ok')
}
function t1m2 () {
  console.log('t1m2 ok')
}
export { t1m1, t1m2 }

Javascriptファイル２

t2.js

const t2 = {}
t2.t2m1 = function () {
  console.log('t2m1 ok')
}
t2.t2m2 = function () {
  console.log('t2m2 ok')
}
export { t2 }

Javascriptファイル３

t3.js

export default function t3m1 () {
  console.log('t3m1 ok')
}

失敗した構文

例１

t2.js

const t2 = {}
t2.t2m1 = function () {
  console.log('t2m1 ok')
}
function t2.t2m2 () {
  console.log('t2m2 ok')
}
export { t2 }

エラーメッセージは以下
Module build failed: SyntaxError: t2.js: Unexpected token, expected

例２

t2.js

const t2 = {}
t2.t2m1 = function () {
  console.log('t2m1 ok')
}
t2.t2m2 = function () {
  console.log('t2m2 ok')
}
export default { t2 }

エラーメッセージは以下
[Vue warn]: Error in mounted hook: "TypeError: Cannot read property 't2m1' of undefined"

例３

t3.js

export function t3m1 () {
  console.log('t3m1 ok')
}

エラーメッセージは以下
[Vue warn]: Error in mounted hook: "TypeError: Object(...) is not a function"

例４

t3.js

export t3m1 = function  () {
  console.log('t3m1 ok')
}

エラーメッセージは以下
Module build failed: SyntaxError: t3.js: Unexpected token, expected { (1:7)

例５

t3.js

const t3m1 = function  () {
  console.log('t3m1 ok')
}
export { t3m1 }

エラーメッセージは以下
[Vue warn]: Error in mounted hook: "TypeError: Object(...) is not a function"

例６

t3.js

const t3m1 = function () {
  console.log('t3m1 ok')
}
export default { t3m1 }

エラーメッセージは以下

例７

t3.js

function t3m1 () {
  console.log('t3m1 ok')
}
export default { t3m1 }

エラーメッセージは以下
[Vue warn]: Error in mounted hook: "TypeError: Object(...) is not a function"