Vue.js: folder is missing when publish - vue.js

When I publish the project: npm run build a folder that I created with images is missing from the dist folder.
I created this folder inside the src folder.
assets folder is also missing.
Where is it?

If you just want some folders included verbatim, put them in the public folder.
Any static assets placed in the public folder will simply be copied and not go through webpack. You need to reference them using absolute paths.
Things within src are only included if they're part of the bundle (ie they have been imported / required) and even then, any folder structure won't be preserved. Bundled items are typically renamed with a hash checksum and all put into a single folder like js, css, images, etc.

Related

VSCode esp-idf wont link my component folder to project

I'm trying to create new a folder, where I will keep my components, I already have default components folder (components), but I want to use two or more folders to keep my files sorted. I tried creating new folder (managed_components), adding files but my main file can't find new components folder
I have read, that I need to update my CMakeLists.txt file by adding EXTRA_COMPONENT_DIRS command, but I don't know how it works and can't find any information how to use it, what exactly should I do to tell my main.c file, that there are other component folders in this project and how to link them?
First of all, managed_components directory is used by the IDF Component Manager, so you should come up with a different name.
Secondly, consider if you really need multiple component directories. Do you know that you can have subdirectory for each component inside components directory? For example:
cd components/
idf.py create-component new_component
Finally, if you do want to add extra component directories, then edit the CMakeLists.txt file in the root of your project and add a line like so:
set(EXTRA_COMPONENT_DIRS my_extra_components)
See this example CMakeLists.txt.

assets not showing after build process with vite and vue3

When running npm run build my pictures under src/assets/... are not available in the dist directory / production build. So not shown on the site. In dev mode it works for sure.
Any ideas how to make them available after building?
Assets in src/assets must be referenced in the code (via import or similar) to be included in the bundle. If you just want static files to be bundled with your project, you should use public/ instead:
Static assets can be handled in two different ways:
Imported in JavaScript or referenced in templates/CSS via relative paths. Such references will be handled by webpack.
Placed in the public directory and referenced via absolute paths. These assets will simply be copied and not go through webpack.
https://cli.vuejs.org/guide/html-and-static-assets.html#static-assets-handling

quasar can't build asset folder

My project has static folder and asset folder.
I use quasar dev to build project and the building project is stored in dist folder. But in the dist folder, it only has static folder, it doesn't has asset folder.
How can I let asset be packaged in dist folder?
I also had some struggle working with these two directories in Quasar. So I was very happy when I found this page in the documentation. The difference between assets and statics is described as follows:
Assets vs Statics
Files in the “assets” folder are only included in your build if they have a
literal reference in one of your Vue files. Every file and folder from the > “statics” folder are copied into your production build as-is, no matter what.
So I guess that you currently do not use any of the files inside the assets directory in at least one of your components.
Example: One possible way to make logo.png be part of the dist folder is to use the asset in a Vue component like this (also taken from the docs): <img src="~assets/logo.png">. Afterwards run quasar build and check the output in your dist folder. Good luck!

Public vs src directories (vue-cli)

The default directory structure when using vue-cli contains a 'public' directory and 'src' directory. The public directory contains index.html. What exactly is the purpose of putting index.html in the public directory instead of src? What are other examples of files that should go in public?
Files placed in the public folder are static and will not be processed by webpack.
"Placed in the public directory and referenced via absolute paths. These assets will simply be copied and not go through webpack"
Source: https://cli.vuejs.org/guide/html-and-static-assets.html#static-assets-handling
Example may include: Favicon, icons for PWA, robots.txt, manifest.json... Just to name a few.

Why organize projects inside a src folder?

First of all, I would like to make it clear that I know that the src folder is not required. Indeed, one can simply create manually one directory for the project, make one valid project.json and one Startup class and everything should work fine even without Visual Studio.
My point is the following: when we create a new project using ASP.NET 5 from Visual Studio 2015 it creates a solution and inside the solution's folder it creates one src folder. Within this folder all projects are created.
Now why would anyone want to make one src folder inside the solution folder? Why not putting the projects direct onto the solution folder? Is there any advange on the organization of the project to put the projects inside a src folder? Why VS does that now?
You usually have more files inside your project that are not source code related like:
README.md
CONTRIBUTING.md
.gitignore
LICENSE
Build scripts
Docs and tools folders, etc.
And a tons of others files that depend on your configuration. So, if you have a src folder, you don't need to mix your source code files with those.
because you may have your code in src folder (class libraries, etc), test in your test folder, documentation in a documetation folder
in global.json you specify which folders does roslyn pick for compiling.