-
Notifications
You must be signed in to change notification settings - Fork 12k
feat(component): add less support #115
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Changes from all commits
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,23 @@ | ||
'use strict'; | ||
|
||
var GenerateCommand = require('ember-cli/lib/commands/generate'); | ||
|
||
module.exports = GenerateCommand.extend({ | ||
availableOptions: [ | ||
{ name: 'dry-run', type: Boolean, default: false, aliases: ['d'] }, | ||
{ name: 'verbose', type: Boolean, default: false, aliases: ['v'] }, | ||
{ name: 'blueprint', type: String, default: 'ng2', aliases: ['b'] }, | ||
{ name: 'name', type: String, default: '', aliases: ['n'] }, | ||
{ name: 'style', type: String, default: 'css', aliases: ['s'] } | ||
], | ||
|
||
_defaultBlueprint: function() { | ||
if (this.project.isEmberCLIAddon()) { | ||
return 'addon'; | ||
} else { | ||
return 'ng2'; | ||
} | ||
}, | ||
}); | ||
|
||
module.exports.overrideCore = true; |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,6 +1,7 @@ | ||
var Concat = require('broccoli-concat'); | ||
var configReplace = require('./broccoli-config-replace'); | ||
var compileWithTypescript = require('./broccoli-typescript').default; | ||
var compileLess = require('broccoli-less'); | ||
var fs = require('fs'); | ||
var Funnel = require('broccoli-funnel'); | ||
var mergeTrees = require('broccoli-merge-trees'); | ||
|
@@ -45,7 +46,7 @@ Angular2App.prototype.toTree = function () { | |
'systemjs/dist/system.src.js' | ||
], | ||
destDir: 'vendor' | ||
}) | ||
}); | ||
|
||
// var appJs = new Concat(mergeTrees([tsTree, jsTree]), { | ||
// inputFiles: [ | ||
|
@@ -55,7 +56,13 @@ Angular2App.prototype.toTree = function () { | |
// outputFile: '/app.js' | ||
// }); | ||
|
||
return mergeTrees([assetTree, tsSrcTree, tsTree, jsTree, this.index(), vendorJsTree], { overwrite: true }); | ||
var lessTree = new Funnel(sourceTree, { | ||
include: ['**/*.less'], | ||
allowEmpty: true | ||
}); | ||
var lessSrcTree = compileLess(lessTree); | ||
|
||
return mergeTrees([assetTree, tsSrcTree, tsTree, jsTree, this.index(), lessSrcTree, vendorJsTree], { overwrite: true }); | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. I'm not sure how the Instead of There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. The tricky thing about here is that we would need to pull the config from somewhere - the only approaches I see right now is to check for the existence of a less file in a component directory (a hack), or save the config somewhere when generating the component. Saving the config somewhere might be ok, since we should be able to safely assume that a user is going to be only using one CSS preprocessor ever, but then comes the question of how should we be saving it. Should we save that information right in the generated package.json? There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. I think that the package.json is good enough for prototyping. There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Alright, will try to fix that up sometime this week. There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. @wesleycho here is an example of current usage of |
||
}; | ||
|
||
/** | ||
|
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,108 @@ | ||
'use strict'; | ||
|
||
var ng = require('../helpers/ng'); | ||
var expect = require('chai').expect; | ||
var Blueprint = require('ember-cli/lib/models/blueprint'); | ||
var path = require('path'); | ||
var tmp = require('../helpers/tmp'); | ||
var root = process.cwd(); | ||
var conf = require('ember-cli/tests/helpers/conf'); | ||
var forEach = require('lodash/collection/forEach'); | ||
var existsSync = require('exists-sync'); | ||
|
||
var defaultIgnoredFiles = Blueprint.ignoredFiles; | ||
|
||
describe('Acceptance: ng generate', function() { | ||
this.timeout(20000); | ||
|
||
before(function() { | ||
conf.setup(); | ||
}); | ||
|
||
after(function() { | ||
conf.restore(); | ||
}); | ||
|
||
beforeEach(function() { | ||
Blueprint.ignoredFiles = defaultIgnoredFiles; | ||
|
||
return tmp.setup('./tmp') | ||
.then(function() { | ||
process.chdir('./tmp'); | ||
}).then(function() { | ||
return ng([ | ||
'new', | ||
'foo', | ||
'--skip-npm', | ||
'--skip-bower', | ||
'--skip-git' | ||
]); | ||
}); | ||
}); | ||
|
||
afterEach(function() { | ||
return tmp.teardown('./tmp'); | ||
}); | ||
|
||
function confirmBlueprinted(files) { | ||
forEach(files, function(file) { | ||
expect(existsSync(file)); | ||
}); | ||
} | ||
|
||
function confirmBlueprintedComponent(settings) { | ||
settings = settings || { | ||
style: 'css' | ||
}; | ||
|
||
var componentPath = path.join(process.cwd(), 'src/app/components/bar'); | ||
|
||
var files = [ | ||
path.join(componentPath, 'bar.' + settings.style), | ||
path.join(componentPath, 'bar.html'), | ||
path.join(componentPath, 'bar.ts'), | ||
path.join(componentPath, 'bar.spec.ts') | ||
]; | ||
|
||
confirmBlueprinted(files); | ||
} | ||
|
||
function confirmBlueprintedService() { | ||
process.chdir('./src/app/services/bar'); | ||
|
||
var servicePath = path.join(process.cwd(), 'src/app/services/bar'); | ||
|
||
var files = [ | ||
path.join(servicePath, 'bar.ts'), | ||
path.join(servicePath, 'bar.spec.ts') | ||
]; | ||
|
||
confirmBlueprinted(files); | ||
} | ||
|
||
it('component', function() { | ||
return ng([ | ||
'generate', | ||
'component', | ||
'bar' | ||
]).then(confirmBlueprintedComponent()); | ||
}); | ||
|
||
it('component with less', function() { | ||
return ng([ | ||
'generate', | ||
'component', | ||
'bar', | ||
'--style=less' | ||
]).then(confirmBlueprintedComponent({style: 'less'})); | ||
}); | ||
|
||
it('services', function() { | ||
return ng([ | ||
'generate', | ||
'service', | ||
'bar' | ||
]).then(confirmBlueprintedService); | ||
}); | ||
|
||
}); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
we need a test for this