[英]Import a javascript file globally using webpack ProvidePlugin
I have a function to make network calls and i want that function to be globally available without me having to import it every time i need to use the function 我有一个进行网络通话的功能,我希望该功能在全球范围内可用,而无需每次使用该功能时都必须导入它
Request.js Request.js
import 'whatwg-fetch';
/**
* Parses the JSON returned by a network request
*
* @param {object} response A response from a network request
*
* @return {object} The parsed JSON from the request
*/
function parseJSON(response) {
if (response.status === 204 || response.status === 205) {
return null;
}
return response.json();
}
/**
* Checks if a network request came back fine, and throws an error if not
*
* @param {object} response A response from a network request
*
* @return {object|undefined} Returns either the response, or throws an error
*/
function checkStatus(response) {
if (response.status >= 200 && response.status < 300) {
return response;
}
const error = new Error(response.statusText);
error.response = response;
throw error;
}
/**
* Requests a URL, returning a promise
*
* @param {string} url The URL we want to request
* @param {object} [options] The options we want to pass to "fetch"
*
* @return {object} The response data
*/
export default function request(url, options) {
return fetch(url, options)
.then(checkStatus)
.then(parseJSON);
}
Webpack.config.js Webpack.config.js
plugins: [
new webpack.ProvidePlugin({
fetch: 'exports-loader?self.fetch!whatwg-fetch',
request : require.resolve(path.join(process.cwd(),'app/utils/request.js'))
})]
So when i try to use the request function in any other file, it throws an error saying 'Module not found'. 因此,当我尝试在任何其他文件中使用request函数时,它会引发错误,提示“未找到模块”。 I had also tried to add a rule( Shimming ), which also failed to work.
我还尝试添加一个规则( Shimming ),该规则也无法正常工作。
Thanks in advance :) 提前致谢 :)
In the Webpack docs : 在Webpack文档中 :
For importing the default export of an ES2015 module, you have to specify the default property of module.
要导入ES2015模块的默认导出,必须指定module的默认属性。
So just change your config to something like this: 因此,只需将您的配置更改为以下内容:
plugins: [
new webpack.ProvidePlugin({
fetch: 'exports-loader?self.fetch!whatwg-fetch',
request: [path.resolve('app/utils/request.js'), 'default']
})
]
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.