I am using Vue in laravel. When I make changes in vue code these changes doesn't appear until I run this command:
npm run production
I want to use vue without this command or at least one time should be enough
The Vue code that you write must be transpiled to vanilla javascript so that most of the browsers out there can understand it (not all browsers understand Vue or the underlying javascript version, such as ES6).
Additionally, most likely the code you write has many dependencies (including Vue itself) but also many other libraries. npm run generates a single javascript file with all the necessary code to run, but also stripping out all other portions of libraries that you don't use. If this didn't happen, it would take a lot of time to your page to load because the browser would need to load all the libraries.
You can simply run npm run watch to keep building vue into vanilla javascript code as you are working on vue components.
What does npm run watch does exactly?
In package.json file in the root folder of your laravel project, you can see that there is a script of "watch" which then runs npm run development -- --watch. Here, --watch part is important. npm run development compiles or builds vue components into ./public/js/app.js and also creates css styles in ./public/css/ corresponding to the styles that you apply inside vue components tags.
./public/js/app.js and ./public/css/*.css files are then included in php blades and it serves as vue components.
Using npm run development is recommeded while you are working on your local dev environment rather than npm run production, which command itself implies that it builds production version of vue components. In production version, vue-devtools cannot inspect vue components but it does in development version.
And as --watch part keeps its eye on vue components' chages and it builds as soon as you make any change in .vue files. So you run npm run watch once, you are good to go. No need to run npm run development or npm run production every time.
To update our code on port id need to run npm rum production command
My build in Heroku fail so I want to see the complete log as they mention in the build:
npm ERR! A complete log of this run can be found in:
npm ERR! /app/.npm/_logs/****logname*****-debug.log
How do I get this complete log?
AFAIK, it's not possible to access the intermediate state of a failed build.
If you use Docker, you might take advantage of the fact that the Heroku stacks are available as docker images and attempt to reproduce the problem by writing a Dockerfile based on your combination of stack (the current default one is Heroku-18) and buildpack.
If you cannot do that, my suggestion would be to try making the output of npm more verbose, to be able to debug it from the build output.
Is it possible to run only scss files on laravel mix?
I need to update only css info, and making the compiler run everything it takes long time.
Instead of doing always "npm run development", coul have another command running only scss files.
Yes You Can But:
You will have to learn about webpack and mix first then you can handle this
If you are working on vue.js then use
npm run watch
You will not have to run it again and again only changes will be compiled wherever you made.
And read package.json it provides commands related to compiling assets.
Laravel 5.4.26
NPM 5.4.2
Node 8.1.2
I am running npm run watch and it works perfectly with all my SASS or CSS files. I also have this line of code there:
.scripts(['resources/assets/js/specific/dashboard.js'], 'public/js/specific/all.js')
Every time I run npm run watch dashboard.js is succesfully compiled into all.js.
However every time I make a change in dashboard.js laravel mix instantly empties all.js never to fill it up again. If I Ctrl+c the process and run npm run watch again it compiles it successfully again.
This is bad because every time I make a change in the js (that I'm currently developing) I need to go back and restart the process and wait for it.
I have developed a node.js npm module, developing under Windows. Today I wrote some Mocha tests. After many struggles, it seemed that for npm test to work, package.json had to look like this: (there may be other options???)
"scripts": { "test": "node node_modules/mocha/bin/mocha" }
instead of what's in all the Unix based books,
"scripts": { "test": "./node_modules/.bin/mocha" }
How can I set package.json up to work on both Windows and Unix? I'm assuming that Travis-CI runs Unix, so, should I link the build to that, it will blow up with the Windows version.
I found a two year old thread where somebody requested a feature for exactly this. That thread seemed to die out. This SO question seems to be close, but it isn't exactly what I want and, frankly, I can't understand the answer. :-( Can anybody clarify?
For the time being, I am going
"scripts": {
"test": "node node_modules/mocha/bin/mocha",
"testOnUnixUseThis" : "./node_modules/.bin/mocha (I think)",
"testOnWindowsUseThis" : "node node_modules/mocha/bin/mocha"
},
Unfortunately, you cant go npm test testOnWindowsUseThis or npm testOnWindowsUseThis. And it doesn't fix the Travis-CI issue. But at least a person who downloads the module can (hopefully) see what is going on.
Any better ideas? Am I the only person still developing under Windows??? :-)
I've always been able to npm install -g mocha or npm install mocha and then just add
"scripts": {
"test": "mocha spec"
}
to package.json. That may or may not work in EVERY environment. I know, for instance, with lineman, you have to use bin/mocha. Also, if you don't find a way around this, set your test script up for Unix and then add a second script called "wintest" or something that does whatever you need it to do in Windows. You can name your scripts whatever you want. The default ones (test, start, etc.) can be used with npm [command]; any non-standard ones (like wintest) can be used with npm run-script [command], and they will still work.
A little back story on how/why this works:
When you install a module globally, it's available on PATH (or whatever the windows equivalent is). When you install a project dependency, if that module has any binaries, those are symlinked to node_modules/.bin and when you run npm run [some-command], npm helpfully adds node_modules/.bin to PATH for that command. So when mocha is installed globally "test": "mocha spec" uses your globally installed mocha to run tests. When it's a project dependency, it uses the one in node_modules/.bin. The one gotcha I've found with this is that npm adds node_modules/.bin to the front of PATH, so local binaries will always take precedence over global ones. Almost all of the time, this is what you want, but it's worth knowing that that's how it works (I recently had a bug related to this).
EDIT:
Not sure at what point in npm history this changed, but npm run <script-name> now works (don't need to do npm run-script <script-name> anymore). Possibly run-script still works as well. I'd expect it to, but I haven't tried it.
How can I set package.json up to work on both Windows and Unix?
If you
use Windows
dislike -g global install
...this is a working solution
"scripts": {
"test": "node node_modules/mocha/bin/mocha.js"
},
Notes:
putting node in front shouldn't harm, and can help on Windows (.js extension is not necessarily registered to the nodejus executable, unless you set it so. Could open a text editor, an IDE or (worse) windows scripting host, Internet Explorer…)
Adressing the script directly saves you from needing a global install. (Not judging if this is a good practice)
forward slashes help running under linux (obviously) and do work under windows (in this scenario. Also avoids a windows pitfall: backslashes if used, would need to be doubled – since they are interpreted as escaping the following letter if used solitary).
Don't use global solution, I suggest you follow what the Mocha guys say:
"scripts": {
"test": "node_modules/.bin/mocha -w"
},
Use npm i mocha --save-dev
This will save the module as a development dependency and npm will automatically set up the executables to be used within the scripts object. If you want to use the executables outside of the scripts defined in package.json, you can install it globally as well, although note that you may end up with different versions of the package.
If you only install it globally, other people won't be happy if they try to run your tests (with the standard npm test)
The new way with latest npm versions after 6.x, you needn't install mocha with global mode any more.
"scripts": { "test": "npx mocha" }
npx is installed automatically with new npm installation. It will search
mocha from node_modules/.bin or $PATH
reference: https://www.npmjs.com/package/npx