Is there a list of variables, that I can use in my grunt config files? Something which I know from maven like project.build.dir..
Several things may be of help to you.
1 - You can access any of the operating system's environment variables via process.environment, for example:
console.log( process.env.HOME );
2 - The typical approach to package-level information is to read it from package.json via the grunt.initConfig method. See the Project and Task Configuration Section of the Getting Started Guid.
3 - Since the convention is to have Gruntfile.js in the root of your project, all the other paths are relative to this, so when you have something like this in your task configuration, it's all relative to Gruntfile
files: {
src: './Libraries/Foo/foo.js'
}
Related
I want to apply this deno.json configuration file to all my deno projects:
{
"fmt": {
"options": {
"indentWidth": 4
}
}
}
Is there a way to globally apply this configuration so I don't have to have this deno.json file in every project?
I'm using VSCode, Ubuntu and Deno 1.28.1.
Because of the way that the Deno VS Code extension overrides/suppresses the built-in TS language server, it is not advised to enable the extension globally: this would cause problems in every non-Deno TypeScript project.
That said, you can create a single deno.json(c) file at a high-level location in your filesystem — for example: in your home directory. To use a concrete example location — on Linux — /home/your_username/deno.json.
Then, when configuring a new VS Code project, you only need to configure the location of the config file in .vscode/settings.json in order for the extension to use it:
{
"deno.enable": true,
"deno.config": "/home/your_username/deno.json"
}
When using Deno in the CLI, it will automatically walk your filesystem and find the nearest parent config file. From the manual:
Since v1.18,
Deno will automatically detect deno.json or deno.jsonc configuration file if
it's in your current working directory (or parent directories).
Regardless of the above, this strategy is not advised: a better approach might be to simply to create a personal CLI script/function which will generate a new deno config and VS Code config from a template that you create. This way, each of your projects maintains its own configuration data (a good thing) and you also don't have to manually configure each new one because you did the work once to create the template generation script (win-win).
I have an angular application built in Visual Studio 2017. I'm using npm, gulp, and browserify to help me manage dependencies, bundling, and minification. Everything had been going along well until I tried to pull in moment, moment-timezone, and angular-moment, when I started having trouble getting these libraries to play nice.
I'm assuming that the issue is related to the way these libraries are being included in my application due to some mistake or bug with the way I'm using npm, gulp, browserify, or the require('...') statements. So, it seems like it'd be helpful for me to explain how I'm doing that.
First, in VS, I added a node configuration file to the project (package.json) and it contains a list of all of my dependencies that will be installed through npm. So, for example, my package.json looks something like this:
{
"property": value,
"otherProperty": otherValue,
"dependencies": {
"angular": "1.5.8",
"angular-ui-router": "1.0.3",
"jquery": "3.1.0",
"moment": "2.18.1",
"moment-timezone": "0.5.13",
"angular-moment": "1.0.1"
}
}
Now, that makes npm go ahead and download everything and stick it in my node_modules folder, but it doesn't actually include anything in my application. So there's a gulp task similar to the following:
var dependencies = Object.keys(packageJson && packageJson.dependencies || {});
browserify({cache: {}, packageCache: {} }})
.require(dependencies)
.bundle()
.pipe(source(js/siteLibs.js))
.pipe(buffer())
.pipe(gulp.dest("."));
Ok, so if that gulp task works correctly, I'll have a file called siteLibs.js that contains all of the js from my npm dependencies, and then I can just make a single script tag to reference siteLibs.js.
The next part, I'm a little hazy on, but do I still have to have an actual require('...') statement in my app for moment, angular-moment, and moment-timezone? If it is required, why? What is it doing?
Now, once at this point, I should be able to go ahead and let my angular app take a dependency on moment, moment-timezone, or angular-moment, and, indeed I can. The issue is that when I call moment.locales(), which is supposed to return a list of all loaded locales, it has naught but 'en-US'. Ok, that's expected because I never loaded any locales. So if I go in my app and say:
require('moment/locales/en-gb');
require('moment/locales/en-au');
require('moment/locales/fr-ca');
It makes no difference. The only loaded locale is en-US. What is the right way to go about getting those additional locales loaded given that I'm using npm, gulp, and browserify?
Refer to this in moment's documentation
https://momentjs.com/docs/#/use-it/browserify/
I am completely new to all this, 'Bower' and 'Gulp' and Laravel 'Elixir'. I purchased a template that uses them (unfortunately) and now I need some help on how to go about implementing them. I have already installed NPM and Bower. All my packages have been downloaded into:
resources > assets > vendor
This is a screenshot:
Now my question is how do I include all those packages I downloaded in my view? From my understanding I can't run less files directly in the browser, it only runs once due to 'browser caching' or something like that, also the JS scripts are just too many to include in my page.
I want a way where I can work on my files and have them automatically compiled with the compiled files being referenced in my app.php file.
This is a link to the GulpJS file included in my template: http://pastebin.com/3PSN6NZY
You do not need to compile every time someone visits. The compiled sass/js should be run in dev and then the output files referenced.
If you have gulp installed on the project, you should see a gulp.js file in the root of your project. If not, visit here for instructions:
Gulp/Elixer installation and setup
In your gulp.js file:
var elixir = require('laravel-elixir');
elixir(function(mix) {
mix.less([
'app.less',
'normalize.less',
'some-other-less.less',
'and-another.less'
]);
mix.scripts(['app.js', 'some-other-js.js'], 'public/js/output-file.js');
});
While in development you can run gulp watch from the command line to listen for changes and run compile tasks when it hears a change. Then you simply reference the output files in the public directory as you normally would.
If you don't want to listen, you can just run the gulp command for a single once-off task run.
The docs are pretty straight forward and can be found here:
Gulp/Elixer docs
First of all i have not really understood what gruntjs really does, but i have some idea. I am hoping that by seeing how and for what it is used i will come to see its purpose. So could anyone explain to me what is gruntjs, why it's used, and for what it's used.
Is it beneficial for indie developer or for team or both?
Is it only for big projects?
Is it just a trend/fad? And makes things uncomplicated for no reason?
So basically in short What are benefits of it and for whom?
Grunt is a task runner. That's all it does. If you're a Java guy, think Ant.
Developers use Grunt to automate the running of tasks, especially sequences of tasks. Some of those tasks are so prevalent, such as linting JavaScript, running unit tests, or minifying JavaScript, that they're packaged up as plugins and freely available for you to use. For example, grunt-contrib-clean is a plugin that contains a clean task. This task simply deletes the contents of a list of directories, a common step in a build process. To use it, you first pull the plugin into you Gruntfile.js using
grunt.loadNpmTasks('grunt-contrib-clean');
and then configure the clean task to clear your hypothetical minified directory using
grunt.initConfig({
clean: [ 'minified' ]
});
You can now run the clean task from the command line using
grunt clean
To visualise its potential, imagine a task that cleans a directory, then runs Jasmine unit tests using Karma, then lints and compiles LESS files, minifies and concatenates JS files, and packages them up for deployment, or outright deploys them.
So to answer your questions
it can be beneficial to anyone working on the project
the benefit is proportional to how many repetitive tasks you have to deal with
it's a tool, not a trend/fad, and it simplifies processes, not overcomplicates them
want to do pre required task before running project then grunt is best.
Means task required for running project
In grunt we can use add task .Common task like
browserify : In our project we crate multiple file by name convention for better understanding. But when we want to run the project you have to include all files rather than you can just combine all file in one file at the time for deploy project it will reduces your server time to include all files
just like include in Gruntfile.js
uglify:{
app: {
src: ['app/**/*.js'],//include all js file in app folder
dest: 'public/site.js'//one file
}
}
grunt.loadNpmTasks('grunt-browserify');//use npm task for browserify
Register Task : In project we use diff environment.If you want manage what thing to be run before the deploy by each environment.
Just like task required for only Env Dev watch task
grunt.loadNpmTasks('grunt-contrib-watch');
For this you register task dev
env: {
development: { NODE_ENV: 'development' },
staging: { NODE_ENV: 'staging' },
production: { NODE_ENV: 'production' }
}
grunt.registerTask('dev',['env:development','watch']);//list of task required only for dev env
grunt.registerTask('production',['env:production']);
i want to have a directory that is not deployed to the server, nor is it packaged to be sent to the clients.
I read the 'tests' dir behaves this way, but i don't want to store all my files that don't nee deployment in the tests dir. tests is just for tests...
I want to include my sass files (.scss) in my project, but only the compiled css needs to be deployed (I compile to client/style.css). All of the sass source files and compass configuration files don't need to be deployed anywhere.
How to do this?
I hope I don't need to stor everything in the tests dir...
Thanks!
Pieter
As stated in this other SO, directories whose name start with a dot (Unix hidden directories) aren't included by meteor. I use it for my less partials: client/css/.partials/_<partial_name>.less.
You could modify Meteor's app/lib/bundler.js, line 37 to include your extension:
var ignore_files = [
/~$/, /^\.#/, /^#.*#$/,
/^\.DS_Store$/, /^ehthumbs\.db$/, /^Icon.$/, /^Thumbs\.db$/,
/^\.meteor$/, /* avoids scanning N^2 files when bundling all packages */
/^\.git$/, /* often has too many files to watch */
/*.scss$/
];
or you could make package.js for your sass files, using stylus as an example.