@Lupestro wrote:
Hi folks,
This last week, we were forced to seek an alternative (temporarily for an imminent release) to
ember-table
for the one place we were using it in our app and fell back to usingslickgrid
.We got a complete replacement table component (with some enhancements) coded and tested in about three days, but as we started development, we set aside using
ember-auto-import
for the task and usedapp.import
instead. Thepackage.json
forslickgrid
specifiesjquery
andjquery-ui
as dependencies andslick.core
as the main, soember-auto-import
dealt with those just fine. However, doing what we needed required loading modules provided in the package but whose role is not mentioned in the npm package manifest. While developing with a hot deadline, we fell back on app.import, which we knew would work:let app = new EmberApp(defaults, { 'ember-cli-babel': { includePolyfill: true }, sassOptions: { onlyInclude: true }, autoImport: { exclude: ['slickgrid'], } // Add options here }); app.import('node_modules/slickgrid/lib/jquery-3.1.0.js', {using: [{transformation: 'fastbootShim'}]}); app.import('node_modules/slickgrid/lib/jquery-ui-1.11.3.js', {using: [{transformation: 'fastbootShim'}]}); app.import('node_modules/slickgrid/lib/jquery.event.drag-2.3.0.js', {using: [{transformation: 'fastbootShim'}]}); app.import('node_modules/slickgrid/slick.core.js', {using: [{transformation: 'fastbootShim'}]}); app.import('node_modules/slickgrid/plugins/slick.rowselectionmodel.js', {using: [{transformation: 'fastbootShim'}]}); app.import('node_modules/slickgrid/slick.grid.js', {using: [{transformation: 'fastbootShim'}]}); app.import('node_modules/slickgrid/slick.dataview.js', {using: [{transformation: 'fastbootShim'}]}); app.import('node_modules/slickgrid/slick.grid.css', {using: [{transformation: 'fastbootShim'}]});
This works, and let us complete the development.
slickgrid
contributes theSlick
global to the browser environment. As best I can tell, it doesn’t provide anything like ES6, AMD, CommonJS, or UMD modules to keep it out of the global namespace. The app must load a JavaScript file for each feature that it uses, files with names likeslick.grid.js
andslick.data.js
. Each of the JS files adds some property underSlick
.Is there some way to use ember-auto-import to tame a beast like this one, or is what we did the best solution available?
Aside:
Since someone will ask, our ember-table issues related primarily to display glitches in IE11 and Edge and load performance overall, but especially in IE11 and Edge.
slickgrid
is blazingly fast and has few issues with supported browsers. We’ve been using it for five years across all our tools, and our customers are used to what it provides, so any component we use must meet those expectations. We will return toember-table
when we have time to address those issues, as I still really want a modern “pure ember” solution but, for mid-February, it isn’t likely to deliver all that we get fromslickgrid
, and we had to “fish or cut bait”.
Posts: 1
Participants: 1