Setup

To install the framework, the Node.js package must be installed on your computer.

Requirements

Only Node.js 18.15.0 and above are supported, check out the article below to install Node.js with Nvm in your environment.

Follow the steps below to create an Olobase frontend project.

git clone --branch 1.3.2 [email protected]:olomadev/olobase-skeleton-ui myproject

Go to your project root

cd /var/www/myproject

Initalize the olobase-admin submodule

git submodule update --init

Install node modules with npm.

npm i

.env Files

Save the env.dist file in the root directory as .env.dev.

.env.dev file content

VITE_DEFAULT_LOCALE=en
VITE_FALLBACK_LOCALE=en
VITE_SUPPORTED_LOCALES=en,tr
VITE_API_URL=http://example.local/api
VITE_HCAPTCHA_SITE_KEY=
VITE_SESSION_UPDATE_TIME=5
VITE_COOKIE={ "token": "_token", "user": "_user" }

If the env file name is incorrect, you will receive the error: "translation.js:13 Uncaught TypeError: Cannot read properties of undefined (reading 'split')".

Vite.config.js

The server.host address value of the vite configuration should always remain 0.0.0.0 by default. This value means that the server is open to listening on all host addresses, whether you are working with a local or virtual server such as VMWare. Because of this every IP address entered points to your application.

export default defineConfig({
  // transpileDependencies: true,
  transpileDependencies: ["vuetify"],
  server: {
    host: '0.0.0.0',
    port: 3000 // the port number you want
  },
  plugins: [ ...

Starting Your Local Server

Starts the application in the local environment.

npm run dev

If you are working on a local computer, you can visit http://127.0.0.1:3000. If you are working on a local virtual server, you can type the IP address of your server into your browser and visit an IP address like in this example; http://192.168.231.129:3000.

Exporting the Project

With this command, your javascript files compiled for the production environment are exported to the /dist folder.

npm run build

Getting Updates

When you set up the project as above, olobase-admin is included in your project as a submodule. 

- myproject
  + packages
    - admin   // (olobase-admin submodule)
      + src
        .git
        EULA.md
        package.json
        README.md
  + src
    .env.dev
    .gitignore
    .gitmodules
    app.css
    env.dist
    favicon.ico
    index.html
    package.json
    README.md
    vite.config.js

You can keep your olobase application up to date by upgrading this package to new versions. To do this, look at the releases on the releases address. And follow the steps below to install the updated version.

cd /var/www/myproject

Enter the packages/admin folder within the current folder.

cd packages/admin

Upgrade your olobase-admin submodule to the latest version.

git pull origin 1.3.5

Don't forget to follow the versions of your olobase-admin submodule to keep your application up to date.

Did You Edit The Submodule ?

If you did some changes in your olobase-admin submodule folder (accidently or for test purposes etc.) you need use stash command before the pull operation.

Do stash & pull

cd packages/admin

git stash
git pull origin 1.3.5

Still Didn't Work ?

If you still cannot get the update you want after trying the commands above, try to run the commands below.

git restore .
// HEAD detached at 1.2.0

git pull origin 1.3.5
git checkout 1.3.5