引入esm cdn，运行报错。

[xunmia]

Version

4.0.0

Reproduction link

https://github.com/xunmia/vite-vuex-project

Steps to reproduce

1. gitclone项目链接
2. yarn安装依赖包
3. yarn build打包项目
4. 打包项目部署到服务器
5. 运行项目

What is expected?

项目正常运行

What is actually happening?

Uncaught TypeError: Failed to resolve module specifier "vue". Relative references must start with either "/", "./", or "../".

[Alanscut]

由于4.0版本依赖了Vue，采用 import { xxx } from 'vue'的方式引入，这不符合esm规范，因此并不支持cdn。将config中的vuex去掉就可以正常工作了。

[frck006]

I have a similar problem

• index.html
  <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/3.0.7/vue.esm-browser.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/vuex/4.0.0/vuex.esm-browser.js"></script>
  <script src="/media/components/main.js" type="module"></script>

• main.js
  import { createApp } from 'vue'
  import { createStore } from 'vuex'

==> Uncaught TypeError: Failed to resolve module specifier "vue". Relative references must start with either "/", "./", or "../".

[Alanscut]

the same issue exists in vue-router-next, see #694

[MaybeQHL]

same problem.

[chenweigh]

<script type="importmap">
    { "imports": {
      "vue":        "https://cdnjs.cloudflare.com/ajax/libs/vue/3.2.37/vue.esm-browser.min.js",
      "vue-router": "https://cdnjs.cloudflare.com/ajax/libs/vue-router/4.0.16/vue-router.esm-browser.min.js"
    } }
    </script>

仅支持谷歌
import {createApp} from 'vue'

如果想使用其他API，又得支持多重浏览器，可使用Vue.createApp这样的形式。
如果实在想使用import {} from 'vue'的形式，可以封装一个导出模块文件

//vue-module.js
export const createApp = Vue.createApp
export const ref = Vue.ref

//main.js
import {createApp}  from './vue-module.js'