1. Home
2. javascript - Why Symfony UX (Dropzone) packages don't include JS scripts?

739 votes

0 answers

javascript - Why Symfony UX (Dropzone) packages don't include JS scripts?

Get the solution ↓↓↓

I'm currently testing the new Symfony UX Dropzone and after a few hours of research I still have one question left to answer: Why don't UX packages include JS scripts? - how is Symfony supposed to includedropzone(.min).js for example ?

Currently for the code to work I have to:

1. Download thedropzone.js file from the official website.
2. Place the file under/assets/dropzone/dropzone.js
3. Add to theassets/app.js file the linewindow.Dropzone = require('./dropzone/dist/dropzone.js');

I started by creating a new project and then installing Dropzone as follows:

symfony composer req ux-dropzone
npm install
npm run build
Copy code

/src/Form/FormType.php

public function buildForm(FormBuilderInterface $builder, array $options)
{
    $builder
        ->add('file', DropzoneType::class)
    ;
}
Copy code

/src/templates/base.html.twig

{% block stylesheets %}
    {{ encore_entry_link_tags('app') }}
{% endblock %}
{% block javascripts %}
    {{ encore_entry_script_tags('app') }}
{% endblock %}
Copy code

/assets/app.js

import './styles/app.css';

window.Dropzone = require('./dropzone/dropzone.js');

// start the Stimulus application
import './bootstrap';
Copy code

Without this manual import of thedropzone(.min).js file the variablewindow.Dropzone is not initialized.

I found a similar topic here, however it seems that in this case the installation of the package created the file/node_modules/ux-dropzone/dist/min/dropzone.min.js. But in my case here is the generated tree structure:

Is this the right way to proceed?

Wishing you a good day :)

Undefined asked

2021-12-5

Write your answer

---

Share solution ↓

Additional Information:

Date the issue was resolved:

2021-12-5

Link To Source
Link To Answer People are also looking for solutions of the problem: installation failed, reverting ./composer.json and ./composer.lock to their original content.

Didn't find the answer?

Our community is visited by hundreds of web development professionals every day. Ask your question and get a quick answer for free.

Ask a Question

---

Similar questions

Find the answer in similar questions on our website.

37 php - In a Twig template {{0 in ['a', 'b', '99']}} returns 1. WHY?

163 PHP + SQL - Using SQL Server 'Create To' scripts to create tables through PHP

294 How to check whether $_GET['id'] is set and it's not empty using php

884 php - DOMDocument need to search for an element that has attribute class="something"

304 jquery - execute php/javascript function after a certain amount of time has passed

940 javascript - Can't read big pdf file with XMLHttpRequest

846 authentication - php password protected website

317 php - Getting "Call to undefined function: 'define': in phalanger web site

507 php - Why does $_SERVER['HTTP_REFERER'] still show original referrer?

367 php - WooCommerce: Custom function adding free product - Cart page getting broken for orders up to 3000

Write quick answer

Do you know the answer to this question? Write a quick response to it. With your help, we will make our community stronger.

About the technologies asked in this question

PHP

PHP (from the English Hypertext Preprocessor - hypertext preprocessor) is a scripting programming language for developing web applications. Supported by most hosting providers, it is one of the most popular tools for creating dynamic websites. The PHP scripting language has gained wide popularity due to its processing speed, simplicity, cross-platform, functionality and distribution of source codes under its own license.
https://www.php.net/

Symfony

Symfony compares favorably with other PHP frameworks in terms of reliability and maturity. This framework appeared a long time ago, in 2005, that is, it has existed much longer than most of the other tools we are considering. It is popular for its web standards compliance and PHP design patterns.
https://symfony.com/

JavaScript

JavaScript is a multi-paradigm language that supports event-driven, functional, and mandatory (including object-oriented and prototype-based) programming types. Originally JavaScript was only used on the client side. JavaScript is now still used as a server-side programming language. To summarize, we can say that JavaScript is the language of the Internet.
https://www.javascript.com/

CSS

CSS (Cascading Style Sheets) is a formal language for describing the appearance of a document written using a markup language. It is mainly used as a means of describing, decorating the appearance of web pages written using HTML and XHTML markup languages, but can also be applied to any XML documents, such as SVG or XUL.
https://www.w3.org/TR/CSS/#css

Bootstrap

Bootstrap is not exclusively a CSS framework, but its most popular features are CSS-centric. These include a powerful grid, icons, buttons, map components, navigation bars, and more.
https://getbootstrap.com/

HTML

HTML (English "hyper text markup language" - hypertext markup language) is a special markup language that is used to create sites on the Internet. Browsers understand html perfectly and can interpret it in an understandable way. In general, any page on the site is html-code, which the browser translates into a user-friendly form. By the way, the code of any page is available to everyone.
https://www.w3.org/html/