1. #1
    Sencha Premium Member
    Join Date
    Jun 2012
    Location
    Boston, MA
    Posts
    44
    Vote Rating
    3
    Answers
    3
    chrisfarrell is on a distinguished road

      0  

    Default Answered: Shared components in common directory of workspace

    Answered: Shared components in common directory of workspace


    I have a growing workspace with multiple Ext applications, and it feels like we should move some common components to the 'workspace/common/src' directory so they can be reused.

    I have made an attempt at doing this with one View and its Controller. I've got it working statically but it won't compile, and I am not feeling good about it. Even with the viewing the app without compiling I have couple of console errors. So, I'm approaching this wrong, any advice would be most appreciated!

    My workspace sencha.cfg includes
    workspace.classpath=${workspace.dir}/common/src

    So, in an experimental repo I moved
    'workspace/appName/app/controller/HeaderController.js'
    to
    'workspace/common/src/controller/HeaderController.js'

    I redefined that file from
    'AppName.controller.HeaderController'
    to
    'ProductName.controller.HeaderController'

    I did a similar process with the view.

    My app.js, having an array of controllers, this one included, didn't like this.
    So, I put a stub controller back in the app with original definition, but extending the new common controller.

    I found references in bootstrap.js for both the view and controller definitions and manually modified them. I also modified the Viewport.js requires to include the new view. I think that's the extent of it.

    I'm getting 2 console errors, one for each file: 'Uncaught SyntaxError: Unexpected Token >'
    There errors are a result of ext-all-dev.js trying to load the files at paths that don't exist, akin to:
    http://localhost:6543/static/js/work...?_dc=136809348

    I'm not sure why that's happening, but it alerts me that I must be doing this wrong. What is the correct way? Please feel free to ask for more info if I haven't provided enough.

    Lastly, when I try to compile, I get this error:
    "failed to find meta class definition for name AppName.view.HeaderView"

    Which is bizarre to me, because I no longer have this defined anywhere. I changed it to ProductName.view.HeaderView and changed all references in the workspace. The only thing I can think of is that the ProductName.controller.HeaderController lists ['HeaderView'] without specifying namespace and so maybe the controller subclass of that is trying to resolve it to AppName.view. I'm not sure.

    Thank you kindly!

  2. not sure if what I am doing is "correct" or will cause me grief in some TBD regard, but, my static console errors are gone and I am able to compile.

    I found a couple of other threads that lead me in the right direction.

    In sum I:

    Extended the shared components in my app.
    For the shared HeaderController, I removed views:['HeaderView'], and moved that to the app's HeaderController extension.

    I added a paths: [] to my Ext.Loader.setConfig(), and pointed to my shared code.

    Code:
    Ext.Loader.setConfig({
        enabled: true,
        paths:{
            'ProductName' : '../common/src/ProductName'
        },
    
    });
    My directory structure of common is:

    workspace/
    app/
    common/
    src/
    ProductName/
    controller/
    view/
    I made sure both the workspace and app sencha.cfg have the common src path.
    I think that's it.
    I don't seem to need to require the shared components in app.js. Maybe I'm just getting lucky, or maybe because I am extending them i don't need to... not sure.

  3. #2
    Sencha Premium Member
    Join Date
    Jun 2012
    Location
    Boston, MA
    Posts
    44
    Vote Rating
    3
    Answers
    3
    chrisfarrell is on a distinguished road

      0  

    Default I think I solved this for myself

    I think I solved this for myself


    not sure if what I am doing is "correct" or will cause me grief in some TBD regard, but, my static console errors are gone and I am able to compile.

    I found a couple of other threads that lead me in the right direction.

    In sum I:

    Extended the shared components in my app.
    For the shared HeaderController, I removed views:['HeaderView'], and moved that to the app's HeaderController extension.

    I added a paths: [] to my Ext.Loader.setConfig(), and pointed to my shared code.

    Code:
    Ext.Loader.setConfig({
        enabled: true,
        paths:{
            'ProductName' : '../common/src/ProductName'
        },
    
    });
    My directory structure of common is:

    workspace/
    app/
    common/
    src/
    ProductName/
    controller/
    view/
    I made sure both the workspace and app sencha.cfg have the common src path.
    I think that's it.
    I don't seem to need to require the shared components in app.js. Maybe I'm just getting lucky, or maybe because I am extending them i don't need to... not sure.

Tags for this Thread