.nuxt folder vs dist folder in a spa nuxt project - vue.js

every time i build my nuxt project it creates a .nuxt folder and a dist folder in my root directory. what's the difference between them? i can run .nuxt by nuxt start command, but what's use of dist folder? i served it with a chrome extension and it worked fine. but i don't know what exactly it is. it's not a static version cause it's different from dist folder that nuxt generat command produce.it's fully interactive and when i run it by that extension i can't see any difference compare to runing .nuxt folder by nuxt start command.

Related

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!

Vue.js what directory to build the production from on EC2 Ubuntu?

I am a little confused about where to build vue.js for production.
In my dev folder on ubuntu 16.04 -
I start the project
Update my files in the src directory
Then do npm build ( I have tried form both the project home page where index.html lives and the src directory)
In the dist directory I see that a new index.html and a static folder is created.
Deploy the contents of my dist directory to my public directory where normally index.html will live.
Result: I can see the page title but not the contents. My code works fine the dev environment. I am trying not to run it from S3

Dojo 2 - issue of loading js files

Not able to load js files from local where as CDN path working fine in Dojo 2 application. Once included custom JavaScript files using script tag in index.html. But in browser it shows the error 404 file not found.
Please suggest as i need these for my Dojo 2 application.
This is my how i am using script tag to include
script src="assets/js/jquery.js" type="text/javascript"
Currently, the Dojo 2 build does not copy external assets to the build directory, but we are working on a way of specifying such assets in the .dojorc config (index.html is not/will not be scanned for assets). In the meantime, another means of delivering static assets will be required (for example, configuring the assets/ path at the server level).
Assuming you are using the dojo 2 cli you need to move your assets folder into the root of you application, this is in the dojo 2 build docs:
While most assets will be imported by modules in the src/ directory and therefore handled by the main build pipeline, it is often necessary to serve static assets or include assets in the HTML file itself (e.g., the favicon).
Static assets can be added to an assets/ directory at the project root. At build time, these assets are copied as-is without file hashing to output/{mode}/assets, and can be accessed using the absolute /assets/ path. For example, if users need access to a static terms of service document named terms.pdf, that file would added to assets/terms.pdf and accessed via the URL /assets/terms.pdf.
The build also parses src/index.html for CSS, JavaScript, and image assets, hashing them and including them in the output/{mode}/ directory. For example, it is common for applications to display a favicon in the URL bar. If the favicon is named favicon.ico, it can be added to the src/ directory and included in src/index.html with . The build will then hash the file and copy it to output/{mode}/favicon.[hash].ico.
But another option is to add a new npm command "move-assets": "cp -R ./src/assets ./output/dist/assets" to you package config
"scripts": {
"start": "dojo build --mode dev --watch memory --serve",
"build": "dojo build --mode dist && npm run move-assets && npm run move-assets",
"move-assets": "cp -R ./src/assets ./output/dist/assets"
}
This will move your assets into the build output folder ./output/dist

How to separate sources from dist files in Aurelia with JSPM?

I am trying to use Aurelia with Symfony backend. Part of our application is generated on the backend (good, old server-side MVC) and part of it should be an SPA. I have started aurelia app from skeleton-typescript (JSPM). Directory structure I am trying to create is as follows.
project/
src/
SomeModule/
SomeOtherModule/
FrontendModule/
build/
src/
app.ts
main.ts
...
index.html
package.json
...
web/
dist/
I have changed the output path in build/paths.js and gulp build correctly places the compiled files in the web/dist. I have also added a gulp task that copies the index.html into the web/.
The biggest problem I have is how to manage the JSPM dependencies. If I configure it to downlad the dependencies into web/jspm_dependencies, the application works when launched with Symfony but I am not able to configure karma unit tests properly (it says for example that it can't find aurelia-polyfills). If I leave the jspm_dependencies in the src/FrontendModule then I have to create a gulp task that copies it to the web/ and it takes a lot more than 10s => unacceptable.
This leds me to the following questions:
What is the suggested directory structure for Aurelia project when I am not going to serve the app from the project's root?
Is there any way to copy only the files needed by the application to the web/ (something like main-bower-files for bower)?
I know I can gulp export the app into the web/, but I want to use the same directory structure during the development, too.
I don't want to use browsersync server in the dev because of multi-nature of the application (SPA part and non-SPA part that has to be served from "real" backend).

aurelia bundle - serve from a single directory

Trying to use the aurelia cli bundling facility.
Is it possible to serve all app files (i.e. index.html, app-bundle.html, app-bundle.js, etc) from a single directory or index.html must be at the top (./) directory and the other files in a child (./dist) directory?
Under the covers the cli is using JSPM / System.js's bundling functionality. This works by looking at your config.js paths on where to find the files both for the bundle and when serving. If your paths are set up to serve from the root directory this should work as expected. The problem will be that if you are trying to bundle root it will try to grab all .js files in there which could be bad if you don't exclude them.