I've started playing with urigo/angular2-meteor-base, followed the official tutorial and now want to test a frontend css framework. After some googling I chose poetic:materialize-scss but I'm having some issue importing the scss file.
Installation from the official docs:
meteor add fourseven:scss
meteor add poetic:materialize-scss
Then import the scss in client/styles/main.scss:
#import "{poetic:materialize-scss}/sass/materialize.scss";
After running meteor in the project folder and I get the following error:
Errors prevented startup:
While determining active plugins:
error: conflict: two packages included in the app (fourseven:scss and angular2-compilers) are both trying to handle *.scss
error: conflict: two packages included in the app (fourseven:scss and angular2-compilers) are both trying to handle *.sass
So I've tried removing fourseven:scss and running meteor again:
Errors prevented startup:
While processing files with angular2-compilers (for target web.browser):
/client/styles/main.scss: Scss compiler error:
File to import {poetic:materialize-scss}/sass/materialize.scss not found in file:
/home/vagrant/Projects/NgMeteor/{}/client/styles/main.scss
This is a list of packages installed:
angular2-compilers 0.6.6
autopublish 1.0.7
dispatch:mocha-phantomjs 0.1.9
es5-shim 4.6.15
hwillson:stub-collections 1.0.3
insecure 1.0.7
meteor-base 1.0.4
mobile-experience 1.0.4
mongo 1.1.14
poetic:materialize-scss 1.97.6_1
practicalmeteor:mocha 2.4.5_6
reactive-var 1.0.11
shell-server 0.2.1
standard-minifier-css 1.3.2
standard-minifier-js 1.2.1
tracker 1.1.1
xolvio:cleaner 0.3.1
Not sure if I'm importing the scss file from the right location... does anyone having the same issue?
I am not sure how to include a meteor package scss but I do know how to include a npm package so as a solution you could just install it via npm npm install materialize-css and then include it. Seems to be located here https://github.com/Dogfalo/materialize/blob/master/sass/materialize.scss so you should be able to do
#import "{}/node_modules/materialize/sass/materialize.scss";
Also, do you know about https://github.com/angular/material2 ? I'd recommend using that instead.
Related
I am running a gatsby project with tailwind css with version of tailwind 2.0.2.
But while running the project i am getting a package error "Package subpath './lib/node' is not defined by "exports"
How to solve this issue?
Thank you
Possibly there is a version mismatch between the tailwindcss package and the #tailwindcss/node package.
It seems that the version of tailwindcss package that you're using is 2.0.2 and this version is not compatible with the #tailwindcss/node package,
Try to update these package using
npm install tailwindcss#latest
and also update your gatsby-plugin-tailwindcss
And then delete node modules folder and package-lock.json and then run npm install again.
Hope it helps!
I have a meteor application with the following packages:
$ meteor list
accounts-password 1.5.3 Password support for accounts
accounts-ui 1.3.1 Simple templates to add login widget...
blaze-html-templates 1.1.2 Compile HTML templates into reactive...
ecmascript 0.14.2 Compiler plugin that supports ES201...
es5-shim 4.8.0 Shims and polyfills to improve ECMAS...
fourseven:scss 4.12.0 Style with attitude. Sass and SCSS ...
iron:router 1.1.2 Routing specifically designed for Me...
jquery 1.11.11* Manipulate the DOM using CSS selec...
meteor-base 1.4.0 Packages that every Meteor app needs
mobile-experience 1.0.5 Packages for a great mobile user exp...
mongo 1.8.1 Adaptor for using MongoDB and Minimo...
reactive-var 1.0.11 Reactive variable
shell-server 0.4.0 Server-side component of the `meteor...
standard-minifier-css 1.6.0 Standard css minifier used with Mete...
standard-minifier-js 2.6.0 Standard javascript minifiers used w...
tracker 1.2.0 Dependency tracker to allow reactive...
typescript 3.7.5 Compiler plugin that compiles TypeSc...
* New versions of these packages are available! Run 'meteor update'
to try to update those packages to their latest versions. If your
packages cannot be updated further, try typing
`meteor add <package>#<newVersion>` to see more information.
The atmosphere package jquery is available with version 3.0.0. I had that until installing iron-router. I was able to successfully get iron-router installed by following this advice: https://forums.meteor.com/t/iron-router-jquery-dependency/51374 (specifically meteor add iron:router --allow-incompatible-update).
I'd like to use the newer 3.0.0. I don't get the impression there is any true incompatibility within iron-router.
However, if I try to add it, I get:
$ meteor add jquery#3.0.0
-error: Conflict: Constraint jquery#1.0.0 is not satisfied by jquery
3.0.0.
Constraints on package "jquery":
* jquery#3.0.0 <- top level
* jquery#1.11.9 || 3.0.0 <- blaze 2.3.4 <- accounts-base 1.5.0 <-
accounts-password 1.5.3
* jquery#1.11.9 || 3.0.0 <- blaze 2.3.4 <- blaze-html-templates
1.1.2
* jquery#1.0.0 <- iron:dynamic-template 1.0.12 <- iron:controller
1.0.12 <- iron:router 1.1.2
* jquery#1.0.0 <- iron:location 1.0.11 <- iron:router 1.1.2
Initially, I had a hard time seeing where it was getting 1.0.0 from for the iron:* dependencies since there was no explicit version listed:
https://github.com/iron-meteor/iron-dynamic-template/blob/devel/package.js#L14
https://github.com/iron-meteor/iron-location/blob/master/package.js#L13
Then I found this in the documentation for api.versionsFrom(meteorRelease):
Use versions of core packages from a release. Unless provided, all packages will default to the versions released along with meteorRelease. This will save you from having to figure out the exact versions of the core packages you want to use. For example, if the newest release of meteor is `METEOR#0.9.0 and it includes jquery#1.0.0, you can write api.versionsFrom('METEOR#0.9.0') in your package, and when you later write api.use('jquery'), it will be equivalent to api.use('jquery#1.0.0').
So that seems to be what is happening -- jquery#1.0.0 was tied to METEOR#0.9.2.
So... aside from the option of checking out the iron-* packages into my local project as custom packages to override the api.versionsFrom(meteorRelease) in a custom fork to a modern release (or rather specify a specific jquery version since I believe it is no longer a core package)... is there any way forcefully update to jquery#3.0.0 despite what it thinks is a conflict?
Unfortunately --allow-incompatible-update does not seem to work in this instance.
This a bit of opinionated but if you want to have a router without dependencies to outdated packages you should go with ostrio:flow-router-extra which allows you even to omit jQuery or install jQuery using the npm package.
Since Meteor 1.8.3 there is also no hard dependency between Blaze and jQuery, allowing to install the latest jQuery from npm registry, which is important from a security perspective.
Check out:
https://github.com/VeliovGroup/flow-router
https://github.com/meteor/meteor/blob/devel/History.md
Use #= to install a specific pkg version. You'll need to remove the npm jquery pkg if you downgrade.
meteor add jquery#=1.11.11
meteor npm remove jquery
meteor add iron:router
URL: http://www.angular-meteor.com/tutorials/socially/angular2/search-sort-pagination-and-reactive-vars
While I am following the tutorial to section 12.4, the compiler always complains:
[web.browser] client/parties-list/parties-list.ts (28, 40): Cannot find name 'ReactiveVar
Then, I type "meteor list" in my command line and I have the following:
accounts-password 1.1.4 Password support for accounts
anti:fake 0.4.1 Random text and data generator
barbatus:ng2-meteor-accounts 0.1.6 Meteor Accounts for Angular2
barbatus:ng2-meteor-accounts-ui 0.1.3 Meteor Accounts UI for Angular2
barbatus:ng2-pagination 0.1.3 Angular2 Pagination Components
es5-shim 4.1.14 Shims and polyfills to improve ECMAScr...
jquery 1.11.4 Manipulate the DOM using CSS selectors
meteor-base 1.0.1 Packages that every Meteor app needs
mobile-experience 1.0.1 Packages for a great mobile user experi...
mongo 1.1.3 Adaptor for using MongoDB and Minimongo...
reactive-var 1.0.6 Reactive variable
session 1.1.1 Session variable
standard-minifiers 1.0.2 Standard minifiers used with Meteor app...
tracker 1.0.9 Dependency tracker to allow reactive ca...
urigo:angular2-meteor 0.4.4 Angular2 and Meteor integration
The reactive-var is clearly installed. But why the compiler still complain cannot find 'ReactiveVar'?
Make sure your typings are referenced correctly and are up to date.
I am using Meteor 1.2.1 and ionic2-meteor, so I have a typings folder.
Make sure you have typings NPM module installed.
npm install typings -g
And then install the typings for meteor
typings install meteor --ambient
typings install es6-promise --ambient
typings install es6-shim --ambient
Include the main.d.ts file in your tsconfig.json
"typings": [
"typings/ionic2-meteor/ionic-framework/ionic.d.ts",
"typings/ionic2-meteor/ionic2-meteor.d.ts",
"typings/angular2-meteor/angular2-meteor.d.ts",
"typings/main.d.ts"
]
Make sure the meteor.d.ts files installed contain the following:
declare var ReactiveVar: ReactiveVarStatic;
interface ReactiveVarStatic {
new<T>(initialValue: T, equalsFunc?: Function): ReactiveVar<T>;
}
interface ReactiveVar<T> {
get(): T;
set(newValue: T): void;
}
In my case I had to update my meteor.d.ts files (main and browser) because they did not contain the ReactiveVar declaration and interface.
I'm trying to create a Meteor package, which has, as a dependency the package ian:accounts-ui-bootstrap-3. I added the dependency in my package.js like this:
Package.onUse(function(api) {
api.versionsFrom('1.1.0.2');
api.use(['ian:accounts-ui-bootstrap-3'], 'client');
api.addFiles('package-name.js');
});
After I add my package in the console, the following packages are added to the project:
accounts-base added, version 1.2.0
me:my-package-name added, version 0.0.1
handlebars added, version 1.0.3
ian:accounts-ui-bootstrap-3 added, version 1.0.7
localstorage added, version 1.0.3
service-configuration added, version 1.0.4
stylus added, version 1.0.7
The issue is that the accounts system is not working. In the browser I get this error:
Uncaught TypeError: Cannot read property 'push' of undefined
'push' being the property of
Template.__body__.__contentParts
If I add the ian:accounts-ui-bootstrap-3 manually it works fine, I don't get the error. But when I do that, the packages which are installed on the project are a little different:
accounts-base added, version 1.2.0
anti:i18n added, version 0.4.3
ian:accounts-ui-bootstrap-3 added, version 1.2.59
localstorage added, version 1.0.3
service-configuration added, version 1.0.4
stylus added, version 1.0.7
As you can see I don't have handlebars anymore but instead anti:i18n. I tried to install the anti:i18n as a dependency in my package but I got the same browser error.
Can anyone say, what I'm doing wrong and why the package behaves like that when is installed differently (manual vs dependency).
To give you this example I just created an empty package, with only this dependency, so nothing else can affect the number of packages being installed.
Try using 'imply' instead of 'use'. This exposes the package to the global scope. Without much more in details of your problem this is probably most likely to solve the issue (I hope):
api.imply(['ian:accounts-ui-bootstrap-3']);
Instead of
api.use(['ian:accounts-ui-bootstrap-3'], 'client');
I found the issue. When installed as a dependency the package: ian:accounts-ui-bootstrap-3 will install version 1.0.7 which is an old one.
When it is installed manually, it installs version 1.2.59 and this one has the features I want.
So to solve the issue I just specified the needed version in the dependency using '#'.
I think this have to be changed, like when you install a package via a dependency, it should install the latest version and an older one only if is specified by #.
I'm wanting to try out the "gm" node package. I've currently got node-gd installed and want to see what gm offers.
I'm using Meteor 0.9.0.1 and this is my packages.json file:
{
"node-gd":"0.2.3",
"gm" :"1.16.0"
}
I ran "meteor update" .... It didn't install, so I guess I've done something wrong.
me#ubuntu:~/myapp$ meteor update
Refreshing package metadata. This may take a moment.
Refreshing package metadata. This may take a moment.
upgraded autoupdate from version 1.0.4 to version 1.0.5
upgraded less from version 1.0.5 to version 1.0.6
myapp: updated to Meteor 0.9.0.1.
All your package dependencies are already up to date.
Can anyone advise how to install this?
I think you need meteorhacks:npm
meteor add meteorhacks:npm
meteor
This should trigger the installation of the npm modules. Of note may be the new notation is Meteor.npmRequire and no longer Meteor.require