mauriciolanner's avatar

Inertia/vue tokens with mix error on xampp

Hello guys! I'm using laravel 8 with inertia and vue. They are having two problems when I put them in xampp. The first mistake is in the mix. If I use in app.blade the mix() shows the following error in the console: 'GET https://192.168.254.74/css/app.css net::ERR_ABORTED 404 (Not Found)' That is, it does not recognize my folder in xampp /folder. To solve this problem I changed the mix() to asset() and it worked with another error. The route in the browser was https://192.168.254.74/bomixsam/bomixsam/login i.e. doubled the project root folder. '/bomixsam/bomixsam/'

my webPack

const mix = require('laravel-mix');

const path = require('path');

mix.webpackConfig({ resolve: { alias: { ziggy: path.resolve('vendor/tightenco/ziggy/dist'), }, }, });

mix.js('resources/js/app.js', 'public/js').vue() .sass('resources/sass/app.scss', 'public/css') .webpackConfig(require('./webpack.config'));

if (mix.inProduction()) { mix.version(); }

my atual app.blade:

<!-- Styles -->
<link rel="stylesheet" href="{{ asset('css/app.css') }}">
<link rel="stylesheet" href="{{ asset('css/myStyle.css') }}">
<link rel="stylesheet" href="{{ asset('css/timeline.css') }}">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/nprogress/0.2.0/nprogress.min.css" />
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAxCTIgDEMja1Xda05djDewVM6hZae5zTI"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css">
<!-- Scripts -->
@routes
<script src=" https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.26.0/moment.min.js"></script>
<script src="{{ asset('js/app.js') }}" defer></script>
@inertia 
@env ('local')

Sorry for the english, i'm brazilian and i use google translator.

0 likes
8 replies
jlrdw's avatar

Xampp would have nothing to do with this as it's no different from a independent install of PHP, and mysql, etc.

The question would be do you have laravel setup correctly pointing to public as the document root.

mauriciolanner's avatar

@jlrdw When I run php artisan serve everything works fine. My .htacess is configured like this:

Options -MultiViews 
RewriteEngine On

RewriteCond %{REQUEST_FILENAME} -d [OR]
RewriteCond %{REQUEST_FILENAME} -f
RewriteRule ^ ^ [N]

RewriteCond %{REQUEST_URI} (\.\w+$) [NC]
RewriteRule ^(.*)$ public/



RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^ server.php
mauriciolanner's avatar

this is the first application I use inertia and the others all work normally with this configuration

jlrdw's avatar

@mauriciolanner if you have XAMPP, it comes with Apache, why aren't you using Apache is what I meant? If you just want artisan serve just use the zip versions of php and mariadb. / mysql.

But in Apache you need to setup a virtual host and properly serve Laravel.

Edit:

I suggest you try Nginx.

mauriciolanner's avatar

@jlrdw I'm trying to run it on xampp, windows server. Do you have any tutorial or video that shows how to do this in xamp? I can't find any that show the settings for Inertia/vue

jlrdw's avatar

@mauriciolanner Again Xampp has nothing to do with it, you basically have Apache, Mariadb, and PHP install, no different if you had installed the packages themselves.

To setup a virtual host, there are many existing tutorials already. As example my host file is:

# Copyright (c) 1993-2009 Microsoft Corp.
#
# This is a sample HOSTS file used by Microsoft TCP/IP for Windows.
#
# This file contains the mappings of IP addresses to host names. Each
# entry should be kept on an individual line. The IP address should
# be placed in the first column followed by the corresponding host name.
# The IP address and the host name should be separated by at least one
# space.
#
# Additionally, comments (such as these) may be inserted on individual
# lines or following the machine name denoted by a '#' symbol.
#
# For example:
#
#      102.54.94.97     rhino.acme.com          # source server
#       38.25.63.10     x.acme.com              # x client host

# localhost name resolution is handled within DNS itself.
#	127.0.0.1       localhost
#	::1             localhost
	127.0.0.1       laravel.local

And there are plenty example of how to setup the apache conf for VH such as:

https://httpd.apache.org/docs/2.4/vhosts/examples.html

Please or to participate in this conversation.