Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Use in combination with lerna #336

Closed
danrot opened this issue Feb 24, 2017 · 6 comments
Closed

Use in combination with lerna #336

danrot opened this issue Feb 24, 2017 · 6 comments

Comments

@danrot
Copy link

danrot commented Feb 24, 2017

Hey, I am trying to use this project in combination with lerna. I have created a packages folder with a component, and added the following styleguide.config.js configuration:

module.exports = {
    title: 'Sulu UI Style Guide',
    components: './packages/**/*.js',
    skipComponentsWithoutExample: true,
    updateWebpackConfig(webpackConfig) {
        webpackConfig.module.loaders.push({
            test: /\.js$/,
            exclude: /node_modules/,
            loader: 'babel-loader',
            query: {
                presets: ['react', 'es2015'],
                plugins: [
                    'transform-flow-strip-types',
                    'transform-class-properties'
                ]
            }
        });

        return webpackConfig;
    }
};

I have webpack 2.2.1 installed, and when I execute yarn run styleguide-server I get the following errors:

WARNING in ./packages/button/~/encoding/lib/iconv-loader.js
9:12-34 Critical dependency: the request of a dependency is an expression

WARNING in webpack: Using NoErrorsPlugin is deprecated.
Use NoEmitOnErrorsPlugin instead.


ERROR in ./packages/button/~/loose-envify/cli.js
Module parse failed: /Users/daniel/Development/massiveart/sulu-ui/packages/button/node_modules/loose-envify/cli.js Unexpected character '#' (1:0)
You may need an appropriate loader to handle this file type.
| #!/usr/bin/env node
| 'use strict';
|
 @ ./~/react-styleguidist/loaders/styleguide.loader.js!./~/react-styleguidist/src/index.js 65:10-114
 @ ./~/react-styleguidist/src/index.js
 @ multi webpack-hot-middleware/client ./~/react-styleguidist/src/index

ERROR in ./packages/button/~/isomorphic-fetch/fetch-bower.js
Module not found: Error: Can't resolve 'fetch' in '/Users/daniel/Development/massiveart/sulu-ui/packages/button/node_modules/isomorphic-fetch'
 @ ./packages/button/~/isomorphic-fetch/fetch-bower.js 1:17-33
 @ ./~/react-styleguidist/loaders/styleguide.loader.js!./~/react-styleguidist/src/index.js
 @ ./~/react-styleguidist/src/index.js
 @ multi webpack-hot-middleware/client ./~/react-styleguidist/src/index

ERROR in ./packages/button/~/promise/build.js
Module not found: Error: Can't resolve 'fs' in '/Users/daniel/Development/massiveart/sulu-ui/packages/button/node_modules/promise'
 @ ./packages/button/~/promise/build.js 3:9-22
 @ ./~/react-styleguidist/loaders/styleguide.loader.js!./~/react-styleguidist/src/index.js
 @ ./~/react-styleguidist/src/index.js
 @ multi webpack-hot-middleware/client ./~/react-styleguidist/src/index

ERROR in ./~/rimraf/rimraf.js
Module not found: Error: Can't resolve 'fs' in '/Users/daniel/Development/massiveart/sulu-ui/node_modules/rimraf'
 @ ./~/rimraf/rimraf.js 6:9-22
 @ ./packages/button/~/promise/build.js
 @ ./~/react-styleguidist/loaders/styleguide.loader.js!./~/react-styleguidist/src/index.js
 @ ./~/react-styleguidist/src/index.js
 @ multi webpack-hot-middleware/client ./~/react-styleguidist/src/index

ERROR in ./~/glob/glob.js
Module not found: Error: Can't resolve 'fs' in '/Users/daniel/Development/massiveart/sulu-ui/node_modules/glob'
 @ ./~/glob/glob.js 43:9-22
 @ ./~/rimraf/rimraf.js
 @ ./packages/button/~/promise/build.js
 @ ./~/react-styleguidist/loaders/styleguide.loader.js!./~/react-styleguidist/src/index.js
 @ ./~/react-styleguidist/src/index.js
 @ multi webpack-hot-middleware/client ./~/react-styleguidist/src/index

ERROR in ./~/glob/sync.js
Module not found: Error: Can't resolve 'fs' in '/Users/daniel/Development/massiveart/sulu-ui/node_modules/glob'
 @ ./~/glob/sync.js 4:9-22
 @ ./~/glob/glob.js
 @ ./~/rimraf/rimraf.js
 @ ./packages/button/~/promise/build.js
 @ ./~/react-styleguidist/loaders/styleguide.loader.js!./~/react-styleguidist/src/index.js
 @ ./~/react-styleguidist/src/index.js
 @ multi webpack-hot-middleware/client ./~/react-styleguidist/src/index

