Skip to content
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

Use with webpack #17

Closed
OKNoah opened this issue Jul 15, 2017 · 6 comments
Closed

Use with webpack #17

OKNoah opened this issue Jul 15, 2017 · 6 comments

Comments

@OKNoah
Copy link

OKNoah commented Jul 15, 2017

I get this error when I try use it with webpack, which is set up for just .scss.

Trying to load "index.css" as a "*.js"

I added this, but no joy

{ test: /\.css$/, loader: 'style!css?importLoaders=1!autoprefixer?browsers=last 2 version!sass' },
@zamarrowski
Copy link
Owner

I use webpack to generate the github page and I don't have that problem 🤔 . Checkout the config file of webpack, maybe it help you:

https://github.com/zamarrowski/react-ionicons/blob/master/docs/webpack.config.js#L19

@edgeadjei
Copy link

I received a similar error. I solved the issue by adding both a style loader and css loader. Although is not the same error you can try adding { test: /\.css$/, use: ['style-loader', 'css-loader']} to your loaders array after running npm i css-loader style-loader

Error

Uncaught Error: Module parse failed: /path/to/project/node_modules/react-ionicons/lib/index.css Unexpected token (2:0)
You may need an appropriate loader to handle this file type.
| /* Rotate animation */
| .rotate {
|   -webkit-animation: rotateIcon 2s linear infinite;
|   -moz-animation: rotateIcon 2s linear infinite;
    at Object.defineProperty.value (checkPropTypes.js:61)
    at __webpack_require__ (bootstrap 6f59962912e071547d19:54)
    at Object.<anonymous> (index.js:19)
    at __webpack_require__ (bootstrap 6f59962912e071547d19:54)
    at Object.defineProperty.value (dashboard.component.jsx:15)
    at __webpack_require__ (bootstrap 6f59962912e071547d19:54)
    at Object.defineProperty.value (dashboard.container.jsx:9)
    at __webpack_require__ (bootstrap 6f59962912e071547d19:54)
    at Object.defineProperty.value (dashboard.layout.jsx:25)
    at __webpack_require__ (bootstrap 6f59962912e071547d19:54)

@zamarrowski
Copy link
Owner

Maybe, I will move styles to styled-components to avoid this errors 🤔

@edgeadjei
Copy link

I think thats a good idea after further testing on my Heroku staging env, my previous solution only works on my development machine. With the current implementation additional considerations need to be made when bundling using Webpack which is a little inconvenient.

@edgeadjei
Copy link

Per my previous comment, I was able to resolve my Heroku server error by clearing the yarn cache and updating yarn to version 1.3.2

@zamarrowski
Copy link
Owner

I migrated to styled-components... so I close this issue 😄

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants