Vue-cli: import umd module is undefined except file in node_modules

[yangblink]

Version

3.0.1

Reproduction link

https://github.com/yangblink/vue-cli-umd-test

Node and OS info

Node v9.3.0 / npm 6.0.1/ macOS 10.13.1

Steps to reproduce

use vue-cli create a default project, and import a simple umd module umd.js,

umd.js

/* eslint-disable */
(function webpackUniversalModuleDefinition(root, factory) {
  if(typeof exports === 'object' && typeof module === 'object')
    module.exports = factory();
  else if(typeof define === 'function' && define.amd)
    define("bxs", [], factory);
  else if(typeof exports === 'object')
    exports["bxs"] = factory();
  else
    root["bxs"] = factory();
})(window, function() {
  return 'umd';
});

when the file in /node_modules it's work fine,
copy it to other folder except /node_modules, it's undefined

import localumd from './umd.js'
import moduleumd from '../node_modules/umd.copy.js'
console.log(localumd);  // undefined
console.log(moduleumd); // umd

What is expected?

umd module can be recognize in any floder

What is actually happening?

umd module can be recognize only in path /node_modules

[yangblink]

It's because of the helpers config of @babel/plugin-transform-runtime in @vue/babel-preset-app

plugins: [
  [
    '@babel/plugin-transform-runtime', { helpers: ture }
  ]
]

helpers: true will inject some code at the top, below:

webpack will parse it as Harmony

[q569608465]

Is this problem solved? How to solve it?

[prettyCoders]

@yangblink i have the same problem in my project , can you help me to solve the problem .

[yangblink]

@prettyCoders @q569608465

replace babel.config.js below

module.exports = {
  presets: [
    '@vue/app'
  ],
  ignore: [ './src/umd.js' ]
}

just ignore the umd module file

[erisman20]

This error wont occur if you set useBuiltIns to 'entry' in your babel config. That is what determines if helpers @yangblink mentioned are included.

Does anyone have a better solution than that?

[huyansheng3]

vue cli default import umd which not in node_module will occur some error. Maybe it should add some tip for user ?

[MasterLuoip]

@yangblink
I still came across this problem. Thanks for this solution.

Why babel ignore would fix this problem? @babel/plugin-transform-runtime helpers add lines of code at the beginning. These lines are recognised as harmony features by Webpack. As a result, umd is undefined. If babel doesn't transpile it, Webpack will parse it correctly. Am I correct?