Plunker结合SystemJS导入jQuery失败：请求带?module返回404

这个问题的核心原因是Plunker的SystemJS环境默认会对所有模块请求自动追加?module参数，但你用的jQuery CDN地址并不支持这个参数，所以服务器返回了404错误。而在非Plunker环境下你的配置能正常运行，是因为那里的SystemJS没有强制添加这个参数。

要解决这个问题，你需要修改systemjs.config.js的配置，明确告诉SystemJS jQuery是一个全局模块，而非ES模块：

SystemJS.config({
  map: {
    "jquery": "https://unpkg.com/jquery@1.12.3/dist/jquery.min.js"
  },
  packages: {
    "jquery": {
      format: "global", // 指定jQuery为全局模块格式
      exports: "$"      // 指定导出的全局变量是$
    }
  }
});

为什么这样能解决问题？ #

• 加上format: 'global'后，SystemJS会放弃将jQuery当作ES模块处理，也就不会自动追加?module参数到请求URL上了。
• exports: '$'则告诉SystemJS，当你用import $ from 'jquery'时，要把全局的$变量作为模块的导出值返回，这样你的main.js代码就能正常获取到jQuery对象。

修改完配置后，你的main.js代码不需要改动，import $ from 'jquery'和console.log($('body'))都能正常工作。

内容的提问来源于stack exchange，提问作者Ianko Djemerenov