-
Notifications
You must be signed in to change notification settings - Fork 26.1k
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
Path to webpack config #1641
Comments
Use this: https://github.com/zeit/next.js#customizing-webpack-config |
Hi @arunoda - thanks for the reply! Both here and in Slack. Unfortunately as we discussed there, and as you advised to open an issue here, it doesn't solve the issue. What I need is to basically have /path/to/config.js does that make sense? |
Looks like there’s no config that you can reuse in Styleguidist unless it will be extracted to a separate module. @motleydev Could you find a workaround? |
Yes, recreate the webpack env manually. :) I think there might be a solution hidden in the fact that there's some kind of "parent" function that consumes the next.config.js file and is able to pass the entire config into the webpack function here https://github.com/zeit/next.js/#customizing-webpack-config - but I haven't taken the time to figure it out as I'm attempting to keep my code base as "vanilla" as possible and so recreating the config didn't represent substantial overhead. |
Can we reopen this? |
I was able to get styleguidist running with just this piece of config: // styleguide.config.js
module.exports = {
components: './components/**/*.js',
webpackConfig: {
module: {
loaders: [{
test: /\.js(\?[^?]*)?$/,
loader: 'babel-loader',
exclude: /node_modules/,
query: {
cacheDirectory: true,
presets: ['react'],
},
}],
},
},
}; But when I run Building style guide...
clean-webpack-plugin: .../styleguide/build has been removed.
Failed to compile.
Error in build/bundle.1aa4b834.js from UglifyJs
Unexpected token: punc (}) [build/bundle.1aa4b834.js:6019,31] Any ideas? @sapegin ? |
@renancouto UglifyJS doesn’t support ES6, you need to transpile your JS to ES5. P. S. What this part of regexp does — |
@sapegin not sure, I just copied from next.js webpack config. |
I see now — it’s an optional query string, like |
Cool! BTW, adding // styleguide.config.js
module.exports = {
components: './components/**/*.js',
webpackConfig: {
module: {
loaders: [{
test: /\.js(\?[^?]*)?$/,
loader: 'babel-loader',
exclude: /node_modules/,
query: {
cacheDirectory: true,
presets: ['react', 'es2015'],
},
}],
},
},
}; Looks like this config is enough to run |
Or better babel-preset-env with uglify option ;-) |
Ah, even better! Thanks again @sapegin 😉 |
@billgloff Looks like something is overwriting our webpack aliases. I need a repo that I can debug to say more. |
So. I need to customize webpack config or not? A tutorial would be nice. Styleguidist and Storybook are great tools for React Design. Thank you |
The following styleguide.config.js did the trick for me:
|
I'm incorporating Styleguidist to my app and want to reuse the next.js webpack config. I can define a path to my projects config file but I can't seem to figure out what that would be with next. There are several component documenting libs that need this type of ability - perhaps creating some kind of api for accessing the config object for merging into the styleguidist config file?
The text was updated successfully, but these errors were encountered: