How to include CodeMirror in Meteor's summernote? - meteor

I included the CodeMirror libraries in the head of my layout and initialize summernote with codemirror option, but meteor summernote is still not using CodeMirror.

Found the issue, the libraries of codemirror have to load before Summernote's libraries. Make sure Summernote's dependencies load before Summernote's ones. In Meteor, we have to change the order of packages in the package file. Putting the Summernote package after the CodeMirror package helps.

Related

How to tell Visual Studio that Bootstrap files are updated?

I am trying to install Bootstrap Datetimepicker on a PC which is not connected to the Internet.
I have the Bootstrap Datetimepicker nupkg files. I added the folder of the files as a Package Source. When I try to install the package, I get the error:
Unable to resolve dependencies. 'bootstrap 3.0.0' is not compatible with 'Bootstrap.v3.Datetimepicker.CSS 4.17.45 constraint: bootstrap (>= 3.3.0)'
I already copied all CSS and JS files of Bootstrap 3.3.7 to the relevant folders in my project. How do I tell Visual Studio that they have been updated?
How do I tell Visual Studio that they have been updated?
You need update the package bootstrap to 3.3.0 or later.
You want to update package Bootstrap.v3.Datetimepicker to 4.17.45, which has a Dependencies limitation: bootstrap (>=3.3.0). So you need update the package bootstrap.
I already copied all CSS and JS files of Bootstrap 3.3.7 to the relevant folders in my project
NuGet manager the packages as a whole will not modify the internal data, so even you have already copied all CSS and JS files of Bootstrap 3.3.7, nuget still manager the previous package Bootstrap 3.0.0. To resolve this issue, just update the package Bootstrap to 3.3.0 or later.

Customizing Meteor Package useraccounts:materialize

I'm currently trying to use the useraccounts:materialize package from Atmosphere; however, I do not know how to customize the HTML and CSS of it.
Is there any way of doing this?
Follow these steps :
Fork/Clone this repo
Make the required changes to the html and css files in the directory /lib
Publish your package to atmosphere and use that if you want to make it public OR use this as a local package.
Read about publishing to atmospherejs here and about using it as a local package by placing the package under packages folder in root and running the command meteor add usrname:packagename

how to provide tether/anything-else globally in my meteor1.3 typescript project?

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 ;)

Meteor packages -- how does it work?

I downloaded a Meteor Starter project called MeteorAdmin.
In the root of its directory tree, you find a packages directory that contains few packages (boostrap, comments, few others) and also, in the .meteor directory there's a file called packages that defines the dependencies of this project.
What is the difference between them? What I found interesting is that .meteor/packages contains bootstrap as well. In theory shouldn't that be enough so that bootstrap would get downloaded to the project?
The meteor packages file simply lists all of the apps dependencies as well as the load order of each (top to bottom). You can edit this file if you know what you are doing, but it's probably better to leave it alone until you are more familiar with Meteor.
The way you add packages is by typing meteor add <package-name> in your terminal and then it will be added to your project. Additionally, the name of the package will be added to the bottom of your packages file.
A meteor app can have local packages that are defined in the packages folder of the root directory. This project likely is implementing it's own bootstrap package and then added it with the meteor command I listed above. Once a local package is added to your project with the meteor add command it's package name will appear in the packages file just like packages from Atmosphere. I hope that answers your question... Let me know if you were looking for something more specific.

Meteor: SCSS/SASS not loading after meteor update

I updated my meteor project to meteor 0.9.1 today. Previously I had a simple SCSS file with variables.
/*variables*/
$font: 200 20px/1.5 Helvetica, Verdana, sans-serif;
$color: #312F47;
After the update none of the scss seems to be implemented on the page (background-color is reverted to white for instance and all the styling elements are gone). Manually converting the scss to css does work. I have tried updated the various packages to no avail. Does anyone know if this is a known bug and/or how to fix this? Would be much appreciated.
I assumed you're using mrt:scss, and according to mrt:scss package page on Atmosphere, it's currently INCOMPATIBLE WITH METEOR 0.9.0 OR LATER.
You need to replace mrt:scss with fourseven:scss which is the same package compatible with Meteor 0.9.0 or later with a new name, since 0.9.0 is using Meteor packaging system and mrt is deprecated.

Resources