vuelayers.css Module build failed

[bingo-soft]

Hi, there! Documentation is too short on how to import vuelayers.css. It simply says, that you need to use css-loader, but does not show how. So, now we import vuelayers.css like so:

import 'vuelayers/dist/vuelayers.css'

And our vue.config.js looks like so:

`module.exports = { chainWebpack: config => {

config.module
  .rule('vue-css')
  .test(/vuelayers\.css$/)
  .use('css-loader')
  .loader('css-loader')
  .tap(opt => {
    if (!opt) {
      opt = {};
      opt.sourceMap = true;
    }
    return opt;
  });

} };`

But when we build its, we get an error message:

Syntax Error: ModuleBuildError: Module build failed (from ./node_modules/css-loader/dist/cjs.js): SyntaxError: Unexpected token o in JSON at position 1 at JSON.parse ()

So, it would be great, if you could provide a tiny example of how css-loader should be configured the right way. Many thanks!

[ghettovoice]

Hello @bingo-soft , as I know vue-cli already setup all by default for css loading. So you don't do anything additional and just import any css file.

When you use default vue.config.js without any additional webpack rules, is it worked for you?

PS: the note about css-loader is more for people who use webpack as standalone bundler

[ghettovoice]

Take a look here https://codesandbox.io/s/vuelayers-layers-swipe-vjfue?file=/vue.config.js. No additional configuration for css-loader

[bingo-soft]

Unfortunatelly, you provided an example for vuelayers 0.11.22, while vuelayers.css is used in next version. I've just checked default vue.config.js:

module.exports = { devServer: { disableHostCheck: true, host: '0.0.0.0' } };

And it results in the very same error message:

error in ./node_modules/vuelayers/dist/vuelayers.css

Syntax Error: ModuleBuildError: Module build failed (from ./node_modules/postcss-loader/src/index.js):

So, the whole problem is with vuelayers@next. If you could provide a working example on https://codesandbox.io, it would be a great help. Thanks!

[ghettovoice]

Ok, I'm not noticed new path to css file from v0.12.

Found a reason, broken map file for css file https://unpkg.com/browse/vuelayers@0.12.0-rc.0/dist/vuelayers.css.map. You can drop it for a while a publish new build.

[bingo-soft]

It would be great, if you could restore the previous alpha version, while new release is not yet ready. Thanks!

[ghettovoice]

Done https://codesandbox.io/s/vuelayers-layers-v012x-yfhnp?file=/package.json