Search code examples
javascriptsymfonyrequirejsorocrmorocommerce

I am trying to add my own js file to orocommerce using requirejs but did not work


I created inside myBundle/Resources/config/requirejs.yml file set the following options:

config:
shim:
    'jquery-ui':
        deps:
            - 'jquery'
    'underscore':
        exports: '_'
    'backbone':
        deps:
            - 'underscore'
            - 'jquery'
        exports: 'Backbone'
paths:
    'jquery': '../js/layout/my_theme/js/jquery-3.2.1.min.js'
    'jquery-ui': 'bundles/oroui/lib/jquery-ui.js'
    'bootstrap': 'bundles/oroui/lib/bootstrap.js'
    '../js/layout/my_theme/js/scripts.js': '../js/layout/my_theme/js/scripts.js'

and run this command: php app/console oro:requirejs:build

and the build command create oro.min.js inside my theme folder and i included this fild inside my theme but i can not see my js functions in oro.min.js file.

what am i missing?


Solution

  • First of all, what version of OroCommerce are you use? In 1.3 we have config files for the whole application(admin+frontend) and only for frontend.

    You change config file placed in "/Resources/config/requirejs.yml" - this is whole application config and it will be built into "web/js/oro.min.js" file, not in your theme file.

    Frontend config stored into "/Resources/views/layouts/{your_theme}/config/requirejs.yml". Scripts from this config will be built into "oro.min.js" in your theme.

    I asked you about OroCommerce version - in 1.3 we generate "oro.min.js" for each theme but we don't use it. On both admin and frontend we use /web/js/oro.min.js file.

    In 1.4 we will use "/Resources/config/requirejs.yml" files for admin and "/Resources/views/layouts/{your_theme}/config/requirejs.yml" for your theme on frontend.

    So, check please your scripts into "web/js/oro.min.js" and change configuration paths from

    '../js/layout/my_theme/js/scripts.js': '../js/layout/my_theme/js/scripts.js'
    

    to

    '{mybundle}/js/layout/my_theme/js/scripts.js': '/bundles/{mybundle}/js/layout/my_theme/js/scripts.js'
    

    where {mybundle} is a public folder of your bundle(company name + bundle name), you should see this folder inside "/web/bundles/" after "php app/console assetic:dump" command.