Loaders

roshanpr pro asked 7 years ago

Hi there,New to this. I am trying to set up mdbreact on an existing project. Are there any set of loaders that need to be added. Below is the error message. @ ./src/index.js 3:0-47 @ multi (webpack)-dev-server/client?http://localhost:8080 ./src/index.js ERROR in ./node_modules/mdbreact/dist/css/mdb.css Module parse failed: Unexpected token (27:0) You may need an appropriate loader to handle this file type. |  * |  */ | .mdb-color.lighten-5 { |   background-color: #d0d6e2 !important; }

Jakub Strebeyko staff answered 7 years ago

Hi there roshanpr, Welcome to the Support Board! All you really need to get started with MDB in an existent project is included here, starting from the second point of Step 2. How is your webpack.config.js dealing with CSS files at the moment? With Best Regards, Kuba

roshanpr pro commented 7 years ago

Hi Kuba, thanks for your response. Yep, I started from the same link and managed to get through. I want to avoid writing CSS as much as possible. So far, am able to accomplish a lot through your react components. Below is the webpack config. const path = require('path'); const HtmlWebpackPlugin = require('html-webpack-plugin') module.exports = { entry: { app: './src/index.js' }, output: { path: path.resolve(__dirname), filename: '[name]-bundle.js' }, module: { rules: [ { test: /.js$/, include: path.resolve(__dirname, 'src'), use: ['babel-loader'] }, { test: /.css$/, use: ['style-loader', 'css-loader']}, { test: /.eot(?v=d+.d+.d+)?$/, loader: 'file-loader'}, { test: /.(woff|woff2)$/, loader: 'url-loader?prefix=font/&limit=5000' }, { test: /.ttf(?v=d+.d+.d+)?$/, loader: 'url-loader?limit=10000&mimetype=application/octet-stream' }, { test: /.svg(?v=d+.d+.d+)?$/, loader: 'url-loader?limit=10000&mimetype=image/svg+xml' }, { test: /.png(?v=d+.d+.d+)?$/, loader: 'url-loader?limit=10000&mimetype=image/png' }, { test: /.gif(?v=d+.d+.d+)?$/, loader: 'url-loader?limit=10000&mimetype=image/gif' } ] }, devServer: { historyApiFallback: true, }, plugins: [ new HtmlWebpackPlugin({ template: 'public/index.html' }) ] };

roshanpr pro commented 7 years ago

Hey Kuba, do you have any templates for a landing page (with react components)?

Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: MDB React
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No