Shared components in common directory of workspace

[chrisfarrell]

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!

[chrisfarrell]

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.

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.