Can't get meteor to work with react and npm - meteor

I am trying to get meteor to work with react-bootstrap npm package, and I'm getting Uncaught TypeError: _reactDom2.default.findDOMNode is not a function no matter what I try.
For that purpose I use AdamBrodzinski/meteor-react-boilerplate, and while it works fine, it doesn't work for me when I try to add additional packages from npm. I tried material-ui too, and I got exactly the same error as I do now.
I also followed this tutorial: http://react-in-meteor.readthedocs.org/en/latest/client-npm/
My repository I get an error in is: https://github.com/vincaslt/meteor-chess
both\pages\Game.jsx is the file that contains my changes. I also made sure I referenced bootstrap components in app.browserify.js:
Button = require('react-bootstrap/lib/Button')
Modal = require('react-bootstrap/lib/Modal')
I tried importing react-dom as npm package in the project, but that doesn't change anything regarding the error.

Related

error deploying react project with font-awesome import

I'm trying to npm run deploy on my project where I'm storing the minified font-awesome css file and I'm getting the following error:
Creating an optimized production build...
Failed to compile.
./src/assets/css/font-awesome.all.min.css
ParserError: Syntax Error at line: 1, column 30
The app works fine on development sever.
The error shows whether I'm importing the css to the main css file or the main js file.
I only found some related old posts with potential solutions for a next.js project and yarn like in this link: https://github.com/vercel/next-plugins/issues/310
This is a react project and I'm using npm.
Any suggestions?
Can't comment on this unless there's more information regarding module-bundler and what is the configuration for the same. As it's treated differently according to module-bundler.
I would suggest you to use official package of fontawesome for react #fortawesome/react-fontawesome
PS. Module Bundler configuration should not be changed without proper knowledge as it can make whole application crash.

Installing bootstrap with npm is throwing errors

I am basically trying to install bootstrap (sass version) with npm and I have done so by following this guide here: https://getbootstrap.com/docs/4.0/getting-started/download/ (see the npm part).
then I continued setting it up by following this guide here: https://getbootstrap.com/docs/4.0/getting-started/build-tools/ so that I could compile the sass into css.
The issue is that when I am running the command npm run dist I get the below error:
I can't figure out such error and have also tried researching the web for a similar error but could not find anything. I can't understand why such a popular framework is so frustrating to get up and running.
Any insights please?
Update:
Here is the debug.log

Meteor Blaze To-Do App Error, can't find npm module "meteor/Mongo"

Everything worked perfectly well until I made the changes that were stated while learning Collections. I also had a few updates done for Meteor through the command prompt. I don't seem to know where the problem resides.
The error says - can't find npm module "meteor/Mongo"
You've capitalised meteor/Mongo in the path in your import statement - it should be import { Mongo } from "meteor/mongo"

Find/reduce scss errors in media query mixin

We've been working with Neat framework for 6 months and love it.
However suddenly we have a critical problem with one of their excellent mixins which we are entirely dependant on for media queries.
Here's a link to the file.
https://github.com/thoughtbot/neat/blob/master/app/assets/stylesheets/grid/_media.scss
Heres the docs for the mixin.
http://thoughtbot.github.io/neat-docs/latest/#media
We've called it in our sass files almost 300 times so its pretty essential, although we mostly only use the first parameters e.g. media( max-width $small-screen)
Although we have also used it in some of the Refills navigation modules which use it in a more advanced way
http://refills.bourbon.io/
Don't know what the error is because gulp-sass and browser-sync crash without sending error messages to the console like it normally does with the way we have it set up.They only crash when this mixin is loaded. Don't know what causes the error
If I start removing the mixin we get error reporting back and gulp-sass doesn't crash any more. ALthough we get errors from all the files that call the mixin.
I've also tried the following
Completely deleting the node_modules directory and doing a fresh npm install
Doing a npm uninstall of gulp and gulp-sass, then a fresh npm install
Doing a global install of node-sass, and doing a global uninstall of node-sass.
Doing a npm rebuild node-sass from within the node_modules/gulp-sass directory
Does anyone have any suggestions/ ideas / solutions ?

Meteor Semantic-UI less compile error

Im trying to use the official semantic-ui meteor package. I followed all the step to generate the folders but I got this error:
While building the application:
client\lib\semantic-ui\theme.import.less:23:10: Less compiler error:
expected ')' got 'o'
I checked the file and Its this line:
#import (optional) "#{themesFolder}/#{site}/globals/site.variables";
Im not sure what is the problem but I think is something related to the (optinal).
How can i fix this ?
You should try removing the official Meteor less package and adding the less-autofixer Meteor package.
meteor add flemay:less-autoprefixer
This is a necessary prerequisite to the official semantic ui package.

Resources