eWizard.js: site directory struсture

eWizard CLI creates the files and directories within your site project directory.

TIP: The eWizard.js project has a robust directory struсture. We strongly recommend sticking to it during the development process.

.
├─.ewizard/
|  └─settings.json
├─build/
|  └─dev/
|    ├─app.js
|    ├─editor.js
|    ├─index.js
|    ├─state.js
|    └─templates.js
├─common/
|  ├─blocks/
|  ├─blocks-library/
|  |  └─blocks.json
|  ├─components/
|  |  └─components.json
|  ├─i18n/
|  |  └─localization.json
|  ├─media/
|  |  ├─images/
|  |  └─fonts/
|  └─styles/
|    ├─fonts.css
|    └─main.css
├─extensions/
|  └─common.js
├─modules/
├─node_modules/
├─pages/
|  └─default/
|    └─index.vue
├─themes/
├─.eslintrc.js
├─.gitignore
├─App.vue
├─icon.png
├─index.html
├─package.json
├─package-lock.json
├─pages.json
├─preview.jpg
├─readme.md
└─settings.json

Let's take a closer look at the directories and files.

WARNING: The project directory structure may differ depending on the selected project template and initialization options.

Source file or directory	Description
`.ewizard/settings.json`	The `.ewizard/settings.json` specifies the project template type, the path configuration for all the directories, plugin settings, and the template repository.
`.ewizard/assets.json`	The file is created after adding images and other media assets in the eWizard Editor. It shows the paths to the media assets in your project and in the cloud storage.
`build/dev/`	Stores the compiled project source files. This directory appears only after you run the `wiz dev` command.
`build/dev/app.js`	The JavaScript bundle generated when you run the development build. This file is referenced in `index.html`.
`build/dev/editor.js`	The JavaScript bundle used in eWizard Editor.
`build/dev/index.js`	The project's JavaScript entry point generated when you run the development build. This file is referenced in `index.html`.
`build/dev/state.js`	This file stores the state of the Vue app when you make changes in eWizard Editor.
`build/dev/templates.js`	The JavaScript bundle used in eWizard Editor. The bundle displays pages from the master template.
`common/`	Contains all common components, styles, localization, and media resources.
`common/blocks/`	Use this directory to store the local blocks.
`common/blocks-library/`	Contains the blocks that you add to your site markup.
`common/blocks-library/blocks.json`	Configuration of the blocks used in the site markup. The blocks from this configuration file appear in the eWizard Editor Blocks tab.
`common/components/`	Stores local `vue` components files. For more information, see Component development.
`common/components/components.json`	Configuration of the components used in the site markup. The components from this configuration file appear in the eWizard Editor Components tab.
`common/i18n/`	Contains localization file in the JSON format.
`common/i18n/localization.json`	Global localization of the site text. Eliminates the need to localize the same text on individual pages of the site.
`common/media/`	Stores the common media resources: fonts, images, PDF files, and videos. Each type of media resource is stored in its own directory.
`common/styles/`	Contains the common styles.
`common/styles/fonts.css`	Use `fonts.css` to import fonts.
`common/styles/main.css`	Use `main.css` to define global styles for the project.
`extensions/`	Stores the `common.js` file in which the project common components are registered as global extensions to be available on every page of your site.
`node_modules/`	The npm packages installed for the project. You can install the project dependencies with the `wiz install` command.
`pages/`	Contains the site pages directories in which page appearance and logic are defined in the `vue` components. Each site page has its own directory named as the page `id` in the `pages.json` file. The media resources of a specific page are stored in the `media` subdirectory of that page. For more information, see Multiple page site.
`themes/`	Contains themes for the project template. Each theme is in its own directory. The directory name is the same as its theme.
`.eslintrc.js`	The ESLint configuration file with predefined settings for a vue-based project. You can turn off/on the plugin in `.ewizard/settings.json`.
`.gitignore`	Specifies the files and directories that aren't synced with Git.
`App.vue`	A Single File Component where you add all the common components for your site (menu, footer, logo). It contains 3 chunks of code: HTML, CSS, and JavaScript. Use this file if your site has one landing page. In a multiple page site, use the `./common/pages/` directory to store the site pages in individual directories. Also, use the `App.vue` file for the routing between the site pages. For more information, see Multiple page site.
`icon.png`	The default icon of the site scaffolding template.
`index.html`	The main HTML file that serves as an entry point of the entire project and allows you to run the project as a single-page application. It includes the main project view and contains the JavaScript bundles that are produced by eWizard CLI.
`package.json`	Stores general information about the project and contains the list of project npm dependencies.
`package-lock.json`	Provides the version information for all packages installed into `node_modules` by the npm client.
`pages.json`	The configuration file for the site pages struсture. For more information, see Multiple page site.
`preview.jpg`	The preview icon of the generated site.
`readme.md`	Stores useful development information and hints.
`settings.json`	Specifies the project settings depending on the template type. For more information, see Site settings.