search

vue-styleguidist / vue-cli-plugin-styleguidist

vue cli 3.0 plugin for vue-styleguidist
MIT License
21 stars 6 forks source link

Cannot run using default instructions #28

Closed scottadamsmith closed 5 years ago

scottadamsmith commented 5 years ago

At first I thought it may have been something specific from within my app, so I setup a new repository and created an empty vue-cli app, installed the plugin, and attempted to run by following the instructions exactly.

Example: https://github.com/scottadamsmith/vue-cli-plugin-styleguidist-repro

Error output:

                                                     ./node_modules/react-styleguidist/lib/rsg-components/Editor/EditorLoader.js 36:3
Module parse failed: 'import' and 'export' may only appear at the top level (36:3)
You may need an appropriate loader to handle this file type.
|                       var _this2 = this;
|
>                       import('rsg-components/Editor/Editor').then(function (module) {|                               _this2.setState({ editor: module.default });
|                       });
 @ ./node_modules/react-styleguidist/lib/rsg-components/Editor/index.js 1:0-61 1:0-61
 @ ./node_modules/react-styleguidist/lib/rsg-components/slots/index.js
 @ ./node_modules/vue-styleguidist/lib/utils/renderStyleguide.js
 @ ./node_modules/vue-styleguidist/lib/index.js
 @ multi ./node_modules/vue-styleguidist/lib/index ./node_modules/react-dev-utils/webpackHotDevClient.js

Learn how to add webpack loaders to your style guide:
https://github.com/vue-styleguidist/vue-styleguidist/blob/master/docs/Webpack.md

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! vue-cli-styleguidist@0.1.0 styleguide: `vue-cli-service styleguidist`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the vue-cli-styleguidist@0.1.0 styleguide script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

Please let me know if there is any other information I can provide or if you believe this is an issue on my end. Thanks!

elevatebart commented 5 years ago

Thank you for the repo, I will take look

elevatebart commented 5 years ago

I have a begining of a clue If you use yarn, it works. This error only happens with npm... grrr

elevatebart commented 5 years ago

https://github.com/webpack/webpack/issues/8656 ... seems we need to downgrade webpack until this is fixed...

elevatebart commented 5 years ago

https://github.com/webpack/webpack/issues/8656#issuecomment-456713191...

elevatebart commented 5 years ago

I am going to downgrade the dependency of the plugin to @vue/cli@^3.0.0 This way you can use an older version of the cli, webpack and npm until the bug is fixed on npm.

elevatebart commented 5 years ago

What is wonderful is I can do something for you on vsg ;) !!!! \o/

I am going to update the version of acorn on vsg and this way we can avoid the npm bug. Will deliver a fix by tonight.

scottadamsmith commented 5 years ago

Wow, really appreciate it! Was able to start another clean app following instructions and everything is good. No locking versions or downgrades required. Thanks!

scottadamsmith commented 5 years ago

So while I was able to get the default app scenario to load, my actual app is still throwing the error due what appears to be the webpack ^4.29.0 dependency. Vue cli released v3.3.1 to temporarily roll back webpack (https://github.com/vuejs/vue-cli/commit/1af421ee74360b6831e2de0ba4f1f9cec1a5f6ca) to resolve the issue. Is this something that can be considered for vue-styleguidist as well?

elevatebart commented 5 years ago

When you update @vue/cli to 3.3.1 do you still have the issue? I thought our direct dependency to acorn saved us. it seems not at all...

scottadamsmith commented 5 years ago

I do. When I examine my package-lock I end up with a 4.28.x version from the CLI, but the 4.29.0 version remains from vue-styleguideist. I am assuming that webpack 4.29.0 has an acorn dep that exposes the NPM bug.

scottadamsmith commented 5 years ago

I was able to get past the error by deleting my package-lock, wiping node_modules, and installing again to regenerate package-lock. I'm not sure this will be a great option for stable projects, but given I just created this package a week ago and have not released the initial version, it was acceptable in my case. Thanks again for the responses and updates!

elevatebart commented 5 years ago

OK, great to hear can you still write a quick issue for vue-styleguidist. If I find the time it will remind me to deliver a version of it with a downgraded webpack.

Thanks

Le 27janv. 2019 à 20:51, Scott Smith notifications@github.com a écrit :

I was able to get past the error by deleting my package-lock, wiping node_modules, and installing again to regenerate package-lock. I'm not sure this will be a great option for stable projects, but given I just created this package a week ago and have not released the initial version, it was acceptable in my case. Thanks again for the responses and updates!

— You are receiving this because you modified the open/close state. Reply to this email directly, view it on GitHub https://github.com/vue-styleguidist/vue-cli-plugin-styleguidist/issues/28#issuecomment-457983791, or mute the thread https://github.com/notifications/unsubscribe-auth/AFVVkRqMUurp7D-vg7BSY2bEtY9qXT_oks5vHmWbgaJpZM4aUbI7.