通过require引用jtopo报错JTopo未定义

Question

想引入jtopo.js，直接在html中引入没有问题，但是使用require之后，就会提示jtopo未定义，请问这是为什么呀？
图片描述

Answer 1

目前找到两种解决方法，一种是在webpack里面配置external，还有一种是

{
                    test: require.resolve('./'+ app +'/jtopo-0.4.8-min.js'),
                    loader: 'exports-loader?window.JTopo!script-loader'
                }

然后引入的时候require("exports?window.JTopo!../../../../jtopo-0.4.8-min");
区别是第一种不会打包在一起，第二种会打包在一起。

Answer 2

var JTopo = require('./js/jtopo')

Answer 3

首先我不确认你是不是基于 Node.js 的构建的前端工程，但是需要注意运行在浏览器端的script和模块引用不要混淆,下面是vue的源文件的不同引用方式：

UMD：UMD 版本可以通过 <script> 标签直接用在浏览器中。jsDelivr CDN 的 https://cdn.jsdelivr.net/npm/vue 默认文件就是运行时 + 编译器的 UMD 版本 (vue.js)。

CommonJS：CommonJS 版本用来配合老的打包工具比如 Browserify 或 webpack 1。这些打包工具的默认文件 (pkg.main) 是只包含运行时的 CommonJS 版本 (vue.runtime.common.js)。

ES Module：ES module 版本用来配合现代打包工具比如 webpack 2 或 Rollup。这些打包工具的默认文件 (pkg.module) 是只包含运行时的 ES Module 版本 (vue.runtime.esm.js)。

Answer 4

楼主解决了吗，遇到了同样的问题

Answer 5

楼主解决了吗，遇到了同样的问题