2

пишу приложение на Vue.js исользую vue cli, на Дев сервере ошибок нет, но после сборки белый экран, перечитал кучу статей, пробовал методы разные та-же ситуация.

// vue.config.js
module.exports = {
    publicPath: ''
}

Что нужно вписать чтоб заработал Vue собраный?

{
  "name": "name",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "axios": "^0.21.1",
    "core-js": "^3.6.5",
    "vue": "^2.6.11",
    "vue-router": "^3.5.1"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "~4.vue --version.0",
    "@vue/cli-plugin-eslint": "~4.5.0",
    "@vue/cli-service": "~4.5.0",
    "babel-eslint": "^10.1.0",
    "eslint": "^6.7.2",
    "eslint-plugin-vue": "^6.2.2",
    "vue-template-compiler": "^2.6.11"
  },
  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/essential",
      "eslint:recommended"
    ],
    "parserOptions": {
      "parser": "babel-eslint"
    },
    "rules": {}
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not dead"
  ]
}
2
  • Посмотрите в браузере запрашивается ли ваш app.js
    – Adrug
    27 мар 2021 в 10:39
  • Та же самая ерунда( Посмотреть удается через serve -s dist, а при загрузке на гитхаб пусто( 1 июл 2021 в 12:45

1 ответ 1

0

Вы вероятно пытаетесь запустить файл dist/index.html напрямую. В руководстве Vue-cli есть информация по этому поводу:

Каталог dist предназначен для обслуживания HTTP-сервером (если не задали publicPath относительным значением), поэтому не сработает если напрямую открыть dist/index.html через file:// протокол. Самый простой способ предпросмотра вашей сборки для production локально — использовать статический файловый сервер Node.js, например serve:

npm install -g serve
# флаг -s означает запуск serve в режиме одностраничного приложения (SPA)
# который решает проблему маршрутизации, описанную ниже
serve -s dist

Таким образом, исходя из того, что ваш проект успешно собран (успешно выполнена команда build в Vue-cli), установите пакет serve (флаг -g означает, что пакет будет установлен глобально и может быть использован вами в любом вашем проекте для локального предпросмотра):

npm install -g serve

И находясь в корневой директории вашего проекта, запустите локальный предпросмотр используя команду:

serve -s dist

Если эти два условия выполнены правильно, вы должны в вашем терминале, где запускали вышеуказанные команды, увидеть отчет о том, на каком хосте и порте запущен предпросмотр. Скопируйте URL и вставьте в адресную строку браузера, чтобы просмотреть работу вашего проекта.

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.