When I want to set "Underscore" (I used to use 'Grunt') and I put in .jshintrc.
"globals": {
"_": false,
Now with version 3.5.1 of Jhipster I use Gulp and I do not know how to configure it because there is no file .jshintrc.
Ans it gives me the error
angular.js:13550 ReferenceError: _ is not defined
Can somebody help me. Thank you.
JHipster replaced jshint with eslint in this change. Because of this, you should add the globals section to the file .eslintrc.json the same as it was in .jshintrc. (Similar issue)
Based on the ReferenceError from Angular, it looks like you don't have Underscore as a dependency in your index.html. Run bower install underscore --save to download and install Underscore (this adds it to bower.json), then run gulp inject:dep to inject the dependencies to index.html automatically.
Related
How can I use preprocessors in my ng2 app? I'm using angular-cli and the original docs are not clear enough for me. Besides, I want to use the styles globally, not only component-wide.
Install your CSS compiler: Search npm for your preffered extension language.
Tested and recommended for SASS: npm install node-sass --save-dev
Add your "to be processed" file to src/assets/css (with the normal file extension, e.g. .sass)
Add the style ref to the index.html file:
<link rel="stylesheet" href="assets/css/whatever.css"> - note the .css file extension.
Update your build file (angular-cli-build.js) with the folder of your "to be processed" files. This object HAS to be placed before the vendorNpmFiles-array.:
sassCompiler: { //(lessCompiler or stylusCompiler)
includePaths: [
'app/assets/css' //Only the folder, not your file!
]
}
Bonus answer: Why don't I use direct paths to files instead of the includePath? Because you may want to use variable files, so it could get really messy with absolute paths!
The Angular CLI has built in support for Sass/SCSS, Less, and Stylus. See here.
As of the Webpack update to the CLI, there are no extra steps other than renaming your stylesheets with the appropriate extension.
For the previous System.js/Broccoli versions, it was also necessary to install the preprocessor packages to your app, like so: npm install node-sass --save-dev.
It will automatically process the stylesheets within and under the src folder.
I'm trying to get Polymer 0.9 working with Meteor however Meteor is spitting out:
While building the application:
bower_components/polymer/polymer-micro.html:9: bad formatting in HTML template
bower_components/polymer/polymer-mini.html:9: bad formatting in HTML template
bower_components/polymer/polymer.html:17: bad formatting in HTML template
=> Your application has errors. Waiting for file change.
Is there any way to resolve the issue?
You should place the components in public/ at the root of your project.
I've had the same problems. I can't tell if you're using vulcanize, but I assume so.
What fixed me was:
Install Bower: npm install -g bower (bower.org)
Create a file in the root of the project called .bowerrc
Then, you want to tell bower where to install polymer components.
In that .bowerrc put:
{
"directory": "public/bower_components"
}
Now, use bower to install polymer
bower install --save Polymer/polymer#^1.2.0
If you're using other parts of polymer like paper and iron, you'll repeat the bower install step for those as well.
Then attempt starting up meteor again.
I've been working on a Meteor package for some time now and I have been been using a Meteor SCSS build package to compile my sass. Now for reasons like autoprefixer and such, I need to compile the SCSS outside of Meteor. My plan was to use Codekit but when I try to build the SCSS I get an error with no message at all. When I use the Sublime Text 2 SCSS build package I get an error as well. I have come to the conclusion that this is because of my Meteor package name. I have named it:
myusername:packagename
and as a folder that translates to
myusername/packagename
It replaces : with / and because of that, Codekit thinks the folder named myusername/packagename is two folders myusername -> packagename. That messes up the folder tree when Codekit tries to compile it.
Is there a good way to handle this?
To solve this problem, you can rename the directory of the package and then add an entry inside the Package.describe call in package.js:
Package.describe({
summary: "My package",
version: "0.0.1",
name: "myusername:packagename"
});
Now, the name of the package will be read from package.js and the directory can be called whatever you want.
In my meteor project I want to use gulp for tasks meteor doesn't support.
Anyway, the problem is that gulp uses a file called gulpfile.js which is loaded by meteor too and gives errors. So my question is, is there a way to tell meteor to ignore some files ?
UPDATE: One solution I can think of is to put gulpfile.js in the folder packages or public and run gulp as follows
$> gulp --gulpfile packages/gulpfile.js
UPDATE: Just noticed that meteor also seems to load node_modules files :(
Unfortunately, in the current release there's no way to tell Meteor to leave certain files alone, so you cannot have gulpfile.js in your main app folder.
You can, however, leave it in an ignored subfolder. Meteor ignores files and directories that ends with tilde ~, the /tests directory and all private files (those beginning with a dot .). So you can create a folder named for example gulp~ and use it for your gulp-related stuff.
The same holds for node_modules folder, you cannot have it in your application, and you shouldn't. If you want to use a node package in your Meteor application, you can do this with npm package.
Add it to your project with mrt add npm command.
Then create packages.json file with a list of all required packages, for example:
{
"something": "1.5.0",
"something-else": "0.9.11"
}
Afterwards, include your package with Meteor.require:
var something = Meteor.require('something');
If you want to use a node package in your gulp tasks, install it inside the ignored directory.
I'm new to the Yeoman/Grunt/Bower stack and I'm unsure if there is a proper way to remove a component/task from my project. I don't use CoffeeScript (which was packaged with the Yeoman generator) and it feels like I should be using a Grunt task or Bower command to remove the files/requirements/config/etc.
However, I can't find anything mentioning how to do this. Am I missing something or should I just remove the components by hand?
I don't believe there is an automated way of doing this; save for https://github.com/indieisaconcept/grunt-plugin but that's for the old release (0.3.9) of Grunt.
For Grunt tasks, simply remove the line in devDependencies in package.json and then remove the relevant section in grunt.initConfig and you will have uninstalled the plugin. Depending on how your Gruntfile looks, you may have to remove the grunt.loadNpmTasks(<package>) section for the relevant plugin. Then remove the directory in node_modules (or run npm uninstall <package>). Simple really.
Bower is even easier; remove the relevant line in bower.json and delete the directory it was installed (the default is bower_components).
Hope this helps. :)
You can remove a Grunt task by running the following command:
npm uninstall grunt-task-name --save
...where grunt-task-name is the name of the task you want to remove. The --save flag tells npm to update your package.json file as well as deleting the relevant package from your node_modules directory. (nb. if the task is listed under devDependencies - as it might well be - you might need to use the --save-dev flag instead).
For Bower the process is the same, only with bower uninstall instead of npm uninstall (as mentioned in Michael Onikienko's answer)
For Bower components:
bower uninstall componentName --save
This command will uninstall component from bower.json and from bower_components folder.