iliyaZelenko / laravel5.7-vue-cli3-boilerplate

Boilerplate / Starter kit. Laravel 5.7, Vue CLI 3 — Authentication with Email Verification. REST API.
54 stars 21 forks source link

Настройки? settings? #2

Closed DKWLB closed 5 years ago

DKWLB commented 5 years ago

Наверное я в ночи уже совсем закопался. Edit .env to set your database connection details and FRONTEND_URL, APP_URL Edit .env to set your VUE_APP_BACKEND(backend url)

Вот совсем не понимаю как связать воедино.

php artisan serve запустить localhost:8000 если запустить npm run serve то порт будет по дефолту 8081 скажем.

Но у меня задача сделать все на едином домене. Поэтому на Ваш проект и забрел. Подскажите, пожалуйста на пальцах какие настройки выставить в .env файлах.

FRONTEND_URL = http://localhost:8081 APP_URL = http://localhost:8000

создаю вручную .env в папке frontend и прописываю VUE_APP_BACKEND = "http://localhost:8000" ?

Был бы признателен за содействие

и какой сервер запускать тогда в итоге, чтоб срабатывал hot reload?

iliyaZelenko commented 5 years ago

Вам нужно чтобы чтобы порт был один и тот же? Например, чтобы frontend и backend (api) были по адресу http://localhost:8000? Есть решение.

Как видите есть вот такой route на сервере Laravel. Он значит: любые маршруты, кроме тех что начинаются с api. Это маршрут отвечает за отображение production frontend. Перейдя в контроллер вы можете увидеть что там указана такая view.

Этот view генерируется через frontend, для этого нужно запустить: npm run build. Вот что я писал в описании:

You can open your finished build via laravel SpaController! The index file in app/resorces/views/index.blade.php content is generated via vue! Your css, js, img, etc... will be added to the app/public folder!

Вам нужно открыть frontend через ваш Laravel сервер (e.g. http://localhost:8000), и у вас откроется статический сайт (spa) который берет ресурсы из app/public/ и работает с api Laravel. Для работы api не забудьте указать VUE_APP_BACKEND на адрес сервера Laravel.

Чтобы разрабатывать frontend в режиме HMR вам нужно запустить npm run serve, создастся сервер со своим адресом. По сути обычно вам придется менять только FRONTEND_URL если допустим вы разрабатывали frontentd на HMR, а потом решили запустить production версию сайта зайдя на адрес Laravel (e.g. http://localhost:8000) и наоборот, чтобы обратно перейти на HMR нужно будет просто поменять FRONTEND_URL.

Если интересно почему нужно указывать FRONTEND_URL в laravel:

https://github.com/iliyaZelenko/laravel5.7-vue-cli3-boilerplate/blob/a7bed26a1356e49b3a8e9b0c610b5b7e0882e080/app/Notifications/VerifyEmail.php#L26

Надеюсь теперь вы лучше поняли что как настраивать, это может реально запутать.

iliyaZelenko commented 5 years ago

Looks like I provided a non-correct .env.example, here is the correct one.

I also updated the description to make it more clear: https://github.com/iliyaZelenko/laravel5.7-vue-cli3-boilerplate/commit/c1611235cb7d57a6111724b85915c2d31b9c9e47

DKWLB commented 5 years ago

Да, большое спасибо. Пока ожидал ответа все настроил, заработало. Локальную задачу решил. Ckeditor с elfinder заработали. Сделал один раз build и эта связка работает как нужно, а дальше продолжаю разработку уже в режиме serve.

Единственное - добавьте в readme, что после установки вашего проекта - необходимо сделать php artisan key:generate и php artisan jwt:secret - иначе авторизация не срабатывает. И я отключаю эти lint проверки - у вас также ругается при сборке на разные отступы и т.д.(

DKWLB commented 5 years ago

Looks like I provided a non-correct .env.example, here is the correct one.

I also updated the description to make it more clear: c161123

sorry for some more comments, but this project and your post i've found at night were really helpful.

Please add to readme or .env - that the user must provide correct mail settings. Cause the app sends the verification email. Hope this will help also. Good luck and thanks again

iliyaZelenko commented 5 years ago

Единственное - добавьте в readme, что после установки вашего проекта - необходимо сделать php artisan key:generate и php artisan jwt:secret - иначе авторизация не срабатывает.

Good point, I really forgot to write it!

И я отключаю эти lint проверки - у вас также ругается при сборке на разные отступы и т.д.(

It cursed the code that has already been written or that you yourself wrote?

If you want rules for a different style of code then you can change the settings here by removing @vue/standard. Let's say you like to put dots with commas and do not like spaces next to functions: @vue/eslint-config-airbnb will suit you. But here the problem is that all the code is already written on a different style (standard), you have to perform the correction of all errors, well, that it can be done automatically.

In any case, glad that you are using my project!

But remember, this is a regular spa, it will have bad seo, in order to fix this you need to use server-rendering, a good option is Nuxt.js. I have the same authorization on Nuxt, I will be glad to share if you are interested.