Error when trying to load minified css

Bug Report

Describe the bug I’m using a library (react-tippy) which requires to load a css file in order to look as expected. When I load the component which imports that css file, I get an error of Unexpected token .*

A clear and concise description of what the bug is. I get the following error on the console which stops the server from starting …

Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type.
> .tippy-touch{cursor:pointer!important}.tippy-notransition{transition:none!important}.tippy-popper{max-width:400px;-webkit-perspective:800px;perspective:800px;z-index:9999;outline:0;transition-timing-function:cubic-bezier( ...

To Reproduce

In order to

1. git clone https://github.com/EmaSuriano/docz-css-bug-example.git
2. yarn install
3. yarn dev

Expected behavior

Start the server as expected.

Enviroment

• OS: OSX
• Node/npm version: 10.6.0

Additional context/Screenshots

The workaround I found was to format the file with prettier and it seems the server to be working. The problem with is that I have to store the file in my codebase, which I really don’t want to do because if the owner of the library made a change on the styles I have to manually change it …

This is the branch with the work around --> https://github.com/EmaSuriano/docz-css-bug-example/tree/formatting-css-file

[tsnolan23]

@EmaSuriano I was able to get your project running by modifying the bundler config without the CSS plugin:

// doczrc.js
export default {
  modifyBundlerConfig: config => {
    config.module.rules.push({
      test: /\.css$/,
      use: ["style-loader", "css-loader"]
    });
    return config;
  }
};

It did require additional dependencies, then, though - style-loader and css-loader.

Not sure if that’s the proper way to achieve the result, but it does work!

[EmaSuriano]

It works! 🎉 But I’m thinking if this bug should be fixed in docz-plugin-css because this kind of transformation should be taking care of by this plugin …