Я создаю приложение SPA со ссылкой на следующий учебник.
http://voerro.com/en/tutorials/r/building-spas-with-laravel-5-and-vuejs-2/1
До вчерашнего дня Верхняя страница отображалась без ошибок. Но сегодня я снова запустил виртуальную машину и получил к ней доступ, Возникает следующая ошибка JavaScript.
Uncaught ReferenceError: axios is not defined
at new Auth (app.js:53626)
at Module../resources/js/app.js (app.js:53554)
at __webpack_require__ (app.js:20)
at Object.0 (app.js:54214)
at __webpack_require__ (app.js:20)
at app.js:84
at app.js:87
Я попытался просмотреть журнал Git, но история не изменилась.
Вы знаете, как это решить??
class Auth {
constructor () {
this.token = window.localStorage.getItem('token');
let userData = window.localStorage.getItem('user');
this.user = userData ? JSON.parse(userData) : null;
if (this.token) {
axios.defaults.headers.common['Authorization'] = 'Bearer ' + this.token; // <-this is the error point
}
}
....
export default Auth;
app.js
import Vue from 'vue'
import VueRouter from 'vue-router'
import Auth from './auth.js'
import Api from './api.js';
window.api = new Api();
window.auth = new Auth();
Vue.use(VueRouter);
bootstrap.js
window.axios = require('axios');
window.axios.defaults.headers.common['X-Requested-With'] =
'XMLHttpRequest';
Спасибо за ответ. Я попробовал npm install и npm run dev, но это не сработало. Я также пробовал npm install axios и npm run dev, но это тоже не сработало.
Извините, я не мог помочь. Странно, но он просто перестает работать. Дважды проверьте, чтобы убедиться, что вы не внесли изменения в код случайно. Кроме того, вы всегда можете попробовать запустить vagrant reload --provision и повторить попытку компиляции ваших ресурсов. Кроме того, если вы хотите переустановить/перекомпилировать, делайте это изнутри окна виртуальной машины.
Запускается ли bootstrap.js до загрузки auth.js? Если не axios не определен глобально до его использования
@LLai спасибо за полезную информацию. Я этого не знал. но bootstrap.js был вызван до использования axios.
@MattWohler спасибо. Я не знаю почему, но я решил это с помощью vagrant reload --provision. В любом случае, спасибо!!






Либо используйте window.axios, либо import axios from 'axios', либо vue.prototype.$axios = axios. Это проблема масштаба. Не полагайтесь на глобальные переменные.
Я понял, что проблема возникла из-за комментирования или удаления
require('./bootstrap'); /****in app.js ***/
Это если вы работаете с Vue в Laravel.
Примечание: это не твиттер Bootstrap для пользовательского интерфейса
я даже не подумал, что это не загрузчик твиттера, и просто прокомментировал это, ты спасаешь жизнь!
Вы можете сэкономить время, пытаясь отладить это, просто удалив каталоги
node_modulesиpublic/js, а затемnpm installиnpm run dev.