Axios import breaks rest of javascript file

I’m using encore and yarn to set up my javascript and css in a symfony project. I want to use axios so I use:

yarn add axios

then I add this code to app.js

import '../css/app.scss';
import axios from "axios";

console.log('test');

axios({
    url: 'https://dog.ceo/api/breeds/list/all',
    method: 'get',
    data: {
        foo: 'bar'
    }
});

Then yarn watch picks up the modifications and compiles it to this:

(window["webpackJsonp"] = window["webpackJsonp"] || []).push([["app"],{

/***/ "./assets/css/app.scss":
/*!*****************************!*
  !*** ./assets/css/app.scss ***!
  *****************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {

// extracted by mini-css-extract-plugin

/***/ }),

/***/ "./assets/js/app.js":
/*!**************************!*
  !*** ./assets/js/app.js ***!
  **************************/
/*! no exports provided */
/***/ (function(module, __webpack_exports__, __webpack_require__) {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _css_app_scss__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../css/app.scss */ "./assets/css/app.scss");
/* harmony import */ var _css_app_scss__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_css_app_scss__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! axios */ "./node_modules/axios/index.js");
/* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(axios__WEBPACK_IMPORTED_MODULE_1__);


console.log('test');
axios__WEBPACK_IMPORTED_MODULE_1___default()({
  url: 'https://dog.ceo/api/breeds/list/all',
  method: 'get',
  data: {
    foo: 'bar'
  }
});

/***/ })

},[["./assets/js/app.js","runtime","vendors~app~normalization"]]]);

When I remove the import of Axios the console.log(‘test’) runs but when I add the import it won’t. So the import breaks the other code.

Could someone explain how I import axios without trouble?

Source: Symfony Questions

Was this helpful?

0 / 0

Leave a Reply 0

Your email address will not be published. Required fields are marked *