new project implementation #49

YamidCano · 2021-07-22T03:47:06Z

YamidCano
Jul 22, 2021

Thanks for sharing this great package.
I am trying to implement in a new project but I am not layered, I am a little newbie to laravel.
Could it be that you don't have a video or repository already implemented to see what I'm doing wrong?

tailwind.config.js

const defaultTheme = require('tailwindcss/defaultTheme');

module.exports = {
    mode: 'jit',
    presets: [
        ...
        require('./vendor/ph7jack/wireui/tailwind.config.js')
    ],

    purge: [
        './vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php',
        './vendor/laravel/jetstream/**/*.blade.php',
        './storage/framework/views/*.php',
        './resources/views/**/*.blade.php',
        './vendor/ph7jack/wireui/resources/**/*.blade.php',
        './vendor/ph7jack/wireui/ts/**/*.ts',
        './vendor/ph7jack/wireui/src/View/**/*.php',
    ],

    theme: {
        extend: {
            fontFamily: {
                sans: ['Nunito', ...defaultTheme.fontFamily.sans],
            },
        },
    },

    variants: {
        extend: {
            opacity: ['disabled'],
        },
    },

    plugins: [require('@tailwindcss/forms'), require('@tailwindcss/typography')],
};

app.blade.php

<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <meta name="csrf-token" content="{{ csrf_token() }}">

        <title>{{ config('app.name', 'Laravel') }}</title>

        <!-- Fonts -->
        <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap">

        <!-- Styles -->
        <link rel="stylesheet" href="{{ mix('css/app.css') }}">

        @livewireStyles

        <!-- Scripts -->
        <script src="{{ mix('js/app.js') }}" defer></script>
        <wireui:scripts />@wireUiScripts
        <script src="alpine.js"></script>
    </head>
    <body class="font-sans antialiased">
        <x-jet-banner />

        <div class="min-h-screen bg-gray-100">
            @livewire('navigation-menu')

            <!-- Page Heading -->
            @if (isset($header))
                <header class="bg-white shadow">
                    <div class="px-4 py-6 mx-auto max-w-7xl sm:px-6 lg:px-8">
                        {{ $header }}
                    </div>
                </header>
            @endif

            <!-- Page Content -->
            <main>
                {{ $slot }}
            </main>
        </div>

        @stack('modals')

        @livewireScripts
    </body>
</html>

When trying to use a component it does not work for me.
I appreciate if you help this newbie :) jejeje

PH7-Jack · 2021-07-22T05:26:38Z

PH7-Jack
Jul 22, 2021
Maintainer

Hello @YamidCano, thanks.

I created this repository as example, https://github.com/PH7-Jack/wireui-jetstream-starter-kit

I liked your idea and I will make a video on how to implement it in a new project or an existing one

You must use one of the script tag <wireui:scripts /> or @wireUiScripts

2 replies

YamidCano Jul 22, 2021
Author

Hi thanks.
If indeed there are no videos which I would also like to make, I like your project and I will make the most of it.

YamidCano Jul 27, 2021
Author

@PH7-Jack You already made the video, there is something that does not fit me yet and I would like to see what I am doing wrong.

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

new project implementation #49

{{title}}

{{editor}}'s edit

{{editor}}'s edit

Replies: 1 comment 2 replies

{{title}}

{{title}}

{{title}}

Select a reply

new project implementation #49

YamidCano Jul 22, 2021

Replies: 1 comment · 2 replies

PH7-Jack Jul 22, 2021 Maintainer

YamidCano Jul 22, 2021 Author

YamidCano Jul 27, 2021 Author

YamidCano
Jul 22, 2021

Replies: 1 comment 2 replies

PH7-Jack
Jul 22, 2021
Maintainer

YamidCano Jul 22, 2021
Author

YamidCano Jul 27, 2021
Author