webpack 如何设置全局变量

Question

例如我的很多JS文件都有用Ajax请求接口，接口的域名是一样的，想要把域名设置成全局变量

Answer 1

webpack 主要是做模块化 每个js文件就是封闭的一个作用域，第一个方法你可以创建一个公共模块，把变量放在里面引入，但是每次需要都得手动import ，第二个我用的是直接挂到window 下的 比较粗暴。。。

---

刚看有更新了 我建议是创建一个公共模块 然后谁需要谁提取

引入的话也可以用ES6 的解构赋值

import {port} from '@/common'

我的'@'是在alias里设置的静态公共资源目录别名

---

朋友，刚刚用DefinePlugin试了一下，是可以进行设置全局变量的 但是注意的一个就是他是变量替换 比如dev_port: 'b' 那调用时dev_port <=> b 你要定义为字符串得写成dev_port: '"b"'。

定义

调用

Answer 2

config.js
新建一个配置文件，把要定义的全局变量/方法写入其中

export  var isProduct=false;
export  var baseUrl=!isProduct?"https://easy-mock.com/mock/5a9ddf254a2b3e6652a9c8cc/opinion":"";

main.js
把变量引入到main.js中后，直接挂载到window对象上

import {isProduct,baseUrl} from "./config/config"
window.isProduct=isProduct;
window.baseUrl=baseUrl;

test.vue

console.log(baseUrl);  //可以直接使用

Answer 3

在入口文件中声明 global.ajaxServer = '//www.abc.com/'

在需要使用的地方用 global.ajaxServer 即可

Answer 4

是这个？

resolve:{
    alias:{
        ‘jquery’: 'xxxx'
    }
 }

Answer 5

你把域名存在一个common.js，然后通过module.exports的方式暴露出来

common.js

var info = {
    'ajax_addr': 'xxx',
    ...
};
module.exports = exports = info;

用到的js

var common = require('./common.js');    //这边根据自己的路径
var ajax_addr = common.info.ajax_addr;

Answer 6

https://www.npmjs.com/package...

Answer 7

使用 ProvidePlugin

详情参见： https://www.yuque.com/fanxian...