The initialized component
template has the following directory structure:
. └─ └─.ewizard/ └─ settings.json # The eWizard.js project settings and plugins configuration ├─ demo/ # The demo e-Detailer project ├─ dist/ └─ build.js # The component builder ├─ .eslintrc.js # The ESLint configuration file ├─ .gitignore # By default, /node_modules is ignored ├─ .npmignore # By default, /demo and /node_modules are ignored ├─ index.vue # Add your component code here ├─ package.json # npm manifest └─ settings.json # The component configuration
Demo e-Detailer
The demo
directory contains the default e-Detailer template. You can develop your component and see the result in the demo e-Detailer within the same project. The component project directory is referenced from the demo e-Detailer using the :Symlink:symlink:.
It means that while you change the index.vue
file in the root directory, the same index.vue
file changes in the ./demo/node_modules/[your-component]/index.vue
file.
The developed component is imported to the default slide instance in the demo e-Detailer.
// ./demo/slides/default/index.vue <template> <wiz-slide> <TеstComponent></TеstComponent> </wiz-slide> </template> <script> import TеstComponent from 'tеst-component';export default { components: { TеstComponent, }, };</script> <style scoped></style>