Ember.js and UIKIT - ember.js

I try to add UIKIT to my Ember.js project
how to do it?
1: bower install --save uikit
All work fine on bower.json
i don't know what to put on ember-cli-build.js
e.g : app.import('bower_components/uikit/css/uikit.css');
How to do about js files?
Thanks

you import js files same way as css files,
if js files are in bower_components/uikit/js/uikit.js you do
app.import('bower_components/uikit/js/uikit.js');

Related

Can I add Daisy UI plugin to my django project? If yes , Please how do I do it?

I have already installed tailwind CSS to my django project and it works just fine,
I tried using the documentation procedure I saw at the daisyui website
npm i daisyui
and I also added the plugin to my tailwin.config.js file also
module.exports = { //... plugins: [require("daisyui")], }

Ember addon: Could not find module from within component

In a new ember 3.28 addon project:
npm install chart.js --save
ember g component-class chart
Insert <Chart /> into application.hbs on dummy app and in addons/component/chart.js, add this
import Chart from 'chart.js/auto';
Running app gives:
Uncaught Error: Could not find module `chart.js/auto` imported from `chartjs-test/components/chart`
Yet if the import Chart goes into the application.js route in the dummy app instead, it works. How can you import this module correctly from within an addon component?
Update: Same issue with other installed packages eg. import chroma from "chroma";
Turns out you need to add the same import statement into app/component/chart.js:
UPDATE:
The above isn't the proper way and causes issues when using the addon elsewhere. The real solution is to move ember-auto-import to dependencies from devDependencies in package.json of the addon

MaterializeCSS framework inside of ionic 2 app (third-party libs)

I just want to use MaterializeCSS framework inside my ionic 2 app instead of native ionic components.
I read this Third-party libs IONIC
And I did :
"npm install --save materialize-css" - for installing materializeCSS in node_module folder
"npm install --save #types/materialize-css" - for typescript intellisense
And added in map.ts file:
import { Materialize } from 'materialize-css';
And this line in map.html file :
<a class="waves-effect waves-light btn">button</a>
Hoping that I will see beautiful MaterializeCSS button.
Unfortunatelly it doesnt work.
I tried also simply add css and js files in my main index.html file like this :
<link rel="stylesheet" type="text/css" href="../node_modules/materialize-css/bin/materialize.css">
<script src="../node_modules/materialize-css/bin/materialize.js"></script>
But somehow it doesnt see node_modules folder.
After hours of effort Im asking for help.

ionic2 rc0 where to put all sass files?

In Ionic Beta 2 we have decentralized our sass/scss files to our components.
Now in RC0 the upgrade guide by Ionic team is not their finest work, unfortunately.
This is how my app.scss looks like, it imports all our decentralised sass file:
#import '../+user/user-list/user-list.component';
Now imaging above 100 fold. What do I do to upgrade to RC0?
Turns out imports work like before. Against Ionic RC0 Upgrade Documentation there is no need to change any of your imports inside your app.scss. All good.
#import '../+user/user-list/user-list.component';
Works.
You need not import your scss files in ionic RC0. All you need is to create an scss file with the name you use in .ts selector.
Eg:
#Component({
selector: 'registration',
templateUrl: 'registration.html'
})
In this case i have to create registration.scss for scss. Refer 36th point under Modifying your Existing Project in https://github.com/driftyco/ionic/blob/master/CHANGELOG.md#tab-inputconfig-7143

Include bower component in Ember Addon

How do you need to work in an Ember addon, to include bower packages while installing the addon.
1) I installed the bower package I want to include in my addon with bower instal packagename --save
2) then in my addon, in the root, edited index.js, to look like this:
/* jshint node: true */
'use strict';
module.exports = {
name: 'my-ember-component',
included: function(app) {
this._super.included(app);
if(app.import){
app.import(app.bowerDirectory + '/path-to-package/package.js');
}
}
};
However, when I try to start my application where the addon is installed, I get a
ENOENT: no such file or directory, stat '/my-ember-application/tmp/source_map_concat-input_base_path-bWTPoVC9.tmp/0/bower_components/path-to-package/package.js
I want to avoid having to manually add the bower dependency to every application I install my addon in.
Note: I am using npm link to debug my addon, perhaps this could be a source of the problem?
Normally the addon's bower componenets are added to the consuming project during ember install addon.
But since you're doing local development and using npm link. You need to simulate this. You can do this with:
ember generate your-addon-name
Explanation.
Check out the docs on default blueprints in the ember cli docs.
A blueprint with the same name as the addon (unless explicitly
changed, see above) will be automatically run after install (in
development, it must be manually run after linking). This is where you
can tie your addon’s bower dependencies into the client app so that
they actually get installed.
In short, you need to create a default blueprint for your app and add the bower dependency there.
Create your file:
//blueprints/your-addon-name/index.js
module.exports = {
normalizeEntityName: function() {}, // no-op since we're just adding dependencies
afterInstall: function() {
return this.addBowerPackageToProject('BOWER PACKAGE NAME'); // is a promise
}
};
Then when you run the default blueprint with
ember generate your-addon-name