I'm trying to learn more about package development by using Laravel Nova as a bit of a guide. I'm confused as to how Nova's assets are compiled, and part of that confusion stems from Nova not having a webpack.mix.js but instead a webpack.mix.js.dist.
I'm trying to model this within my package in order to compile and publish my assets for use in my project, but I get npm errors when trying to run any command
Cannot find module 'dir/dir/dir/package/webpack.mix'
I'm unsure as to why it is looking for this file in the first place, but it still seems to be an issue. To get to the root of why this is an issue and how I can fix this, I'd like to know what the difference between webpack.mix.js and webpack.mix.js.dist is.
Any feedback on this would be greatly appreciated. Thank you.
Files that end in '.dist' are generally the default distribution files that come from the package and should not be edited. They will be overwritten on package updates.
You can use them as a reference to add or replace configuration in your primary file(s).
From what I can gather, Laravel Nova creates it's real webpack.mix.js from this file when you activate a certain feature. (It's a paid product, I do not have a license to see it, I can only skim the documents.)
Related
I'm new to Golang and I'm interested in integrating Vite.js as an asset bundler. However, I'm facing some challenges with the integration. Specifically, I'm not sure how to configure the necessary directives in Golang so that it can automatically detect which version of CSS and JS to show. I know I can show the build version of files using their names, but how do I accomplish this in dev mode? Additionally, for the production build, I would need to read the manifest.json file. Any help would be greatly appreciated.
I'm quite new to this VueJS things. And this is my first App creating a SPA with separated server-side app. I faced the problem right before deploying my app on a shared hosting. Simply, when i run "npm run build", it return with an error in which i don't even know the cause. Here is the error i faced.
first img
second img
Please help me resolve this issues, i know there are jquery errors, but i think those are not the problems
You have es-lint checker. It checks unused vars so you have unused variables inside these listed components like from and to. You should remove these variable from your components.
Those errors come from your linter (probably eslint) which is a tool designed to ensure consistence and code quality : in your case it mainly complains about declared variables that are not used anywhere else in your code and $ being undefined (I guess you're trying to use jquery which you should not be doing in a vue project anyway)
On the images you posted you have all necessary infos : the title of each block tells you in which file the error is (for example App.vue in the first image) and then you have line/column to locate precisely where you need to adjust :)
Note that you can configure your linter (what should be error/warning/skipped out) overwriting (or creating if it doesn't exist) a config file at the root of your project (if you use eslint for example, you can create a .eslintrc file). See the config part of the official doc
I am new to Laravel.
When I install Laravel 6 a lot of the things that install by default in Laravel 5.8 are not evident i.e. bootstrap, vue, jquery.
I see this is package.json file.
I did not find anything that explains this and wondering if anyone has some guidance that might enlighten me.
Example:
I was trying to use bootstrap as shown in the video I was watching and found missing resources/sass files ap.scss and .variables.scss. ap.scss was empty and .variables.scss was absent. I did find them buried elsewhere in the installation; however, bootstrap did not work and any attempts I made to install bootstrap and other missing pieces wound up breaking the framework (probably something I did.)
In the meantime I am staying with a Version 5 distribution of Laravel.
Laravel decoupled what front end tech you use by default in 6.0
You can review the documentation here.
https://laravel.com/docs/6.x/frontend
I'm interested in adding QR Scanner to my Laravel project, I found one that suits me it's called gruhn/vue-qrcode-reader there is also a written tutorial how to install it, but I just don't know where to add those codes or files. I've installed everything the problem is that I just don't know what to edit and how.
This is a late response: but for anyone who comes across this like me...
gruhn/vue-qrcode-reader was created using VueJS a Javascript Framework. Since you use Laravel: VueJS already comes preinstalled with Laravel depending on the version you use. You should also have Npm in order to use the npm run watch (the watcher).
Follow the installation steps found at their GitHub and then Simply create a new VueJS component and paste the code found in GitHub: gruhn/vue-qrcode-reader: while having a little understanding you can easily integrate this with Laravel by mounting the component where you wish to have the scanner in your project and viola it should work as advertised.
I hope this helps a bit.
You should try this one laravel package:-
https://github.com/werneckbh/laravel-qr-code
It would be best for you, because there are only few steps and that are too easy.
This problem is driving me mad, I have been researching and have read about the standalone and runtime version of Vue. As far as I can tell Laravel 5.4/homestead ships with the standalone version as default.
The Vue development tools in chrome show the example component so I think that part is working correctly, just cannot render the template.
I am relatively new to Vue and npm been stuck in the past with jQuery, firstly where in laravel can I check/set I want the stand alone version of Vue? If it is not that problem does any one have any ideas?
Thanks for help
VueJS supports two ways of building apps like you said.
Load all necessary scripts within your page via script tags (not combined .vue files).
Compile and bundle all your files with Gulp, Browserify, Webpack or other tools.
Can you explain what you did so far. I guess you don't compile everything down.
The comment by peaceman was the solution, I had multiple calls to elixir, I condensed down to one and it worked straight away. Thanks everyone for your help.