Laravel mix and vite

https://blog.yuyansoftware.com.tw/2022/12/laravel-vite/
按照laravel 文档Installing Laravel Breeze 操作时，会遇到各种问题，这里简单做下总结

使用mix打包

• 创建database.sqlite

cd database
sqlite3
.open database.sqlite

• 修改 resources/views/app.blade.php

        <!-- @vite('resources/js/app.js') -->
        <link rel="stylesheet" href="{{ asset('css/app.css') }}">
        <script src="{{ asset('js/app.js') }}" defer></script>

• 修改 webpack.mix.js

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

/*
 |--------------------------------------------------------------------------
 | Mix Asset Management
 |--------------------------------------------------------------------------
 |
 | Mix provides a clean, fluent API for defining some Webpack build steps
 | for your Laravel applications. By default, we are compiling the CSS
 | file for the application as well as bundling up all the JS files.
 |
 */

mix.js('resources/js/app.js', 'public/js')
    .webpackConfig({resolve: {alias: {'@': path.resolve(__dirname, 'resources/js/')}}})
    .vue()
    .postCss('resources/css/app.css', 'public/css', [
        //
    ]);

添加了webpackConfig() 和 vue()的调用，以及const path = require('path');

• 修改 resources/js/app.js

//注释掉这个引用
// import { resolvePageComponent } from 'laravel-vite-plugin/inertia-helpers';
//下面的代码需要修改下
createInertiaApp({
    title: (title) => `${title} - ${appName}`,
    //注释掉这句
    // resolve: (name) => resolvePageComponent(`./Pages/${name}.vue`, import.meta.glob('./Pages/**/*.vue')),
    //添加这句
    resolve: (name) => require(`./Pages/${name}.vue`),
    setup({ el, app, props, plugin }) {
        return createApp({ render: () => h(app, props) })
            .use(plugin)
            .use(ZiggyVue, Ziggy)
            .mount(el);
    },
});

修改好后运行完 npm run dev，就可以看到登录和注册入口了

使用vite打包

• 创建database.sqlite

cd database
sqlite3
.open database.sqlite

注意升级php版本，越新