refactor: use .mjs for module by default

[antfu]

We believe it's a future-proofing move to use the explicit .mjs build for modules as it's the standard. Given the downstream libs like vue-demi and @vueuse/core are already moved to .mjs we think it's time for us to make the change. This will be released as v1.3.0.

Troubleshooting

.mjs can't resolve on Webpack 4

vueuse/vueuse#718

Nuxt

// nuxt.config.js

module.exports = {
  build: {
    extend (config) {
      config.module.rules.push({
        test: /\.mjs$/,
        include: /node_modules/,
        type: "javascript/auto"
      })
    }
  }
}

Vue CLI

// vue.config.js

module.exports = {
  configureWebpack: {
    module: {
      rules: [{
        test: /\.mjs$/,
        include: /node_modules/,
        type: "javascript/auto"
      }]
    }
  }
}

[vue-composition-api] must call Vue.use(VueCompositionAPI) before using any function

Make share you have only one version of @vue/composition-api installed and resolved to the same version.

Vite

vueuse/vue-demi#106 (comment)

resolve: {
  alias: [
    { find: /^@vue\/composition-api$/, replacement: '@vue/composition-api/dist/vue-composition-api.mjs' },
  ]
}

Webpack

resolve: {
  alias: [
    '@vue/composition-api$': '@vue/composition-api/dist/vue-composition-api.mjs'
  ]
}