Is it possible with your (very cool) system to use meteor:react-based atmospherejs packages?
For example, say you install poetic:react-autoform-material-ui, which depends on meteor:react, meteor:react-template-helper, etc. If I understand correctly, will this result in having two different versions of react in use: both the npm one AND the atmosphere one?
I can imagine having some pretty gnarly conflicts resulting from this, as well as the duplicate code size, etc.
It makes sense to use npm directly rather than āatmosphere wrappedā npm modules, but it seems like trouble can occur when you want to have a meteor-specific module (such as integrating material-ui npm with autoform) BASED on a module that youāve directly npm included (like npm react). Then you end up with duplicate versions of core libraries, and all the potentially confusing conflicts this entails.
One downside of calling the file webpack.packages.json is that familiar commands like ānpm install --saveā no longer function. I think in an ideal world, most users of this system should not need much (any?) familiarity with webpack. If they are, its introducing another complicated concept in the (long) list of things to have a running application. To me this seems like the antithesis of the āmeteor wayāā¦ ideally IMO webpack would be more like an implementation detail, exposed perhaps for those that want/need to modify it, but humming along quietly underneath the system for everyone else.
is there any way to have it automatically build the entry files for client and server, whether through config or a build step? or is it always necessary to explicitly import?
This is using React from Meteor package react-runtime. All you need is to setup the external config { react: 'React' } and it will use the global variable coming from Meteor package. All the kickstart projects are made like this. React will not be included twice. You donāt have to worry about that.
This package is not called es6module, it is called webpack for a reason. I donāt want to reinvent anything here and I want people to feel like they are using Webpack. If you donāt want to learn Webpack, you shouldnāt use a package called webpack:webpack ;).
Iām not sure I understand your question. You can setup your entry point by using a webpack.conf.js file.
UPDATE FOR WINDOWS USERS
I just fixed the problem with watching files on Windows. Now hot reload should work 100% fine.
Update webpack:webpack package and just make sure youāre using path.join(__dirname, '..', 'modules') in resolve.root instead of __dirname + '/../modules' in your webpack.conf.js.
UPDATE FOR EVERYONE
NPM warnings for peer dependencies on React or Webpack shouldnāt happen again if you update your webpack:webpack package. If you see a peer dependency warning, itās on you now!
$ npm install material-ui
npm WARN peerDependencies The peer dependency react@^0.14.0 included from react-tap-event-plugin will no
npm WARN peerDependencies longer be automatically installed to fulfill the peerDependency
npm WARN peerDependencies in npm 3+. Your application will need to depend on it explicitly.
npm ERR! Linux 3.13.0-37-generic
npm ERR! argv "/usr/bin/nodejs" "/usr/bin/npm" "install" "material-ui"
npm ERR! node v4.2.1
npm ERR! npm v2.14.7
npm ERR! code EPEERINVALID
npm ERR! peerinvalid The package react@0.13.3 does not satisfy its siblings' peerDependencies requirements!
npm ERR! peerinvalid Peer material-ui@0.13.0 wants react@^0.14.0
npm ERR! peerinvalid Peer react-addons-create-fragment@0.14.0 wants react@^0.14.0
npm ERR! peerinvalid Peer react-addons-pure-render-mixin@0.14.0 wants react@^0.14.0
npm ERR! peerinvalid Peer react-addons-transition-group@0.14.0 wants react@^0.14.0
npm ERR! peerinvalid Peer react-addons-update@0.14.0 wants react@^0.14.0
npm ERR! peerinvalid Peer react-tap-event-plugin@0.2.1 wants react@^0.14.0
npm ERR! peerinvalid Peer redbox-react@1.1.1 wants react@>=0.13.2 || ^0.14.0-rc1
npm ERR! Please include the following file with any support request:
npm ERR! /home/none/MeteorApps/Test/kickstart-flowrouter/npm-debug.log
I have something I can not understand:
$ meteor list
...
react-runtime 0.13.3_7 Facebook's React library
and
npm info react
...
version: '0.14.0',
Which version is used? In error, looks like react@0.13.3:
npm ERR! peerinvalid The package react@0.13.3 does not satisfy its siblings' peerDependencies requirements!
npm ERR! peerinvalid Peer material-ui@0.13.0 wants react@^0.14.0
OK, lets try another version
$ npm install material-ui@0.12.5
npm ERR! peerinvalid The package react@0.13.3 does not satisfy its siblings' peerDependencies requirements!
npm ERR! peerinvalid Peer material-ui@0.12.5 wants react@~0.13
The best way is to use require within componentWillMount. Example: require('font-awesome/css/font-awesome.css');.
This error is pretty straightforward. You are trying to use a library that requires React 0.14 and the Meteor package is still at 0.13. You might want to try an older version that was working on 0.13.3. Use material-ui ~0.12.5 for now.
This is because react-addons-X are made for 0.14. You can still use React.addons. until Meteor upgrades to 0.14 (they said in a week it will be done!). Maybe you havenāt added it yourself but it is probably a dependency of material-ui.
https://github.com/thereactivestack/kickstart-hugeapp/blob/master/entry/client/routes.jsx#L4
As I understand this, all modules are served up SSR, if thatās correct, how could I change that? Anything behind a login wall (like admin) has no need for SEO and Iād probably prefer to have the client load it (but Iāll happily change my opinion if thereās a reason for it).
In your demo, if I refresh the admin page, it loses its context & shows up on a white background. Iām not great with webpack yet, but is this because admin needs its own entry point? how could i fix this?
Thanks for taking away all our excuses not to use webpack Cheers
This is because it is much easier (and automated) to do it like this. The CHUNK_COLLECTOR is for react-router-ssr. You donāt really need to fully understand but the SSR will not work correctly if the chunks on the first page load are not already loaded. Your first client render will be different than what your server rendered.
This is not a bug, it was inteded to do so. The CSS is required within the TodoApp and when you are inside AdminApp, the component has not been loaded yet. If you want to fix this, you have to make sure your CSS for the layout is in your main App component.
In the example, when you go in AdminApp, it has no CSS loaded yet. When you go in the TodoApp, it loads the .css. Then, when you go back to the admin, the CSS is still on the page. You will never have this problem if you are class names that are not colliding.
[95.138.190.18] Meteor requires Node v0.10.40 or later.[95.138.190.18]
[95.138.190.18] error: Forever detected script exited with code: 1[95.138.190.18]
my mup.json includes
// WARNING: Node.js is required! Only skip if you already have Node.js installed on server.
"setupNode": true,
// WARNING: If nodeVersion omitted will setup 0.10.36 by default. Do not use v, only version number.
"nodeVersion": "0.10.40",
To get semantic-ui working, I did npm install semantic-ui. I then went through the steps ending with gulp build. After that, I moved the files in the outputted dist folder into my modules folder.
Testing this out in windows. I tried this and Iām seeing HMR Connected in chrome console, as well as Client modified --refreshing in the Command Prompt, but the components are not updating. In fact, Iām only seeing changes if i shut down and restart the server. Any ideas?
EDIT: could be related to this issue as I am also seeing Error: EBADF, read in the command prompt
Is it possible to make webpack build for Electron? Is it as simple as to place target: 'atom' somewhere? I saw that in the documentation of webpack, but I had no luck making it work in the kickstart-simple project.
Cheers