Does NYC/Istanbul code reporting tool ignore template and style tags within a VueJS component file (with the extension .vue). Is nyc smart enough to do that?
Yes, it is possible #light24bulbs! I've made nyc + Vue + Mocha work here.
I've failed some times before making it work, thought. The thing that made the trick was to manually select the defaults while (re)creating the project with vue-cli. Vue-cli has proven to be much better than me configuring webpack.
$ node --version
v10.16.0
$ vue --version
3.11.0
//package.json
...
"scripts": {
...
"test": "nyc vue-cli-service test:unit"
},
"nyc": {
"extension": [
".js",
".vue"
]
},
"devDependencies": {
"nyc": "^14.1.1",
...
Related
I keep on getting ES6 jshint warnings, for example:
''import' is only available in ES6 (use 'esversion: 6'). (W119)'
source: 'jshint'
code: 'W119'
I followed suggestions such as
Adding a .jshintrc file in the root with
{
"esversion": 6
}
Adding the following to the user and\or workspace settings:
"jshint.options":{
"esversion":6
}
But I still get the warning. Are there other things that I can do?
Thanks
Add a file .jshintrc into your project root, the warnings will disappear.
{
"esversion": 6
}
jsHint's ES6 warning can be solved easily by the following JSON code without creating any new file:
Paste the code inside the JSON editor of the "user settings".
"jshint.options": { "esversion": 6 },
jsconfig.json file which defines the JavaScript target to be ES6
I create a jsconfig.json file under my project directory and add codes in it:
{
"compilerOptions": {
"target": "ES6"
},
"exclude": [
"node_modules",
"**/node_modules/*"
]
}
According to the JSHint documentation: https://jshint.com/docs/ "In addition to using configuration files you can configure JSHint from within your files using special comments. These comments start with a label such as jshint or globals..."
So, a /* jshint esversion: 6 */ comment will work on the top of each file targeting ES6.
This have the advantage of you can switch these directives on and off per file or per function: "These comments are function scoped meaning that if you put them inside a function they will affect only this function's code."
I'd like to add a grunt task that accepts a version number. This version number will then be set in the package.json file. I have found grunt-bump, which bumps the version number, but I would like to set the version number to a known value, that will come from the build server.
Grunt task:
grunt.registerTask('setversion', function() {
// Something to go here to update the version number.
});
package.json:
{
"name": "scoreboard",
"version": "0.2",
...
}
Anyone got any idea's?
You could use something like:
grunt.registerTask('setversion', function(arg1) {
console.log("Attempting to update version to "+arg1);
var parsedJson= grunt.file.readJSON("package.json");//read in the current
parsedJson["version"] = arg1; //set the top level version field to arg1
grunt.file.write("package.json", JSON.stringify(parsedJson, null, 2));
});
add in some error checking etc.. make sure package.json is writable and execute with grunt setversion:newVersion e.g.: grunt setversion:0.3
Thanks for the answer, but it turned out to be a lot more straightforward. I am using TeamCity, so I ran an NPM task with the following command, where %system.build.number% follows the pattern n.n.n, e.g.: 0.1.6.
--no-git-tag-version version %system.build.number%
I apologize for being a complete grunt newbie. I have node.js installed, i have grunt installed, and I am able to run "grunt less" on a gruntfile.js with a less target. It "runs", but it doesn't do anything.
My .less files live in a source respository: C:\Workspace\dev, in directories like:
C:\Workspace\dev\Webs\RP\Content\p1\less\p1.less
C:\Workspace\dev\Webs\RP\Content\p2\less\p2.less
My gruntfile.js file lives in C:\Tools\Grunt (at least as I am learning), so I need to run the "grunt less" command from C:\Tools\Grunt.
Some questions:
1. How can I run grunt from "anywhere" rather than where the gruntfile.js lives? I'm trying to integrate compiling less files as part of the build.
How do I specify the "home directory" for the .less files so I don't have to specify full paths to source and dest? In my case, home directory would be C:\Workspace\dev\Webs\RP\Content, and my less files: would be something like:
"rp1/less/rp1.css": "rp1/less/rp1.less" (there are several that need to be compiled).
Thanks in advance.
module.exports = function(grunt){
require("matchdep").filterDev("grunt-*").forEach(grunt.loadNpmTasks);
grunt.initConfig({
less: {
options: {
paths: ["/c/Workspace/dev/Webs/RP/Content"]
},
files: {
"rp1/less/rp1.css": "rp1/less/rp1.less",
"rp1/less/ie9.css": "rp1/less/ie9.less",
"rp2/less/rp2.css": "rp2/less/rp2.less",
"rp3/less/rp3.css": "rp3/less/rp3.less",
"rp4/less/rp4.css": "rp4/less/rp4.less",
"rp4/less/ie9.css": "rp4/less/ie9.less",
"rp5/less/rp5.css": "rp5/less/rp5.less",
"rp5/less/ie9.css": "rp5/less/ie9.less"
}
}
});
grunt.loadNpmTasks('grunt-contrib-less');
grunt.registerTask('default', ['less']);
};
You should read up on how to use the files object in Grunt. Basically, you want a wildcard pattern, rather than having to specify each file individually. I think something like this might work:
files: [
{
expand: true,
src: ['**/*.less'],
},
]
Haven't tested though. You might need a 'dest' property also (either empty or just './') if it's not smart enough to figure it out on its own.
Also consider using gulp instead of grunt if you're just starting your project, I find the way it separates out the 'src' and 'dest' config rather than combining them into a 'files' object much more natural. Also I've worked with less and sass and have found the latter to be vastly superior (mostly because of the mixin libraries available, but it's also a more capable language in its own right), and it's pretty easy to move across from one to the other.
I'm using yeoman, grunt and bower and highstock library.
When I build my app (grunt build) this generate these 3 lines
<script src="bower_components/highstock/js/highcharts.src.js"></script>
<script src="bower_components/highstock/js/highstock.src.js"></script>
<script src="bower_components/highstock/js/highcharts-more.src.js"></script>
BUT, as highstock includes high charts this line should not be there and this makes errors
<script src="bower_components/highstock/js/highcharts.src.js"></script>
the error is http://www.highcharts.com/errors/16
How to remove this line in the build ?
Thanks for your help.
I believe this is grunt-bower-install at work. gbi is a task that looks through the dependencies in your project's bower.json, and injects their appropriate references into your HTML. In order for it to work, each Bower package needs to specify a main property in its bower.json file.
So, the bower.json file for highcharts looks like this:
{
"name": "highcharts",
"version": "v3.0.10-modified",
"main": [
"js/highcharts.src.js",
"js/highcharts-more.src.js",
"js/modules/exporting.src.js"
],
"ignore": [
"errors",
"exporting-server",
"gfx",
"lib",
"samples",
"studies",
"test",
"tools",
"utils",
"ant",
"build.md",
"build.properties",
"build.xml"
]
}
Because it lists 3 different files, gbi is interpreting that as "you need these three files to make this Bower package work." I have no familiarity with highcharts, but if you know that to be false-- in other words, you only need one of those files for it to work-- then it would be helpful to you and others to send a pull request correcting their bower.json file.
As far as a fix for now, you can specify an overrides property in your project's bower.json, that lists only the file you need, such as:
{
"name": "your-project",
"dependencies": {
"highcharts": "~3.0.0"
},
"overrides": {
"highcharts": {
"main": "js/highcharts.src.js"
}
}
}
The next time you run grunt bowerInstall, it will sort itself out.
Note: Make sure you're using the latest grunt-bower-install to use the new overrides feature.
I am using command line options in my grunt script: http://kurst.co.uk/transfer/Gruntfile.js
However the command grunt --vers:0.0.1 always returns 'undefined' when I try to get the option:
var version = grunt.option('vers') || '';
Can you help me get this working ?
I tried different (CLI) commands:
grunt vers:asd
grunt -vers:asd
grunt vers=asd
as well as using :
grunt.option('-vers');
grunt.option('--vers');
But no luck so far. Hopefully I am missing something simple.
This is my package.js file:
{
"name": "",
"version": "0.1.0",
"description": "Kurst EventDispatcher / Docs Demo ",
"devDependencies": {
"grunt": "~0.4.1",
"grunt-contrib-yuidoc": "*",
"grunt-typescript": "~0.1.3",
"uglify-js": "~2.3.5",
"grunt-lib-contrib": "~0.6.0",
"grunt-contrib-uglify":"*"
}
}
The proper syntax for specifying a command line argument in Grunt is:
grunt --option1=myValue
Then, in the grunt file you can access the value and print it like this:
console.log( grunt.option( "option1" ) );
Also, another reason you are probably having issues with --vers is because its already a grunt option that returns the version:
★ grunt --vers
grunt-cli v0.1.7
grunt v0.4.1
So it would probably be a good idea to switch to a different option name.
It is worth mentioning that as the amount of command line arguments you want to use grows, you will run into collisions with some arguments that grunt uses internally.
I got around this problem with nopt-grunt
From the Plugin author:
Grunt is awesome. Grunt's support for using additional command line options is not awesome. The current documentation is misleading in that they give examples of using boolean flags and options with values, but they don't tell you that it only works that way with a single option. Try and use more than one option and things fall apart quickly.
It's definitely worth checking out