最近做了一个导出功能,代码如下
import request from 'request-promise-native';
 export default class Form {
  // 导出
  @post('/export')
  public async export(ctx) {
    const params = JSON.parse(ctx.request.body.fields.params);
    const dataExport = await request({
      method: 'POST',
      uri: utils.url.org(ctx, '/v1/:route'),
      json: true,
      headers: {
        cookie: ctx.request.header.cookie,
      },
      qs: params.exportParam, 
    });
    await excel.export(ctx, params.tableName, params.column, dataExport.items);
  }
 }
报错
request_promise_native_1.default is not a function 解决方法:引入方式改为
import * as request from 'request-promise-native';
首先我们要明白一个前提,CommonJS模块规范和ES6模块规范完全是两种不同的概念。

看一下下面的 CommonJs module 和 ES6的module ,就可以懂了

CommonJS规范

Module 的语法

打印引入的request  查看不同的引入方式 request 值有什么区别

----1------------------------------------------- 
request-promise-native包的导出方式是:module.exports = request;
不同引入方式,打印结果:
1. import * as request from 'request-promise-native';
  打印request ,结果如下:
  function request(uri, options, callback) {
    if (typeof uri === 'undefined') {
      throw new Error('undefined is not a valid uri or options object.')
    }
    var params = initParams(uri, options, callback)
    if (params.method === 'HEAD' && paramsHaveRequestBody(params)) {
      throw new Error('HTTP HEAD requests MUST NOT include a request body.')
    }
    return new request.Request(params)
  } 2. import request from 'request-promise-native';
  打印 request 结果是 undefined
3. import {request} from 'request-promise-native';
  打印 request 结果是 undefined
 ----2------------------------------------------- 
如果 request-promise-native 包导出方式改为如下方式:
包导出: module.exports.request = request;  等同于 module.exports = {request};
不同引入方式,打印结果:
1. import * as request from 'request-promise-native';
  打印request ,结果如下:
  { request:
    { [Function: request]
    get: [Function],  head: [Function],  options: [Function],
    post: [Function],  put: [Function],  patch: [Function],  del: [Function],  delete: [Function],
    jar: [Function],  cookie: [Function],  defaults: [Function],  forever: [Function],
    Request: { [Function: Request] super_: [Object], debug: undefined, defaultProxyHeaderWhiteList: [Array], defaultProxyHeaderExclusiveList: [Array] },
    initParams: [Function: initParams],
    debug: [Getter/Setter] }
  }
2. import request from 'request-promise-native';
  打印 request 结果是 undefined
3. import {request} from 'request-promise-native';
  打印 request 结果如下:
  function request(uri, options, callback) {
    if (typeof uri === 'undefined') {
      throw new Error('undefined is not a valid uri or options object.')
    }
    var params = initParams(uri, options, callback)
    if (params.method === 'HEAD' && paramsHaveRequestBody(params)) {
      throw new Error('HTTP HEAD requests MUST NOT include a request body.')
    }
    return new request.Request(params)
  }
----3------------------------------------------- 
如果 request-promise-native 包导出方式改为如下方式:
包导出: module.exports.default = request;
不同引入方式,打印结果:
1. import * as request from 'request-promise-native';
  打印request ,结果如下:
  { default:
    { [Function: request]
    get: [Function],  head: [Function],  options: [Function],
    post: [Function],  put: [Function],  patch: [Function],  del: [Function],  delete: [Function],
    jar: [Function],  cookie: [Function],  defaults: [Function],  forever: [Function],
    Request: { [Function: Request] super_: [Object], debug: undefined, defaultProxyHeaderWhiteList: [Array], defaultProxyHeaderExclusiveList: [Array] },
    initParams: [Function: initParams],
    debug: [Getter/Setter] }
  } 2. import request from 'request-promise-native';
  打印 request 结果如下:
  function request(uri, options, callback) {
    if (typeof uri === 'undefined') {
      throw new Error('undefined is not a valid uri or options object.')
    }
    var params = initParams(uri, options, callback)
    if (params.method === 'HEAD' && paramsHaveRequestBody(params)) {
      throw new Error('HTTP HEAD requests MUST NOT include a request body.')
    }
    return new request.Request(params)
  }
