VueJS Setup

---

Create a workspace and initial application

1. Run the following command to install the Vue.js CLI globally

npm install -g @vue/cli

2. GO to directory where you want to create the Vue Project.
3. Open your terminal or command prompt. With the same directory you are intended.

vue create Your-project-name

4. Follow the prompts to configure your project. You can choose the features you want to include, such as Routing, SSR, ESLint, and others.
5. Once After the project is create come to the project directory in command prompt.

cd You-project-name

6. Run the following command to start your Vue.js application:

npm run dev

This command will start the development server, and you can access your Vue.js application in your browser at http://localhost:5173.

Ynex Setup

---

Prerequisites

Node.js

Download latest version of node.js from nodejs.org.
Install Node.js using downloaded file.
To check your node version, run node -v in a terminal/console window (cmd)

Setup an SashTemplate by

1. Download the Ynex.rar/zip file.
2. Extract it and then go in to Folder here you will see a Ynux Folders
3. For Example, Here I'm Choosing Vuejs-file
4. Here, I'm Choosing Vuejs-file.
5. Now from a terminal window, navigate to the directory containing your application

Ynex/Vuejs-file>

6. You can import all dependency by installing npm command

npm install
    (or)
yarn install

7. Now you are in stage to successfully run Sashusing below command:

npm run dev
    (or)
yarn dev

Once you serve your application by default it will take their default port using http://localhost:5173/

Note

basically npm install is used to install all dependencies or devDependencies from a package. if there will be any dependencies which need to be installed but getting error message while installing, then use --force will help to install those dependencies.

The --force argument will force npm to fetch remote resources even if a local copy exists on disk. It will be on a last-dependency-downloaded-wins basis and will overwrite any previously downloaded dependencies.

npm install --force

Note

npm install

If your are using npm install, You have to delete the yarn.lock

yarn-lock file

(or)

yarn install

If your are using yarn install, You have to delete the package-lock.json

(or)

yarn install --network-timeout 1000000

If yarn will getting timeout issue use this command

package-lock.json file

we have to use only one file example: (for yarn yarn-lock) & (for npm package-lock.json) file

basically npm i is used to install all dependencies or devDependencies from a package. if there will be any dependencies which need to be installed but getting error message while installing, then --force will help to install those dependencies.

The --force argument will force npm to fetch remote resources even if a local copy exists on disk. It will be on a last-dependency-downloaded-wins basis and will overwrite any previously downloaded dependencies.

npm install --force

if there is peer dependency issues while installing
it will always skip peer dependencies (whatever those are) during installation even if there are no issues.

npm install--legacy-peer-deps

we have to use only one file example: (for yarn yarn-lock) & (for npm package-lock.json) file

Static Hosting Vue3 Application

To Upload your static application for host on server using below command:

Generate the Static Site

1. Before upload, you should need to make some changes in the vite.config.js file like below if you are uploading into sub-directory, If you are uploading them in public then you can remove or you can add '/'.

                      base: '/vue/ynex/preview/',
                      plugins: [vue(),],
                      resolve: {
                        alias: {
                          '@': fileURLToPath(new URL(import.meta.url))
                        }
                      },
                    

2. Before uploading, you need to build the static site using the Vue.js build process. Run the following command in your Vue.js project directory:

npm run build

This command will create a dist directory containing the static files of your Vue.js application.

Upload those files in your server to access them globally.