ERROR in ./~/fs.realpath/index.js
Module not found: Error: Can't resolve 'fs' in '/Users/daniel/Development/massiveart/sulu-ui/node_modules/fs.realpath'
 @ ./~/fs.realpath/index.js 8:9-22
 @ ./~/glob/glob.js
 @ ./~/rimraf/rimraf.js
 @ ./packages/button/~/promise/build.js
 @ ./~/react-styleguidist/loaders/styleguide.loader.js!./~/react-styleguidist/src/index.js
 @ ./~/react-styleguidist/src/index.js
 @ multi webpack-hot-middleware/client ./~/react-styleguidist/src/index

ERROR in ./~/fs.realpath/old.js
Module not found: Error: Can't resolve 'fs' in '/Users/daniel/Development/massiveart/sulu-ui/node_modules/fs.realpath'
 @ ./~/fs.realpath/old.js 24:9-22
 @ ./~/fs.realpath/index.js
 @ ./~/glob/glob.js
 @ ./~/rimraf/rimraf.js
 @ ./packages/button/~/promise/build.js
 @ ./~/react-styleguidist/loaders/styleguide.loader.js!./~/react-styleguidist/src/index.js
 @ ./~/react-styleguidist/src/index.js
 @ multi webpack-hot-middleware/client ./~/react-styleguidist/src/index
Child html-webpack-plugin for "index.html":
         Asset    Size  Chunks  Chunk Names
    index.html  586 kB       0
    chunk    {0} index.html 541 kB [entry] [rendered]
        [0] ./~/html-webpack-plugin/~/lodash/lodash.js 540 kB {0} [built]
            cjs require ../../../html-webpack-plugin/node_modules/lodash/lodash.js [3] ./~/html-webpack-plugin/lib/loader.js!./~/react-styleguidist/scripts/templates/index.html 1:8-77
        [1] (webpack)/buildin/global.js 509 bytes {0} [built]
            cjs require global [0] ./~/html-webpack-plugin/~/lodash/lodash.js 1:0-47
        [2] (webpack)/buildin/module.js 517 bytes {0} [built]
            cjs require module [0] ./~/html-webpack-plugin/~/lodash/lodash.js 1:0-47
        [3] ./~/html-webpack-plugin/lib/loader.js!./~/react-styleguidist/scripts/templates/index.html 593 bytes {0} [built]

Has this guide already been tested in combination with lerna? Is it possible to use it like that? I think the problem is that there is more than one node_modules folder...

@sapegin
Copy link
Member

sapegin commented Feb 24, 2017

I don’t think it’s lerna specific. Could you please try 5.x beta?

@danrot
Copy link
Author

danrot commented Feb 24, 2017

After adapting the configuration I get a similar error:

yarn run v0.20.3
$ styleguidist server
Style guide server started at:
http://localhost:3000

Error when parsing packages/button/node_modules/asap/browser-asap.js
Error: No suitable component definition found.

Error when parsing packages/button/node_modules/isomorphic-fetch/fetch-bower.js
Error: No suitable component definition found.

Error when parsing packages/button/node_modules/asap/browser-raw.js
Error: No suitable component definition found.

Error when parsing packages/button/node_modules/isomorphic-fetch/fetch-npm-browserify.js
Error: No suitable component definition found.

Error when parsing packages/button/node_modules/is-stream/index.js
Error: No suitable component definition found.

Error when parsing packages/button/node_modules/js-tokens/index.js
Error: No suitable component definition found.

Error when parsing packages/button/node_modules/isomorphic-fetch/fetch-npm-node.js
Error: No suitable component definition found.

Error when parsing packages/button/node_modules/fbjs/index.js
Error: No suitable component definition found.

Error when parsing packages/button/node_modules/promise/index.js
Error: No suitable component definition found.

Error when parsing packages/button/node_modules/promise/core.js
Error: No suitable component definition found.

Error when parsing packages/button/node_modules/loose-envify/cli.js
Error: No suitable component definition found.

Error when parsing packages/button/node_modules/promise/build.js
Error: No suitable component definition found.

Error when parsing packages/button/node_modules/promise/polyfill-done.js
Error: No suitable component definition found.