3. import {request} from 'request-promise-native';
  打印 request 结果是 undefined -----总结----------------------------------------
导出:( = 右侧的 request 是一个function,从源码中得知)
out1: module.exports = request;  // 导出的是 function
out2: module.exports.request = request; // 导出的是对象 {request:function}
out3: module.exports.default = request; // 导出的是对象 {default:function}

引入:
in1: import * as request from 'request-promise-native'; // * as request => out1: request = function; out2: request =  {request:function}; out3: request = {default:function} => 导出的内容 = request
in2: import {request} from 'request-promise-native'; // request => out1: request = undefined; out2: request = function; out3: request = undefined => 解构赋值 
in3: import request from 'request-promise-native'; // {request} => out1: request = undefined; out2: request = undefined; out3: request = function => module.exports.default = 随意命名
 

查看不同引入方式的编译结果:

-----不同引入方式,打包编译结果-----------------------

request-promise-native 源码:

-------1-- module.exports = request -------------------------

request-promise-native 源码:最后一句导出 module.exports = request
左边 引入: import request from 'request-promise-native';
右边 引入: import * as request from 'request-promise-native';

打包后的结果是:

左侧引入方式 import request from 'request-promise-native';

程序报错: request_promise_native_1.default is not a function

如果引入方式改为 :import {request} from 'request-promise-native';

程序报错: request_promise_native_1.request is not a function

-------2-----module.exports.default = request----------------------

request-promise-native 源码:最后一句导出  若改成 module.exports.default = request;

左边 引入: import request from 'request-promise-native';
右边 引入: import * as request from 'request-promise-native'; 
左右两边编译后一样 request_promise_native_1.default 就是 request 所以不报错
打包后的结果是:

-------3------module.exports = {request}---------------------

request-promise-native 源码:最后一句导出  若改成 module.exports = {request};

左边 引入: import request from 'request-promise-native';
右边 引入: import * as request from 'request-promise-native'; 
以上两种方式引入,均报错
若引入方式改为:import {request} from 'request-promise-native';
则不报错, 导出成功
 
-----总结----------------------------------------
判断引入包A是否有default
in1: import * as A1 from A // 没有default: A1 = require(A) 使用:A1() ; 有default: A1_xx= = require(A) 使用: A1_xx.default()
in2: import A1 from A // 不管有没有default: A1_xx= = require(A) 使用: A1_xx.default()
in3: import {A1} from A // 不管有没有default: A1_xx= = require(A) 使用: A1_xx.A1()
 
import包的方式,由包的exports内容决定
 ----------------------------------------------------------------------------------
 

 -------4---------------------------

request-promise-native 源码:最后一句导出

module.exports = request;
若改成
export default request;

但是程序仍报错  SyntaxError: Unexpected token export

打包编译结果如下:左边import 右边 import * as , 结果是好的
 

 
现在我们使用 react, typescript
都会使用es6语法,创建class
使用如下方式导出 
export default class Form
export default new class {}
-----------------------------
typescript的.ts文件通过 tsc 命令打包 编译结果是

