Problem loading/booting a custom fieldtypes - Component […] does not exist.

I’m trying to register a custom fieldtypes for the control panel.

This is a step by step of what I did.

php please support:details 
  • Statamic 3.1.32 Pro
  • Laravel 8.52.0
  • PHP 7.4.21
  1. Run the command
php please make:fieldtype FormSection
  1. Adding the code in AppServiceProvider.php
public function boot()
    {
        Statamic::script('app', 'cp');
    }
  1. Adding script in webpack.mix.js
Mix..js('resources/js/statamic/cp.js', 'public/vendor/app/js')
  1. Creating the js file in resources/js/statamic/cp.js
import Fieldtype from '../components/fieldtypes/FormSection';
Statamic.$components.register('form_section-fieldtype', Fieldtype);
  1. Adding a very basic vue component
<template>
    <div>
        <text-input :value="value" @input="update" />
    </div>
</template>

...script tag
export default {
    mixins: [Fieldtype],
    data() {
        return {
            "test": "Simon Bédard",
        };
    }
};
...Closing script tag

At this point the field is visible in the in the blueprint.

When added to a blueprint, I get:

Component […] does not exist.
  1. I validate that the cp.js was loaded in the chrome DevTools. The cp.js is loaded correctly.

I have no errors in the console.

  1. I tried to add a simple console.log to see if I was passing in the cp.js file
import Fieldtype from '../components/fieldtypes/FormSection';
Console.log(‘Passing here’);
Statamic.$components.register('form_section-fieldtype', Fieldtype);

Unfortunately, nothing append.

Maybe I’m missing something ?

Thanks Simon

>>>>>>> Unanswered <<<<<<<
6 Replies
3 Followers