I couldn't find a clear answer for this anywhere so here it is. Instead of constantly doing
meteor add <package-name>
whenever I want to install a new package. Or instead of creating a bash script that adds and removes all of the packages, it would be nice if there was a more elegant way of doing this. Kind of like packages.json files for npm.
There is .meteor/packages (all meteor add <package-name> does is adding a line in this file)
Additionally, Meteor now supports npm packages directly (since the 1.3 release) and I'd recommend using them for anything that is not particularly related to Meteor. For that you use traditional the npm flow, ie a package.json at the root and npm install
Then in your scripts, you'd do
import {ReactMeteorData} from 'meteor/react-meteor-data';
to import from the Meteor react-meteor-data package, and
import React, {Component} from 'react'; to import from the npm react package.
Having to write here, as it wont allow to comment, yet.
I am on Ubuntu and my packages are at
~/.meteor/packages/<distribution>/<version>/<target(web.browser || web.cordova)
Related
I updated some webpack stuff and now they expect imports using the npm packages exports.
New syntax is:
Old syntax:
It is expecting you to use imports from the swiper node modules package.json export field here:
Question:
How to get WebStorm/PhpStorm to recognize this?
Package exports are not yet supported in CSS/SASS, please vote for WEB-55017 to be notified on any progress with this feature
This is probably a stupid mistake but I've already spent hours on it so any help would be appreciated.
I created a meteor 1.8.3 app with meteor create example. I ran npm i dotenv --save-dev. dotenv got installed into node_modules.
Edited server/main.js like so:
import { Meteor } from 'meteor/meteor';
import dotenv from 'dotenv';
Meteor.startup(() => {
dotenv.config();
});
This gives me a TypeError: dotenv.config is not a function. console.log(dotenv) returns an empty object {}. Any idea why?
When developing using Meteor it's very common that commands creating a change into node_modules (like npm install) are not taken into account while the application is running. You need to stop it and run it again to take into account the updated node_modules.
To avoid this behavior, use the npm version bundled with the meteor cli instead of the one you installed :
meteor npm install --save-dev dotenv
When I run this command...
npm install vue-material
It seemed to install and override some css in my application causing css conflicts. I had to search and find the exact piece of css and override it directly on the specific vue component's section.
Is there anyway to prevent this from happening when installnig NPM packages?
Technologies uses:
vue.js
webpack
material-vue
I believe I found out what I was looking for thank you #ljubadr for your help.
In the recommended Getting Started vue material guide it states you can:
import 'vue-material/dist/vue-material.min.css'
However, if you only need one component, this should work for a specific CSS need on a specific vue component:
import 'vue-material/dist/Components/MdCard/index.css'
The npm module mapbox-gl failed at import in Meteor 1.3.
This is how the import looks like:
import mapboxgl from 'mapbox-gl'
The error in the browser console:
Cannot find module 'gl'
Is it a problem of Meteor's packager?
Can this package only be used through Browserify?
I am also interested in solving this baby. Copied from the mapbox-gl repo...
Alternatively, you can npm install mapbox-gl and use it as a bundled dependency with browserify.
It seems like it may depend on browserify? Why mapbox!! If I come up with a solution will post here.. Until then may God have mercy on our souls c:
update:: it is on!
mapbox error of d00m
update2:: the require statements inside mapboxgl.js are causing the errors.. My previous console error stemmed from not having the npm 'gl' package loaded before mapbox.
Any ideas how to debrowserify an npm package??
This is a known issue and there is no solution at the moment. You can still include mapbox-gl with a script tag:
<script src='https://api.mapbox.com/mapbox-gl-js/v0.22.1/mapbox-gl.js'></script>
I'm hardly trying to get my existing ng2-prototype running in a meteor1.3 setup. So far i was building the prototype with webpack, and there is a provide plugin to make things like jQuery or Tether available during module building:
plugins: [
new ProvidePlugin({
$: "jquery",
jQuery: "jquery",
"window.jQuery": "jquery",
"window.Tether": "tether"
})
]
As you can see, i did the same with "tether", since it's still the lib needed by bootstrap 4 alpha.
Now i'm wondering how i could achieve the same in my meteor1.3 project..? As written in the changelogs of the package "angular2-meteor", it is using webpack under the hood now to build everything.
angular2-meteor changelog
So, it should be possible to use the same provide plugin again in meteor1.3, right? But... how?
From the github issue threads of "angular2-meteor":
there are multiple ways: you could install https://atmospherejs.com/coursierprive/tether, or,
since Meteor 1.3 prefers NPM now, you could install Tether NPM and require it before you use bootstrap 4, or, if you want more control and modularity, you could create own local package (in the packages folder) with all dependencies (added from NPMs) you need including Tether (similar to the way angular2-runtime done in this repo).
i will try this out and i'm already sure this will do the trick :) many thx #barbatus ;)
Update:
Ok i'm going with the npm package solution, i had tether installed already. If you don't have it, do this first:
npm install --save tether
Now, the single require statement won't be enough.. bootstrap 4 which i'm trying to include completely is asking for a window.Tether function. So i ended up doing this:
let Tether = require('tether');
window.Tether = Tether;
// import all bootstrap javascript plugins
require('bootstrap');
Cool is, there is also a typings definition file for it now, just add it by running:
typings install --save --ambient tether
After adding it to the window global context, the errors are gone... but ok, the solution trough the webpack provide plugin feels still cleaner -> it will provide the Tether object for each module separately during build, so it won't end up living in the window global context after all. But i'm just lucky to have it running now :)
PS: jQuery is provided anyways by meteor, that's the reason it is already enough to get it running by just including tether alone.
Update: yeah jQuery is included by default - but it is just a package in your /.meteor/packages file ;)