1. How to reproduce
Create a project with vue-cli3, and popper.js Put it in the SRC directory, popper.js The specification of UMD is UMD, and the code is shown in the following screenshot
And then in the App.vue Introduction in
import Popper from './popper.js'
The other one is installed through NPM package
npm install popper.js --save
And then in the App.vue Introduction in
import Popper from 'popper.js/dist/umd/popper.js'
this popper.js The file is as like as two peas on the JS file on SRC, but the location is different.
However, the execution result is different. As shown in the figure below, it can be exported normally
Why is this? In the case of import and NPM package, this and exports are both empty objects {} when introduced by Src
Exports are undefined, resulting in an error
In case of the same problem, please refer toThis articleSolved
The cause of the problem can be read in the original text, and I will post the solution
npm install --save-dev @babel/plugin-transform-modules-umd
babel.config.js
module.exports = {
presets: [
'@vue/cli-plugin-babel/preset',
],
Plugins: ['@ Babel / plugin transform modules UMD'], // mainly this
};
Have you solved this problem?
Have you solved this problem