通过webpack.base.conf.js定义全局函数

new webpack.ProvidePlugin({
      $: 'webpack-zepto',
      React: 'react',
      ReactDOM: 'react-dom',
      fetchUrl: [path.resolve(__dirname, '../src/util/ConfigUtil.js'), 'fetchUrl'],
//fetchUrl方法名 'default' 对应ConfigUtil.js的导出方法是否有default 
      PureComponent: [path.resolve(__dirname, '../src/components/base/PureComponent.jsx'), 'default'],
      PageComponent: [path.resolve(__dirname, '../src/components/base/PageComponent.jsx'), 'default'],
      Component: ['react', 'Component'],
    })
/**
 * export  导出全局函数
 */
 export function fetchUrl (originUrl, urls = 'XXX') {
    if (!originUrl || !urls) {
        return originUrl;
    }
    let formatUrl = originUrl;
    // 遍历替换对象的src
    for (let i = 0; i < urls.length; i++) {
        let { src, target } = urls[i] || {};
        if (formatUrl.indexOf(src) >= 0) {
            formatUrl = formatUrl.replace(new RegExp(src, 'gm'), target); 
            break;
        }
    }
    return formatUrl;
}

其他任意文件都可以使用featchUrl()这个全局方法

你可能感兴趣的:(前端,javascript,webpack,react.js)