@incom/create-vue-component v1.0.7
Create new component
Provides Building blocks(create basic files and folders required for start and develop. Also provide environment to test this component bare bone) to create a new component which will be shared among all apps.
Create repository on github:InComNetworking . Example is
vue-component-name
. Replace name with your component name. likevue-component-widget-text
Clone repository localy.
Init default component structure. You have to run this command from folder above your local folder for repository
npm create @incom/vue-component vue-component-name
Need to install the following packages: github:InComNetworking/create-vue-component Ok to proceed? (y) ? What is the name of the new project vue-component-name ? How would you descripe the new project Vue component project info Created vue-component-name/.eslintignore info Created vue-component-name/.eslintrc.cjs info Created vue-component-name/.gitattributes info Created vue-component-name/.editorconfig info Created vue-component-name/vite.config.js info Created vue-component-name/package.json info Created vue-component-name/index.html info Created vue-component-name/src/index.js info Created vue-component-name/src/App.vue info Created vue-component-name/src/vue-component-section.html info Created vue-component-name/src/vue-component-section.scss info Created vue-component-name/src/main.js info Created vue-component-name/src/vue-component-section.vue info Moved vue-component-name/src/vue-component-section.vue -> vue-component-name/src/vue-component-name.vue info Moved vue-component-name/src/vue-component-section.scss -> vue-component-name/src/vue-component-name.scss info Moved vue-component-name/src/vue-component-section.html -> vue-component-name/src/vue-component-name.html success Initialized empty Git repository success Installed packages success Generated into /Users/gor/incomrealestate.com/vue-component-name
4. Start your local dev server:
cd vue-component-name npm run dev
VITE v3.0.2 ready in 363 ms
➜ Local: http://localhost:5173/ ➜ Network: use --host to expose
5. Your component code is in src folder with names:
vue-component-name.html vue-component-name.scss vue-component-name.vue
Next files is help files to develop component:
App.vue index.js main.js
6. New created component now can be used as a npm package in your application
- install npm package from repository
`npm install github:InComNetworking/vue-component-name`
- import component in your code
```
import VueComponentName from "#/vue-component-name/src/vue-component-name.vue";
...
<template>
...
<VueComponentName :text="'some text'"/>
...
```