4. Common.js and/or vendor.js - Common.js will contains all common js files/libraries shared by modules like backform, backbone, underscore etc.
Entry points JS: main.js - It will load above modules ascynchronusly or it will be minified version of all.
define('', ['common', 'tools', 'browser', 'grid'], function(...) {});
or these modules can also be loaded using dependency; For example, load grid.js on database node expand.
Worked so far:
- Removed CodeMirror out of vendors directory and instead using node_modules/codemirror files. I didn't sent its patch as codemirror CSS is inserted directly into markup.
- The file grid.js(datagrid.js and sqleditor.js) is generated including all of its dependency, resolved all errors(dependency/JS errors) occurred while running in browser. Modules like explain, file manager, history tab and grid rendering is working except grid tool menu expand not working(will look into this).
- The file common.js is generated which contains JS files shared among modules.
- The template JS modules such as node.js, browser.js are not included in webpack since they are templates containing Jinja syntax, they are added as dependency and loaded dynamically.
As discussed with Ashesh, we need to determine which file is 'static' JS or dynamic JS as we cannot hardcode, till now I didn't find any way to use
is_template flag introduced in
def get_own_javascripts(self):
will search how can I use this variable.
Currently I am working on converting 'requirejs config shim dependency into webpack' using imports-loader and exports-loader which is taking time and will look for alternative if it doesn't works. Once dependency is properly defined, the task to generate other module JS will become quite easy.
I also found, the CSS imported using
import 'slickgrid/slick.grid.css'; statement is put into
<style></style> tags
in html
, instead must be loaded separately as a file so
overrides.css can work.
Thoughts?
Thanks,
Surinder