Unable to import soap-npm module with webpack 4 and babel 7

Question

I've updated Webpack (v4.34.0) and Babel (v7.4.5) in an old Framework7 (v4.4.3) / Vue.js (v2.6.10) project.

I need to use node-soap library as a soap client in my browser, but when run the code compiled by webpack, this library it's value is undefined

import soap from 'soap'
console.log('Soap Library Imported: ', soap)
Soap Library Imported: undefined

All works fine with axios library.

import axios from 'axios'
console.log('Axios Library Imported: ', axios)
Axios Library Imported: ƒ wrap() {...}

I think I'm having a module import trouble with babel , but I'm figuring out where the problem could be.

Thank for your help.

---

.babelrc

{
  "presets": [
    ["@babel/preset-env", {
      "modules": "auto",
      "targets": {
        "browsers": [
          "Android >= 5",
          "IOS >= 9.3",
          "Edge >= 15",
          "Safari >= 9.1",
          "Chrome >= 49",
          "Firefox >= 31",
          "Samsung >= 5",
        ],
      },
    }],
  ],
  "plugins": [
    "transform-vue-jsx",
    // "@babel/plugin-transform-runtime",
    "@babel/plugin-syntax-dynamic-import",
  ],
}

webpack.config.js (extract)

module.exports = {
  mode: env,
  node: {
    setImmediate: false,
    dgram: 'empty',
    fs: 'empty',
    net: 'empty',
    tls: 'empty',
    child_process: 'empty', 
  },
  module: {
    rules: [
      {
        test: /\.(js|jsx)$/,
        use: 'babel-loader',
        include: [
          resolvePath('src'),
          resolvePath('node_modules/framework7'),
          resolvePath('node_modules/framework7-vue'),
          resolvePath('node_modules/template7'),
          resolvePath('node_modules/dom7'),
          resolvePath('node_modules/ssr-window'),
          resolvePath('node_modules/soap'),
        ],
      },
   },
}

Answer 1

Probably what is happening is node-soap doesn't have a default export (see soap.js ) and you are not importing any of its named exports, so they get dropped during compilation by webpack's tree shaking and all you get is an empty chunk (you could confirm this by inspecting the bundle generated by webpack).

Try importing the node-soap methods directly as named exports, eg createClient :

import { createClient } from 'soap'

Answer 2

要使用监听（服务器），这对我有用

import * as soap from 'soap'; soap.listen(...);

Answer 3

同样的问题出现在 SvelteKit 和 Vite 很遗憾 node-soap GitHub 锁定和禁用了问题。