Unable to rebuild fork of your package

[scramatte]

Hello,

I'm building a visual form builder for Nova and I use your library. https://github.com/operativeit/nova-form-designer

I've been able to render fields but I'm unable to set field value without use "this.$refs."
What I've seen is most of Nova fields vue components looks like the following:

<template>
  <DefaultField
    :field="currentField"
    :errors="errors"
    :show-help-text="showHelpText"
    :full-width-content="fullWidthContent"
  >
    <template #field>
      <div class="space-y-1">
        <input
          v-bind="extraAttributes"
          class="w-full form-control form-input form-input-bordered"
          @input="handleChange"
          :value="value"
          :id="currentField.uniqueKey"
          :dusk="field.attribute"
          :disabled="currentlyIsReadonly"
          :maxlength="field.enforceMaxlength ? field.maxlength : -1"
        />

They use DefaultField as base component and they have :value="value" attribute but it doesn't works as expected because "value" prop is missing into DefaultField component.

I've fork your component to try to fix it but I'm unable to rebuild it. Pleae see the screenshot. Can you give me an hand? If my fix work I will make a PR.

Regards

[jmverges]

+1

[InfoSimoneGiusti]

I have the same problem too. @scramatte, were you able to solve it? Do you have any suggestions?

[InfoSimoneGiusti]

After conducting some research, I have found a solution. Follow the steps that I have taken to resolve the issue.

1. Fork the project.
2. Download the ZIP file.
3. Rename the unzipped folder to "NovaGridSystem."
4. Copy the "NovaGridSystem" folder into the root "nova-components" folder of the project.
5. Open the terminal and navigate to "{project_folder}/nova-components/NovaGridSystem."
6. Run the command npm i in the terminal.
7. If you run npm run dev now, you should have two issues:
   1. Module not found: Error: Can't resolve '@vue/compat/dist/vue.cjs.prod.'
   2. ModuleBuildError: Module build failed (from ./node_modules/postcss-loader/dist/cjs.js).
8. To solve the first problem, open the file "nova-components/NovaGridSystem/resources/js/tool.js" and change the first line from const Vue = require("@vue/compat/dist/vue.cjs.prod"); to const Vue = require("vue");.
9. To solve the second problem, create a new file in the root module directory named "postcss.config.js." Inside this file, add the following code:

   module.exports = {
   plugins: [
       require('autoprefixer'),
   ],
   };

10. Retry npm run dev. It should now work without errors.
11. For use a local version of "NovaGridSystem" instead of the version installed from Composer, open your "composer.json" file in the root of your Nova project. In the "repositories" section, add a local repository entry, for example:

    "0": {
    "type": "path",
    "url": "./nova-components/NovaGridSystem"
    }

12. In the "require" section of the same "composer.json" file, add: "codenco-dev/nova-grid-system": "@dev".
13. Run composer install in the root of your Nova project.
14. Enjoy using your local version.

While I may consider making a pull request to the original package to fix the issue, I currently don't have the time to test if the same solution would work even with different package versions.

PS: After recompiling Vue files using npm run dev, issues related to the hide() and show() logic (#29 and #27) should be resolved. I think that these bugs will always be resolved. However, in the repository installed with Composer requiring the distribution version of "tool.js," it might not get updated.

I hope this guide proves helpful to you all.

[scramatte]

Hi,

I've been able to rebuild the package, but I'm unable to use it in my project. When I exec "composer install" , it still download the original source instead use the local one

What I've missed?

Regards

[InfoSimoneGiusti]

Hi @scramatte,

you should remove the original source from composer.json and keep only the local one.

[scramatte]

Hi,

I get it working and by the way, I've resolved the issue with displayUsing see bug #31 When I get sometime, I will commit the changes.

Regards

[Thorazine]

This repo looks dead. This will do the trick: https://github.com/outl1ne/nova-grid