Question

尝试更改我在jQuery中导入的全局定义变量会导致引用错误：

global.js

export var w = window.innerWidth;

main.js

import {w} from './global.js';
console.log(w);
$(document).ready(function(){
    ...
    console.log(w);
    w = window.innerWidth;
    console.log(w);
});

前两个控制台打印出该值，但第三个控制台显示一个

main.js:31 Uncaught ReferenceError: w is not defined

与webpack有关吗？我在开发工具中看到了这一点：

console.log(_global_js__WEBPACK_IMPORTED_MODULE_3__["w"]);
w = window.innerWidth;
console.log(w);

就像不是同一变量一样，但是如何使jQuery设置webpack变量？

Answer 1

在ES6模块系统中，您无法从其他模块重新分配导入的值。导入的值对于其他模块是只读的。这就是它的本意。否则，消费者会在不了解提供者的情况下改变提供者的价值。

但是，您可以提供一种从提供商本身更改价值的方法：

global.js：提供程序

var w = window.innerWidth;
var changeW = function(newValue) {
   w = newValue;
}
export { w, changeW }

在main.js中：

import {w,changeW} from './global.js';
console.log(w);
$(document).ready(function(){
...
   console.log(w);
   changeW(window.innerWidth); //call method to change value
   console.log(w);
});

jQuery为什么无法访问此导入的全局变量？

1 个答案: