система управления фоном vue-typescript-admin-template

Vue.js
система управления фоном vue-typescript-admin-template

предисловие

  • Он был написан с 2.9.6@vue-cli до【Музыкальный блог】
  • Поскольку vue-cli@3.0 был выпущен рано, я боялся, что не пойму, когда меня спросят во время интервью, что было бы немного неловко, поэтому я воспользовался свободным временем, чтобы учиться и учиться.
  • Так получилось, что вы можете обновить проект и использовать структуру, написанную большим парнем.


четыре аспекта

1. Обновите vue-cli до версии 3.0 или выше.

  • Имя пакета Vue CLI изменено с vue-cli на @vue/cli
  • Поскольку vue-cli на моем компьютере имеет версию 2.9.6, мне нужно удалить и переустановить новую версию.
  • Удалите vue-cli:

    npm uninstall vue-cli -g
  • Установите vue-кли:

    npm install -g @vue/cli
  • Показывает, что установка прошла успешно, как доказать:

    vue --version @vue/cli 4.2.3
  • ОК, мы сейчас на версии 4.2.3

2. Подготовьте загрузку vue-cli@3.0 или более поздней версии.

  • я используюvue-typescript-admin-templateЭтот шаблон представляет собой решение для внутреннего интерфейса, основанное наvue, typescriptа такжеelement-uiвыполнить
    Первоначальная версия кода Javascript была созданаPanJiaChenразработка и обслуживаниеvue-element-admin, который имеет многофункциональные интеграционные решения
    Портал GitHub:GitHub.com/arm/v UE-…
  • Если вы хотите начать с очень простого базового шаблона вместо того, чтобы сразу переходить к этой многофункциональной интеграции, вы можете взглянуть на этот проект.minimalветвь
    Портал GitHub:GitHub.com/arm/v UE-…
  • Документация dos для этой системы:Устроить кому-то.GitHub.IO/v UE-типа SCR…  
  • Скачать проект:

    npm install

  • Может быть сообщено об ошибке, сообщение об ошибке:

  • В результате, после расследования Baidu, я нашел авторскуюvue-element-adminДокументация

  • Наука, что мы используем сейчасvue-typescript-admin-templateЭтот шаблонPanJiaChenразработка и обслуживаниеvue-element-adminавтор, он же написалvue-element-admin

  • Так что я в его оригиналеvue-element-adminРешение было найдено в документе, так как все они написаны одним и тем же автором, сообщение об ошибке и решение проблемы все же немного похожи.

  • Документация:GitHub.com/pan Джей И.А. Чен/…

  • Не продавайте его, замените npm i на cnpm i для загрузки зависимостей, вы можете решить проблему сбоя загрузки npm i

  • Установите cnpm:

  • npm install -g cnpm --registry=https://registry.npm.taobao.org
  • Конечно, его можно загрузить, но появляется другое сообщение об ошибке:

  • Это означает: версия fibers@4.0.2 слишком высокая, это может быть связано с версией узла, поэтому мое решение состоит в том, чтобы изменить «fibers»: «^3.0.2» package.json на 3.0.2 в проекте.


  • Теперь мы подходим к установке cnpm для загрузки


  • Очень хорошо, теперь он успешно загружен, вы можете запустить npm run serve, чтобы увидеть

  • Резюме: после загрузки проекта сначала npm i, затем cnpm i, а затем перейдите в package.json, чтобы изменить версию волокон на «3.0.2», после чего можно запустить npm run serve.


  • Теперь загрузка прошла успешно и операция тоже прошла успешно, но у eslint vue@3.0 код подтверждения включен, и он постоянно выдает, лично мне это выглядит немного неудобно, поэтому я решил его отключить.

  • Найдите файл .eslintrc.js и измените расширения на следующую конфигурацию:

'extends': [
     'eslint:recommended',
     'plugin:vue/recommended',
     // '@vue/standard',
     '@vue/typescript'
],


// @vue/standard, вы можете просто закомментировать это, не забудьте повторно запустить serve npm после его изменения


3. Изменяем интерфейс запроса на наш собственный интерфейс



  • Хорошо, давайте изменим интерфейс запроса, теперь попробуем авторизоваться

  • Результат очень даже нормально сообщить об ошибке, я уже давно к этому привык, посмотрим что не так


  • Первая ошибка Baidu: Переведите: «Функция данных должна возвращать объект», поскольку мы нажимаем кнопку входа, чтобы сообщить об ошибке, затем давайте посмотрим на событие, вызванное кнопкой входа: я пытаюсь закомментировать раздел маршрута перехода, как В результате об ошибке не сообщается, поэтому очевидно, что маршрут перехода неверен.

  • Страница находится в: src\views\login\index.vue


  • Страница находится по адресу: src\store\modules\user.ts


  • Вот также способ вставить код фонового узла


  • Примечание. После изменения конфигурации необходимо перезапуститьnpm run serve

4. Проект продолжает отправлять запросы http://localhost:8080/sockjs-node/info?t=1462183700002.

  • Эта библиотека оsockJs-nodeОшибка сообщается, потому что она не согласуется с адресом на стороне сервера, то есть адрес интерфейса неверный. В vue.config настройте хост и порт devServer так, чтобы они совпадали с адресом службы, запущенным проектом.
  • Этот адрес службы адресов должен совпадать с адресом запуска проекта;
    Если адрес записи hmr настроен через API webpackDevServer, по умолчанию используется адрес хоста в элементе конфигурации webpackDevServer.Если локальный хост по умолчанию не задан, два адреса отличаются.
  • Проблема, с которой я столкнулся, заключается в том, что в webpackDevServe не настроен хост, а проект запускается с 192.168.x.x, поэтому на самом деле localhost:8080/sockjs-node/info фактически не существует, поэтому он сообщит об ошибке Request failed
  • решение
  •  devServer: { 
        host: 'localhost',
        .......
    }

  • Добавление localhost не сообщит об ошибке
  • Если вы не можете решить ее, перейдите к:сегмент fault.com/please/101000000…

исходный адрес

nuggets.capable/post/684490…


Ссылаться на

vue-typescript-admin-template

Typescript+Vue крупномасштабная боевая система управления фоном:nuggets.capable/post/684490…  

Остановить tslint в vue-cli3:woo woo Краткое описание.com/fear/oh oh 78 не 9 wipe 2…

Когда проект запущен, он продолжает отправлять http://localhost:8080/sockjs-node/info?t=1462183700002 запросы:сегмент fault.com/please/101000000…