1.0.1 • Published 2 years ago

create-widget-component v1.0.1

Weekly downloads
-
License
MIT
Repository
github
Last release
2 years ago

Create widget 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.

  1. Create repository on github:InComNetworking . Example is vue-widget-text. Replace name with your component name. like vue-widget-text

  2. Clone repository localy.

  3. Init default component structure. You have to run this command from folder above your local folder for repository

    npm create github:InComNetworking/widget-component vue-widget-text

Need to install the following packages: github:InComNetworking/create-widget-component Ok to proceed? (y) ? What is the name of the new project vue-widget-text ? How would you descripe the new project Vue component project info Created vue-widget-text/.eslintignore info Created vue-widget-text/.eslintrc.cjs info Created vue-widget-text/.gitattributes info Created vue-widget-text/.editorconfig info Created vue-widget-text/vite.config.js info Created vue-widget-text/package.json info Created vue-widget-text/index.html info Created vue-widget-text/src/index.js info Created vue-widget-text/src/App.vue info Created vue-widget-text/src/vue-widget-component.html info Created vue-widget-text/src/vue-widget-component.scss info Created vue-widget-text/src/main.js info Created vue-widget-text/src/vue-widget-component.vue info Moved vue-widget-text/src/vue-widget-component.vue -> vue-widget-text/src/vue-widget-text.vue info Moved vue-widget-text/src/vue-widget-component.scss -> vue-widget-text/src/vue-widget-text.scss info Moved vue-widget-text/src/vue-widget-component.html -> vue-widget-text/src/vue-widget-text.html success Initialized empty Git repository success Installed packages success Generated into /Users/gor/incomrealestate.com/vue-widget-text

4. Start your local dev server:

cd vue-widget-text 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 file : vue-widget-text.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-widget-text`
  - import component in your code
    ```
    import VueComponentName from "#/vue-widget-text/src/vue-widget-text.vue";
    ...
    <template>
    ...
    <VueComponentName :text="'some text'"/>
    ...
    ```
1.0.1

2 years ago

1.0.0

2 years ago