2024/07 3

Live Server 설치

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

Webpack 파일복사. copy-webpack-plugin

파일을 복사하기 위해서 우선 복사할 파일에 대한 대상을 선정해야 한다. 내 경우 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 을 설치 하기 위해 다음과 같이 설정..

카테고리 없음 2024.07.08

Webpack 프로젝트 시작

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

카테고리 없음 2024.07.02