exports["default"] = new /** @class */ (function () {...}
所以直接 import 

-----------------------------


使用包时,报 xxx.default is not a function的更多相关文章

  1. linux下, 再次遇到使用thinkphp的模板标签时,报错used undefined function \Think\Template\simplexml_load_string() 是因为没有安装 php-xml包

    linux下, 使用thinkphp的模板标签,如 eq, gt, volist defined, present , empty等 标签时, 报错: used undefined function ...

  2. python踩坑系列之导入包时下划红线及报错“No module named”问题

    python踩坑系列之导入包时下划红线及报错“No module named”问题 使用pycharm编写Python时,自己写了一个包(commontool),在同级另一个路径下(fileshand ...

  3. 导入spark程序的maven依赖包时,无法导入,报错Unable to import maven project: See logs for details

    问题:导入spark程序的maven依赖包时,无法导入,且报错:0:23 Unable to import maven project: See logs for details 2019-08-23 ...

  4. nexus 私服 拉不了 jar 包,报 Not authorized

    问题: 无法下载导入jar包,idea reload 时 报: Could not transfer artifact com.xxx:parent:pom:1.0-SNAPSHOT from/to ...

  5. Android程序进行混淆,在导出签名apk包时出错!

    今天终于完成了近一个月的App开发工作,对程序进行混淆导出签名apk包时,却出现了如下的错误: Proguard returned with error code 1. See console Not ...

  6. iOS 导出 ipa 包时 三个选项的意义

    OS 导出 ipa 包时 三个选项的意思 如图  在 iOS 到处 ipa包的时候 会有三个选项 Save for iOS App Store Deployment Save for Ad Hoc D ...

  7. WireShark抓包时TCP数据包出现may be caused by ip checksum offload

    最近用WireShark抓包时发现TCP数据包有报错:IP Checksum Offload,经过查阅资料终于找到了原因 总结下来就是wireshark抓到的数据包提示Checksum错误,是因为它截 ...

  8. Maven项目pom.xml文件报xxx\target\classes\META-INF\MANIFEST.MF (系统找不到指定的路径)

    在今天的学习Maven项目中遇到的这个错误:pom.xml文件报xxx\target\classes\META-INF\MANIFEST.MF (系统找不到指定的路径) 在Maven项目学习中,缓存问 ...

  9. spark提交jar包时出现unsupported major.minor version 52.0错误的解决方案

    一.问题: 最近在spark集群上做一个项目,打包提交jar包时,出现了unsupported major.minor version 52.0的报错,而在local模式运行却能正常运行! 二.错误原 ...

随机推荐

  1. java 之 学习过程中遇到的大佬博客

    大佬1号:zejian 博客:https://blog.csdn.net/javazejian

  2. angular2相关

    脚手架安装一个项目 1.全局安装angular脚手架 npm install -g @angular/cli 2.初始化一个文件夹 ng new my-angular-demo 3.进入文件夹 cd ...

  3. STL--priority_queue--自定义数据类型

    STL中priority_queue的声明模板有3个参数priority_queue<Type,Container,Functional>. 当使用的数据类型Type为自定义数据类型时有以 ...

  4. P4430 小猴打架、P4981 父子

    prufer编码 当然你也可以理解为 Cayley 公式,其实这个公式就是prufer编码经过一步就能推出的 P4430 小猴打架 P4981 父子 这俩题差不多 先说父子,很显然题目就是让你求\(n ...

  5. SQL 文件导入数据库

    1.首先通过 xshell 连接数据库服务器,执行命令 mysql -u root -p 命令,按照提示输入密码,连接上数据库 2.在连接终端上执行命令 create database JD_Mode ...

  6. Mybatis时间范围查询,亲测有效

    Md2All export document .output_wrapper pre code{font-family: Consolas, Inconsolata, Courier, monospa ...

  7. IOS抓取与反抓取

    目录 IOS抓取基础知识 IOS抓取方式 iOS破解 模拟器 黑雷苹果模拟器 介绍 局限 改机软件 常用改机软件 检测 可更改属性 注入与Hook(越狱下实现作弊) 注入方式 Hook方式 重打包(非 ...

  8. Automatic Reference Counting

    NSObject简化版alloc: struct obj_layout { NSUInteger retained; }; + (id)alloc { int size = sizeof(struct ...

  9. B - Dining POJ - 3281 网络流

    Cows are such finicky eaters. Each cow has a preference for certain foods and drinks, and she will c ...

  10. 微软原文翻译:适用于.Net Core的WPF数据绑定概述

    原文链接,大部分是机器翻译,仅做了小部分修改.英.中文对照,看不懂的看英文. Data binding overview in WPF 2019/09/19 Data binding in Windo ...