ractive-datatable icon indicating copy to clipboard operation
ractive-datatable copied to clipboard

module error when trying to include

Open martypdx opened this issue 10 years ago • 9 comments

Can't require this because inclusion of require('styles.styl') doesn't work (I'm not using webpack).

Doesn't seem like dev dependencies should be necessary for runtime use :)

Cannot find module '!!./../node_modules/css-loader/index.js!./../node_modules/stylus-loader/index.js!./styles.styl' from '/Users/marty/cardsmith/app/node_modules/ractive-datatable'
Error: Cannot find module '!!./../node_modules/css-loader/index.js!./../node_modules/stylus-loader/index.js!./styles.styl' from '/Users/marty/cardsmith/app/node_modules/ractive-datatable'
    at /Users/marty/cardsmith/app/node_modules/gobble-
...

martypdx avatar Sep 02 '15 21:09 martypdx

Ah hmm, so the built version has the styles included in the javascript, but the source version uses stylus-loader to compile that shiz. Is there a stylus-loader equivalent for gobble?

sarendipitee avatar Sep 02 '15 21:09 sarendipitee

Looks like maybe it's the hot-loader code at L437:

        if(!content.placeholders) {
            module.hot.accept("!!./../node_modules/css-loader/index.js!./../node_modules/stylus-loader/index.js!./styles.styl", function() {
                var newContent = require("!!./../node_modules/css-loader/index.js!./../node_modules/stylus-loader/index.js!./styles.styl");
                if(typeof newContent === 'string') newContent = [[module.id, newContent, '']];
                update(newContent);
            });
        }

martypdx avatar Sep 02 '15 22:09 martypdx

@martypdx I've been making a lot of components lately and I want them to be usable for everyone.

Would it be easier if I pointed the package.main towards the built version? Or do you use the version in src/ directly?

Also, I may be able to run it through Uglify and then beautify it so it removes all the useless webpack before it goes through uglify again in your app.

sarendipitee avatar Sep 03 '15 19:09 sarendipitee

The other option is to do what I did in ractive-autosize-input and only provide a minified version in the repo and leave the package.json's main pointed to the src/ so people with webpack/require can npm i it and use it directly after with the same name.

sarendipitee avatar Sep 03 '15 19:09 sarendipitee

@JonDum I just did npm install ractive-datatable and then import datatable from 'ractive-datatable';, so whatever makes that work :)

The package main looks like it is pointed to datatable.js in the root, but I'm not an npm publisher expert (yet).

martypdx avatar Sep 03 '15 19:09 martypdx

That's the goal! But I actually meant for src/datatable.js to be the package main lol.

What do you use? Gulp+Babel? I'd like to test if it works when package.main points to the src/ entry file.

sarendipitee avatar Sep 03 '15 20:09 sarendipitee

What do you use?

gobble + gobble-babel + browerify

martypdx avatar Sep 03 '15 21:09 martypdx

Can you post your gobblefile you use? I used the example project in the gobble repo, and all it did was output some require() statements instead of actually including the code, so I'm really confused and am probably not using gobble like you do.

app.js pre-gobble:

import Ractive from 'ractive'
import datatable from 'ractive-datatable'

alert('hello!')

console.log(Ractive);
console.log(datatable);

post gobble:

"use strict";

var _interopRequire = function (obj) { return obj && obj.__esModule ? obj["default"] : obj; };

var Ractive = _interopRequire(require("ractive"));

var datatable = _interopRequire(require("ractive-datatable"));

alert("hello!");

console.log(Ractive);
console.log(datatable);
//# sourceMappingURL=app.js.map

Not sure how the imports/requires even get into the resultant app.js? The build folder doesn't even include them anywhere.

sarendipitee avatar Sep 07 '15 13:09 sarendipitee

I have installed version : "ractive-datatable": "^1.7.0"

After including this line import datatable from 'ractive-datatable';

the following throwing ....

"!ractive!./template.html" in /home/salim/MyProjects/employee-management/node_modules/ractive-datatable/src/datatable.js (web.browser)
                                              
If you notice problems related to these missing modules, consider running:
                                              
  meteor npm install --save !ractive!.        
                                              
=> Errors prevented startup:                  
   
   While building for web.browser:
   node_modules/ractive-datatable/src/partials/default.html:1: Expected one of: <body>, <head>, <template>

ghost avatar Oct 26 '17 18:10 ghost