如何通过import $ from jquery导入jquery?

Question

如何通过import $ from jquery导入jquery?

npm init -y
npm install jquery

// index.js
.....
<script src="index.js" type="module"></script>

import $ from jquery

我想可能是因为jquery不支持import,export语法的，需要先进行转换，在npm上的jquery介绍里上也提到了webpack,browser, babel

Answer 1

可以直接通过 jsdelivr 提供的转换 esm 的工具来使用

import $ from 'https://cdn.jsdelivr.net/npm/jquery/+esm'

// 如果你想在控制台以 esm 格式使用，使用下面这行代码
const jq = await import(`https://cdn.jsdelivr.net/npm/jquery/+esm`).then(mod=>mod.default)

Answer 2

1. 首先漏了引号，应该是 import $ from 'jquery'，猜测是笔误
2. 从包名引入需要配置好打包相关工具链，例如你看到的 webpack，browser，babel
3. 如果手写原生 ESM，应当从路径中引入，例如 import $ from './path/to/jquery.esm.js'，所以并不是 jQuery 不支持 ESM，但如 @查看图片 所说 jQuery 当前版本没有构建 ESM 格式

---

参考 JavaScript 模块 | MDN