eWizard.js: module directory struсture

eWizard CLI creates the files and directories within your module 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
├─common/
|  ├─blocks/
|  ├─blocks-library/
|  |  └─blocks.json
|  ├─components/
|  |  └─components.json
|  ├─i18n/
|  |  └─localization.json
|  ├─media/
|  |  ├─fonts/
|  |  ├─images/
|  |  ├─pdfs/
|  |  ├─signature/
|  |  └─videos/
|  ├─resources/
|  |  └─references.json
|  └─styles/
|    └─main.css
├─extensions/
|  └─common.js
├─node_modules/
├─themes/
├─.eslintrc.js
├─.gitignore
├─App.vue
├─icon.png
├─index.html
├─package.json
├─package-lock.json
├─preview.jpg
├─readme.md
└─settings.json

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

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

Source file or directory	Description
`.ewizard/settings.json`	Specifies the project template type, the path configuration for all the directories, plugin settings, and the template repository.
`build/dev/`	Stores the compiled project source files. This directory appears after you run the `wiz dev` command.
`build/dev/app.js`	The JavaScript bundle created upon 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 :Entrypoint:entrypoint: created upon the development build. This file is referenced in `index.html`.
`build/dev/state.js`	Stores all changes applied to the project in eWizard Editor.
`common/`	Contains all common components, styles, localization, and media resources.
`common/blocks/`	The directory is used only in the classic email projects to store the added blocks.
`common/blocks-library/`	Contains blocks available for adding to the project in eWizard Editor. The `blocks-library` contains `blocks.json` that describes the blocks displayed in eWizard Editor.
`common/components/`	Stores local `vue` components files. For more details, see Component development.
`common/components/components.json`	Contains the list of components displayed in eWizard Editor.
`common/i18n/`	Contains the localization files in the JSON format.
`common/i18n/localization.json`	The localization of text used in the module template.
`common/media/`	Stores the common media resources: fonts, images, PDF files, signature images, and videos. Each type of media resource is stored in its own directory.
`common/resources/references.json`	The text in external documents that you can reference in the module.
`common/styles/`	Contains the common CSS styles.
`common/styles/main.css`	Use `main.css` to define global styles for the project.
`extensions/`	Stores the `common.js` file to import the project common components and register them as global extensions.
`node_modules/`	The npm packages installed for the project. You can install the project dependencies with the `wiz install` command.
`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 :SingleFileComponent:singlefilecomponent: with the template where you add all the common components for your module. It contains 3 chunks of code: HTML, CSS, and JavaScript.
`index.html`	The main HTML file that serves as an entry point of the entire project 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.
`preview.jpg`	The preview icon of the generated module.
`readme.md`	Stores useful development information and hints.
`settings.json`	Specifies the project settings depending on the template type. For more information, see Module settings.