VanillaFront

Va.CompoundButton — 두 줄짜리 복합 버튼일반 Va.Button이 한 줄 라벨을 가진 버튼이라면, Va.CompoundButton은 주 텍스트(primary) + 부가 설명(secondary)을 한 버튼에 담는 두 줄 구조입니다. "저장 / 변경사항 5건", "결제 / VISA •••1234"처럼 라벨과 컨텍스트를 함께 보여줘야 하는 상황에 씁니다.클래스: Va.CompoundButton — va_component.js:12975short name: compoundButton상속: Va.Component (Button과 형제 관계, Va.Button을 상속하진 않음)베이스 CSS: va-button (일반 버튼과 스타일 계보 공유) 1. 기본 사용{ tagName: 'compoundB..

Va.Button — 표준 버튼 컴포넌트VanillaFront의 가장 기본이 되는 인터랙션 컴포넌트로, 텍스트·아이콘·배지·상태를 하나의 API로 다루는 다목적 버튼입니다. 엘리먼트를 감싸 표준 DOM 시맨틱을 유지하면서, 프레임워크의 컴포넌트 시스템에 편입되어 있습니다.클래스: Va.Button — va_component.js:11965short name: button (config의 tagName:'button'으로 사용)상속: Va.Component1. 기본 사용{ tagName: 'button', text: '저장', icon: 'ico_save', appearance: 'primary', onClick: 'onSave'}tagName:'button'은 프레임워크에 등..

Extention 에서 live server를 찾아서 설치함.파일을 선택하고실행하면 해당 파일 기준으로 실행됨. 5500Port로 실행됨. 변경하고 싶을 경우 아래 경로에서 변경 { "editor.fontSize": 18, "workbench.iconTheme": "vscode-icons", "files.autoSave": "onFocusChange", "terminal.integrated.shell.windows": "C:\\Windows\\System32\\WindowsPowerShell\\v1.0\\powershell.exe", "explorer.confirmDelete": false, "editor.tabCompletion": "on", "editor.tabS..

파일을 복사하기 위해서 우선 복사할 파일에 대한 대상을 선정해야 한다. 내 경우 assets에 있는 파일과  index.html 파일이 대상이 되었다. bulid된 파일은 ./dist 폴더로 이동해야 한다. 또한  index.html 파일 역시 dist폴더로 이동해서dist폴더만 복사해서 올리면 모든 마무리되는 형태로 갖추려 한다. 이를 위해  먼저 default로 entry에 main으로 설정된 경로를 index로 동일하게 맞춰주어야 했다.     entry:{        index: "./index.js",    }, 이제 index.js는 dist에서  만들어진 파일과 루트의  index.html이 호출하는 경로가 같아졌다. copy-webpack-plugin 을 설치 하기 위해 다음과 같이 설정..

1. 프로젝트 폴더를 생성한다.(사용자가 선택)c:\\workspaces\va 2. 웹팩을 설치한다. npm install --save-dev webpacknpm install --save-dev webpack-cli --save는 프로젝트의 build 에 영향을 미치고 --save-dev는 개발 환경에 영향을 미친다. (현재 프로젝트에 webpack이 설치되는 것은 아니므로 두개가 구분 될런지는 관심이 없다.) 3. 생성한 폴더로 이동하고 명령창에  npm을 초기화 한다.npm init 4. webpack 사용을 위해 config 파일을 생성한다. config 파일을 수기로 만들어 주어야 한다.  webpack-config.jsconst path = require("path");module.export..