How can I run grunt with global path? - spring

When I run 'grunt' at commend line, error occurred 'enable to find local grunt.'
Because, in my directory there is no grunt module. I want to run grunt with global path and not contain node_modules in my project folder. The more adding node_modules in my project the slower running a project.
In my project, there is only Gruntfile.js except for any other node_modules.
How can I run grunt and grunt sub modules with global path?
I can't find solution about this problem anywhere.

Related

How does yarn find a module installed as a dev-dependency

script object in the package.json files is the modern replacement for Gulp or a similar build tool. Assume that Vuepress is installed with yarn add -D vuepress (meaning that the vuepress is installed locally in the node_modules folder.
Further, assume that the package.json file contains the following script object:
"scripts": {
"docs:dev": "vuepress dev docs",
"docs:build": "vuepress build docs"
}
How does the command yarn docs:dev executed in the terminal resolve the vuepress object? More often than not a similar invocation results with the error vuepress not recognized ...
P.S. Since I do not have vuepress in the path environment variable the only place where it can be resolved is in the root level node_modules folder.
I guessed correctly - both npm and yarn (invoked from the terminal) have the ability to inspect all environment variables, as well as search the folder node_modules. In my concrete example, running the command
npm run env | grep scripts
results with
npm_config_ignore_scripts=
npm_config_scripts_prepend_node_path=warn-only
npm_package_scripts_docs_build=vuepress build docs
npm_package_scripts_docs_dev=vuepress dev docs
npm_package_scripts_env=env
There is a lot more information in the article https://techsparx.com/nodejs/tools/npm-build-scripts.html

How do I make changes to the v-slider component and test it in my app?

I tried editing inside node_modules but the files are taken from dist and src seems to be ignored.
I tried npm run build to see if I can push my changes to dist but that doesn't work either as other dependencies seem to be missing.
UPDATE:
I followed the instructions about set up dev env in the Contributing section of the docs.
Made the changes and did yarn and yarn build
But the dist folder is identical to the one without my changes
What gives?
Instructions in the set up dev env in the Contributing section work.
After running "yarn build" in the cloned repository folder, you can copy the contents of the dist folder under packages/vuetify to the dist folder under node_modules/vuetify of the app being developed and your changes can be tested.
You can also do npm run build inside packages/vuetify for subsequent changes.
You can edit code in node_modules/vuetify/lib/components/VSlider/VSlider.js
Then, you install patch-package and execute path package vuetify
Delete node modules and execute yarn to create new node modules
Last, yarn serve, you see your code is work
https://www.npmjs.com/package/patch-package

How can I keep grunt separate from my source files?

I've spent about a day trying to figure this out.
What I finally did was a bash script:
gw() {
# runs grunt using this path
cd ~/root_install/grunt
grunt watch &
cd ~/root
}
My install file are in root_install and my source file are in root.
Note installing the grunt task runner globally is deprecated.
Note that setting the location of the Gruntfile.js does not work as it appears to need a local installation of the task runner.
This seems to be the deal killer.
But alas, application files I want separate from my source files and Grunt is an application.
What I have works, but it is a bit hackish as I don't want to spend any more time on this.

Why isn't my SASS watch command working?

Attempting on a Mac with the latest version of Yosemite
I'm using the latest version of sass to refactor my site. I'm setting up watch command via the command line. my directory setup has a scss folder with the main css stylesheet cloned as .scss. and no css folder.
When I attempt the sass --watch scss:css command while in the main project directory folder, I've been told that, if there isn't one present, a css folder should be generated and a cloned .css file should be created along with a map file. Command line tells me >>> Sass is watching for changes. Press Ctrl-C to stop. however, changes are not being recorded.
I've tried updating my gems and uninstalling/ reinstalling sass, but nothing seems to be working.
Just tried this - the css folder doesn't get autogenerated. You need to generate it yourself. From there on, you should be good to go.
So if you are in the main project folder with subfolders called scss and css and you have, for example, a main.scss file in the scss directory, you can run the command exactly as you specified and everything should work as specified.

Using compass with Yeoman project, but outside of Yeoman server

I'm circumventing the built-in Yeoman server and severing files directly from the /app directory. Since Yeomen's server manages compass/sass compliation I'm having a hard time running compass outside of it. Running the compass cli directly doesn't work; it's not aware that it's in an existing compass project. So I get:
$ compass watch /app (or /app/styles)
Nothing to compile. If you're trying to start a new project, you have left off the directory argument.
Has anybody had experience getting this to work?
You have to move your Compass settings out into a config.rb file to use the Compass CLI.
However, you can easily run the Compass grunt task individually like so grunt compass to compile, or grunt watch to automagically compile on file changes.

Resources