- 프로젝트 디렉토리 생성
npm init -y- index.html 만들기
root폴더에 index.html 생성
script에
번들 코드 추가
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Hello React!</title>
</head>
<body>
<div id="example"></div>
<!-- Dependencies -->
<script src="./node_modules/react/umd/react.development.js"></script>
<script src="./node_modules/react-dom/umd/react-dom.development.js"></script>
<!-- Main -->
<script src="./bundle.js"></script>
</body>
</html>- 웹팩설치 및 설정
npm install --save-dev webpack webpack-dev-server webpack-clipackage.json의 script에
start 명령어 코드 설정
"start": "webpack-dev-server --config ./webpack.config.js --mode development"root폴더에 webpack.config.js파일생성
module.exports = {
entry: [
'./src/index.js'
],
output: {
filename: "bundle.js",
path: __dirname + "/dist"
}
};- 개발서버 실행해보기
root폴더에 src폴더 생성후 index.js 파일 생성
index.js 에
console.log("hello world") 입력후npm start
Show me the code