add vue 3 with laravel spa as an application using IIS

Viewed 17

I have a spa app (vue 3 + laravel 9) and I want to configure IIS in windows 10 to make it work.

I want to configure with alias using the same IP. In IIS manager from Default Web Site -> right click -> add application.

I set the Alias: myproject and physical path C:\www\myProject\public

Entering http://127.0.0.1/myproject/ the resources are not loaded ... because of the mix

<link href="{{ mix('/css/app.css') }}" rel="stylesheet">
<script src="{{ mix('/js/manifest.js') }}" defer></script>
<script src="{{ mix('/js/vendor.js') }}" defer></script>
<script src="{{ mix('/js/app.js') }}" defer></script>

it loads by default ex: http://127.0.0.1/css/app.css

I have created the entry for mix_url in config/app.php

'mix_url' => env('MIX_ASSET_URL', null)

and in .env

MIX_ASSET_URL=http://127.0.0.1/myproject

the APP_URL is the same

APP_URL=http://127.0.0.1/myproject
MIX_APP_URL=http://127.0.0.1/myproject

Webpack.js file is this:

mix.js('resources/js/app.js', 'public/js')
.extract()
.vue({ version: 3} )
.sass('resources/sass/app.scss', 'public/css')
.version();

and the for each component I load separate chunk file

path: '/login',
name: 'Login',
component: () => import(/* webpackChunkName: "login" */ '../views/auth/Login.vue')

I have build the assets again and now it loads the resources (from app.blade.php with mix) ... but it does not load the login.js ...

It complains about:

[Vue Router warn]: uncaught error during route navigation: ChunkLoadError: Loading chunk login failed......

I have tried:

  1. changing the base url in vue-router from history: createWebHistory('/') to history: createWebHistory(process.env.MIX_APP_URL)

but the same thing.

Any idea what to be changed in order to make the changes from the base url http://127.0.0.1 to the base url http://127.0.0.1/myproject ... so all the request to be made from the new base url ?

0 Answers
Related