использование ключевого слова import для библиотеки npm в vanilla javascript ошибка - PullRequest
0 голосов
/ 14 марта 2020

У меня обычная ванильная javascript настройка с использованием npm init. Я установил через npm babel-cli и babel-preset-env, а также через ax ios. Затем я использовал следующую строку кода: import ax ios from 'ax ios'; в передаваемом вавилонном файле это было изменено на: var _ax ios = require ('ax ios');

Теперь я знаю, что require является ключевым словом узла и не используется в браузере. Как бы мне обойти это? В заключение я хочу знать, как я могу использовать импорт ax ios из 'ax ios' в обычной простой настройке javascript npm init. Я знаю, что он отлично работает в реакции и angular, но я пытаюсь использовать vanilla js. Я думал, что Babel разберутся, но это не так.

Full code snippet below:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Babelling</title>
</head>
<body>

    <h1>Babel testings</h1>

    <script src="js/main.js"></script>
</body>
</html>


import axios from 'axios'; //this is in the main.js file - which babel transpiles.


//this is in the main.js file with all the transpiled changes.
'use strict';

var _axios = require('axios');

var _axios2 = _interopRequireDefault(_axios);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj 
}; }


this is the console message:  main.js:3 Uncaught ReferenceError: require is not defined
    at main.js:3
...