How can I serve an additional directory with static assets via Vite Dev Server? - vite

In case of Webpack, I can use contentBase property, that can be a list of static directories. But in case of Vite, there is only publicDir.
What is the easiest way to serve one more directory? I don't need to copy it during build, it's needed only for development.

Related

Creating Reactjs app production build without using node

We have just a single webpage with some links on clicking them it will redirect to different sources. As of now we are using "npm run build" to create the production package.
But because of the build files having dependencies with node, i cannot host it in a particular server.
Is there a way to create the Reactjs production build without using node ?
I suggest using Netlify to host your react app easily .
Below are some resources that can help you along the way.
https://www.netlify.com/with/react/
https://www.youtube.com/watch?v=sGBdp9r2GSg
You can have a build and upload it manually to your Netlify account,
You can use the CLI (netlify-cli) or you can your account to git .
Similar approach can be followed with git pages for example.
What packages do you have in your package.json file? Did you use a React project template that uses Node server-side features? It seems like you want to host your React project statically, not necessarily get rid of Node and npm.
For example, I've worked on lots of React projects using npm and create-react-app that we were able to host with a .NET backend and Microsoft IIS (instead of Node). The output is .html, .js, and other static files that you can host anywhere.
When you build a react app, the files at folder build contains everything it needs to run
If your hosting server hasn't integration with CI/CD, then you must deploy manually only the build folder, not the root folder (the folder that contains package.json).
I believe your issue is just a confusion/misunderstanding on how react works, how to deploy it, and how to run it.
React needs to be built on an environment where node, npm, and other tools are available. It can be on a build server or in your local machine.
After built, react app is just a folder with a bunch of html, css, js files which will run on the client browser, so, there's no dependency on NODE anymore.
These static files must be served with a simple static file server (apache, nginx, iis, etc),
I recommend you build the app locally on your machine and then deploy manually to your host through ftp, ssh or web interface.
If react is overkill to your needs, then don't use it.
The best approach is to host it in a cloud service that can do the full CI/CD integrated with git, all automated (Google GCP, AWS, Azure, Netlify, etc)

How to remove cpp files from production build via webpack?

I use webpack 4 and electron-builder to bundle and build my Electron app. I noticed that native node modules inside the node_modules directory of the app.asar bundle still contain their C++ source files.
Is there a way to exclude certain file extensions from the build step?
electron-builder can exclude files in the files section of your package.json.
Default pattern / is not added to your custom if some of your patterns is not ignore (i.e. not starts with !). package.json and /node_modules// (only production dependencies will be copied) is added to your custom in any case. All default ignores are added in any case — you don’t need to repeat it if you configure own patterns.
Example
"!**/node_modules/*/{CHANGELOG.md,README.md,README,readme.md,readme}",

How to setup production environment for Vue and deploy app into environment

I have developed a Vue app and trying to build a dev/QA/PROD environment for the same. I knew that when i use 'npm run build', it will create dist folder with set of files/folders under it. Here i just want to know following things
What would be the minimal Server/Environment to execute dist files.?Is node setup enough to execute and how?
How to deploy dist folder to specific environment?Will it be through Git?
Any web technology that can serve static files would do the trick.
The index.html file contained in the dist folder has links to all the javascript, css, images necessary for your app to function correctly.
So your web server has to serve index.html, and the other files have to be located in a folder accessible from any client online.
With node you can do as explained here:
https://expressjs.com/en/starter/static-files.html
You can also use your github account and github pages:
https://www.youtube.com/watch?v=2MsN8gpT6jY

How to correctly setup folders / files in nodejs?

I am currently starting out in node.js and I am a bit confused with the folder/file setups. Let´s say I have a main folder where all my different projects are located, and those are folders too. Now where do I need to keep my node-modules folder? Also how about the package.json file, do I need that inside each project folder?
use npm init first
it will make a package.json file.
Install the dependencies which be stored in Node_modules folder
Now make a folder named Public
with subfolders assets, css, js, index.html -- the FrontEnd part

How to use angualr2 js with keystone cms?

I installed angular2 in node_module, but as node_module is not static directory I can not use links of angular and its dependencies on html page.
what could be the proper way of doing this ?
Copy it somewhere in public folder, for example: js/vendor/...
This is usual way, otherwise you can break your application on npm update

Resources