Laravel 6.0 app.css

@jlrdw isn't it supposed to come after running npm run dev or npm run prod as it used to come before?

As far as I see that has not been moved from the webpack.mix.js file.

mix.js('resources/js/app.js', 'public/js')
    .sass('resources/sass/app.scss', 'public/css');

@nakov I have never had to do anything with npm on previous versions. Yet there was always the app.js and app.css.

In 6.0 you have to run either

php artisan ui vue --auth

or

php artisan ui react --auth

If you want to scaffold Auth. Yet in the docs is stated:

In fact, you don't have to use JavaScript at all.

Ok I use jquery and of course the app.css. Just wondering how to continue using the two. App.js meaning what was in version 5.8.

I don't compile assets, the majority of css I use is custom written css. I only use out of box css for the login and register pages if needed.

Even in 5.8 no compiling was necessary to have the login and register pages already styled.

@jlrdw You are right. I don't remember running npm on previous versions either to make it run. But now looking at the master branch it seems like the app.css file exists. I don't know why when installing it gets removed then. But ofc let's wait for the official docs I guess.

Okay figured it out, I know these are separate packages now. Just wasn't sure how to handle without npm.

I tried:

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">

Works great. I can just download later and rename to app.css if needed, and I'll just download jquery.

@nakov thanks for the reply.

I am still confused on how the docs state:

In fact, you don't have to use JavaScript at all.

Yet to scaffold auth you have to:

php artisan ui vue --auth

or

php artisan ui react --auth

I created an issue https://github.com/laravel/framework/issues/29782

As basic styling should be there if like the docs state:

As mentioned in the previous section, the laravel/ui package's php artisan ui vue --auth command will create all of the views you need for authentication and place them in the resources/views/auth directory.

The ui command will also create a resources/views/layouts directory containing a base layout for your application. All of these views use the Bootstrap CSS framework, but you are free to customize them however you wish.

Nothing is mentioned about having to npm anything for Auth to work after running the composer commands.

Why wouldn't you just use npm and compile the files? It's a lot less effort than tracking down the links or downloading the files.

Only because I use very little JS and most css is custom. And I have never needed npm in the past.

Being semi retired I just do a small app from time to time. An example is a recent bookkeeping intranet. The folks can do it at home or at work now to stay caught up.

But I see your point.

Okay makes sense. I was just curious.

Please run "npm install && npm run dev" to compile your fresh scaffolding.

Previously the framework shipped with a compiled app.js and app.css in the public folder (containing bootstrap css, and bootstrap.js, vue.js, jquery and others). So for many, a front-end build process was not necessary.

Now, removing these from the framework has raised the bar significantly for those starting out that don't know what npm is or a front-end build process is. Installing Node and NPM is a non-trivial and OS dependent activity. To provide no guidance is really irresponsible.

Really the UI presets should include links from CDN so that building these two files is not necessary to get going.

And that's exactly what I was trying to explain in my issue I raised that just starting out with and basic Authentication scaffolding should not have to require extras like npm.

In no way I'm saying this is the case but it almost appears they're forcing New Uses to have to compile when compiling is and should be totally optional for just a small site.

But just my opinion.

I simply downloaded bootstrap. CSS I renamed it app. CSS and I was good to go in two minutes.

Maybe it's too late for an answer or reply but... after you run:

composer require laravel/ui

php artisan ui vue --auth

npm install && npm run dev

This last operation will take several minutes to complete, but at the end it will create the "css/app.css" and "js/app.js" under "public" directory.

This is a sample of output at the end of the operation:

npm WARN deprecated [email protected]: package is bloated with temp files (fixed in 2.3.2) npm notice created a lockfile as package-lock.json. You should commit this file. npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\fsevents): npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

added 1008 packages from 486 contributors and audited 17160 packages in 381.48s found 0 vulnerabilities

@ dev C:\PATH\TO\YOUR\htdocs\laravel-project npm run development

@ development C:\PATH\TO\YOUR\htdocs\laravel-project cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js

98% after emitting SizeLimitsPlugin

DONE Compiled successfully in 17966ms 11:11:37 AM

   Asset            Size            Chunks              Chunk Names
*/css/app.css*      173 KiB     /js/app  [emitted]      /js/app
*/js/app.js*        1.38 MiB    /js/app  [emitted]      /js/app