Let's begin
Thank you for buying the Mofi admin template
Main dependancies
- Nuxt 3.15.3
- Bootstrap 5.3.2
- Scss
Mofi Nuxt Admin is theme build with all latest techstack Nuxt.js, typescript and pinia with comoposition api also it's build with No Jquery Nuxt admin theme including all feature and functionality with ease of integration for your project. Mofi theme documentaition will help you to understand Nuxt from scratch to making perfect real time dream application.
Follow the documentation carefully for solving your issues in minutes, Apart from that if you don't find solution when you following the docs you can raise a support ticket for your issue from pixelstrap.freshdesk.com
Mofi Admin is a responsive Nuxt template that is based on the CSS framework Bootstrap 5 and it is built with Sass Sass compiler makes it easier to code and customize. If you are unfamiliar with Bootstrap, visit their website and read through the documentation. All of Bootstrap components have been modified to fit the style of Mofi Admin and provide a consistent look throughout the template.
Before you start working with the template, we suggest you go through the pages that are bundled with the theme. Most of the template example pages contain quick tips on how to create or use a component which can be really helpful when you need to create something on the fly.
Prerequisites
Before you begin, make sure your development environment includes Node and an npm package manager.
Install Node.js using downloaded file.
To check your node version, run node -v in a terminal/console window.
Nuxt CLI, and Nuxt apps depend on features and functionality provided by libraries that are available as npm packages. To download and install npm packages, you must have an npm package manager.
This Quick Start uses the npm client command line interface, which is installed with Node.js by
default. To check that you have the npm client installed, run npm -v in a
terminal/console window.
For better understanding Nuxt we suggest you to once go through official documentation of Nuxt from Nuxt.com
Nuxt setup
If you want Mofi theme setup then directly follow next Mofi setup section
Installing Nuxt CLI
You use the Nuxt CLI to create projects, generate application and library code, and perform a variety of ongoing development tasks as it is a progressive framework for building user interfaces.
Install the Nuxt CLI globally.
To install the CLI using npm, open a terminal/console window and enter the following command:
npx nuxi@latest init <project-name>
Create Initial application
1. Run the CLI command vue create and provide the name my-app, as shown here:
Run Application
1. Go to the workspace folder (my-app).
cd my-app
2. Launch the server by using the CLI command npm start
npm run dev
If you have already download and install node.js and Nuxt CLI then ignore prerequisites accordingly.
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.
nuxt CLI
Install Nuxt CLI Using:
npx nuxi@latest init <theme>
Setup Mofi theme by
1) Download and extract an Mofi themes from themeforest
2) Extract it and then go in to theme folder.
cd theme
3) Import all dependency by installing npm command
npm install
4) Now you are in stage to successfully run Mofi using below command:
npm run dev
Build Application
1. Build you application for host on server using below
command:npm run build
It will create one dist file in your theme folder. Make zip of dist folder. so here you are ready to upload your theme on server.
If you’re using Apache HTTP Server, you need to create a .htaccess file in the public folder by pastng below code
Options -MultiViewsRewriteEngine OnRewriteCond %{REQUEST_FILENAME} !-fRewriteRule ^ index.html [QSA,L]
Now upload your dist folder on public folder
if you want to add subdirectory for your build then below one step:
2. add your sub directory name in public path in app into nuxt.config.ts like(
baseURL: "/mofi/"