Comcast / patternlab-edition-node-webpack

The webpack wrapper around patternlab-node core, providing tasks to interact with the core library and move supporting frontend assets.
https://comcast.github.io/patternlab-edition-node-webpack/
Apache License 2.0
126 stars 95 forks source link

After insert webpack sample file js don´t compile anymore #38

Closed ghost closed 5 years ago

ghost commented 5 years ago

I have the following issue:

I installed the project like it´s described in the readme. 'npm install starterkit-mustache-demo' 'npm run patternlab:loadstarterkit --kit=starterkit-mustache-demo'

Then I replaced the _app/webpack.app.js file with _app/samples/scss/webpack.app.js and added the dependencies with running:

npm install autoprefixer import-glob-loader css-loader node-sass postcss-loader postcss-flexbugs-fixes mini-css-extract-plugin sass-loader style-loader --save-dev

After that, I changed the paths in _01-foot.mustache to:

{{{ patternLabFoot }}}

-- Now I have the problem, that my JS and my SCSS files are not compiled. I also tried to change the path to sample-project.js but nothing happens. When I run 'npm run patternlab:build' I get this error message in my terminal:** _Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema. - configuration.entry should be one of these: function | object { : non-empty string | [non-empty string] } | non-empty string | [non-empty string] -> The entry point(s) of the compilation. Details: * configuration.entry should be an instance of function -> A Function returning an entry object, an entry string, an entry array or a promise to these things. * configuration.entry['js/pl-source'] should be a string. -> The string is resolved to a module which is loaded upon startup. * configuration.entry['js/pl-source'] should not be empty. * configuration.entry should be a string. -> An entry point without name. The string is resolved to a module which is loaded upon startup. * configuration.entry should be an array: [non-empty string]_ I think there is something wrong with the sample file or the webpack merge, but I can´t find the error by my own. I would be very grateful if someone can help me!
mbulfair commented 5 years ago

@thrsh this basically boils down to there are no file in the entry. If you're using the merge make sure you've defined the new files so the merge uses yours over the default. It just needs atleast 1 .js file.

ghost commented 5 years ago

Hey @mbulfair, do you mean a entry weback file for merging with webpack.config.babel.js? Where can I define that? thanks!

mbulfair commented 5 years ago

It means there are no files https://github.com/Comcast/patternlab-edition-node-webpack/blob/latest/source/_app/samples/scss/webpack.app.js#L25 in this folder. This scans for any file in those folders. If you have 0, it will break. just add a index.js as a test in that folder and it should build.

ghost commented 5 years ago

hmm but the starterkit generated several files in this folder: source/js/

mbulfair commented 5 years ago

If you edit the file to be that folder again, source.js vs source.patterns see if that works.

ghost commented 5 years ago

yeah now the js files compile :) thank you! one problem is solved. I thought when the JS finally works, the scss files will compile, too ....

My entry looks like that now: entry: { "js/pl-source": globby.sync( [ resolve(${plConfig.paths.source.css}scss/*.scss), resolve(${plConfig.paths.source.patterns}**/*.js), resolve(${plConfig.paths.source.js}**/*.js), "!*/.test.js" ], { gitignore: true } ) },

the style.scss is in the css folder and all other scss files are in different subfolders in css/scss/subfolder

Any Idea?

ghost commented 5 years ago

@mbulfair is there any chance to get help via gitter?

ghost commented 5 years ago

We figured out, that you should downgrade css loader to 1.0.1 and if somebody use the starterkit files, you should put your style.scss into source/css/scss/