Error when parsing packages/button/node_modules/promise/polyfill.js
Error: No suitable component definition found.

Error when parsing packages/button/node_modules/loose-envify/custom.js
Error: No suitable component definition found.

Error when parsing packages/button/node_modules/loose-envify/index.js
Error: No suitable component definition found.

Error when parsing packages/button/node_modules/loose-envify/loose-envify.js
Error: No suitable component definition found.

Error when parsing packages/button/node_modules/loose-envify/replace.js
Error: No suitable component definition found.

Error when parsing packages/button/node_modules/object-assign/index.js
Error: No suitable component definition found.

Error when parsing packages/button/node_modules/node-fetch/index.js
Error: No suitable component definition found.

Error when parsing packages/button/node_modules/react/react.js
Error: No suitable component definition found.

Error when parsing packages/button/node_modules/ua-parser-js/package.js
Error: No suitable component definition found.

Error when parsing packages/button/node_modules/whatwg-fetch/fetch.js
Error: No suitable component definition found.

Failed to compile.

Error in ./packages/button/~/loose-envify/cli.js
Module parse failed: /Users/daniel/Development/massiveart/sulu-ui/packages/button/node_modules/loose-envify/cli.js Unexpected character '#' (1:0)
You may need an appropriate loader to handle this file type.
| #!/usr/bin/env node
| 'use strict';
|
 @ ./~/react-styleguidist/loaders/styleguide-loader.js!./~/react-styleguidist/lib/index.js 96:30-134
 @ ./~/react-styleguidist/lib/index.js
 @ multi ./~/react-dev-utils/webpackHotDevClient.js ./~/react-styleguidist/lib/index

Error in ./packages/button/~/isomorphic-fetch/fetch-bower.js
Module not found: Can't resolve 'fetch' in '/Users/daniel/Development/massiveart/sulu-ui/packages/button/node_modules/isomorphic-fetch'

 @ multi ./~/react-dev-utils/webpackHotDevClient.js ./~/react-styleguidist/lib/index

Error in ./packages/button/~/promise/build.js
Module not found: Can't resolve 'fs' in '/Users/daniel/Development/massiveart/sulu-ui/packages/button/node_modules/promise'

 @ multi ./~/react-dev-utils/webpackHotDevClient.js ./~/react-styleguidist/lib/index

Error in ./~/rimraf/rimraf.js
Module not found: Can't resolve 'fs' in '/Users/daniel/Development/massiveart/sulu-ui/node_modules/rimraf'

 @ multi ./~/react-dev-utils/webpackHotDevClient.js ./~/react-styleguidist/lib/index

Error in ./~/glob/glob.js
Module not found: Can't resolve 'fs' in '/Users/daniel/Development/massiveart/sulu-ui/node_modules/glob'

 @ multi ./~/react-dev-utils/webpackHotDevClient.js ./~/react-styleguidist/lib/index

Error in ./~/glob/sync.js
Module not found: Can't resolve 'fs' in '/Users/daniel/Development/massiveart/sulu-ui/node_modules/glob'

 @ multi ./~/react-dev-utils/webpackHotDevClient.js ./~/react-styleguidist/lib/index

Error in ./~/fs.realpath/index.js
Module not found: Can't resolve 'fs' in '/Users/daniel/Development/massiveart/sulu-ui/node_modules/fs.realpath'

 @ multi ./~/react-dev-utils/webpackHotDevClient.js ./~/react-styleguidist/lib/index

Error in ./~/fs.realpath/old.js
Module not found: Can't resolve 'fs' in '/Users/daniel/Development/massiveart/sulu-ui/node_modules/fs.realpath'

 @ multi ./~/react-dev-utils/webpackHotDevClient.js ./~/react-styleguidist/lib/index

@sapegin
Copy link
Member

sapegin commented Feb 24, 2017

It’s definitely not similar. Would you mind making an example as described here?

@sapegin
Copy link
Member

sapegin commented Feb 24, 2017

It looks like you’re trying to load component from node_modules.

@danrot
Copy link
Author

danrot commented Feb 24, 2017

Ah, I have found something. In the lerna structure I can't use ./packages/**/*.js, when I am changing it to ./packages/*/index.js (which matches my folder structure) it is working...

So I am closing this, since it is not a real issue, but it could be explained better at some place...

@danrot danrot closed this as completed Feb 24, 2017
@sapegin
Copy link
Member

sapegin commented Feb 24, 2017

Please feel free to improve docs, they are far from perfect 🙏

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants