6강 파이어베이스(Firebase)로 React 프로젝트 배포하기

1. 빌드(Build)를 위한 웹팩 설정

'use strict'

const path = require('path');

const CopyWebpackPlugin = require('copy-webpack-plugin');

module.exports = {

entry: {

main: ['./src/main.js']

},

output: {

path: path.resolve(__dirname, './build'),

filename: '[name].js'

},

module: {

rules: [{

test: /\.js$/,

include: path.resolve(__dirname, './src'),

loaders: 'babel-loader'

}]

},

plugins: [

new CopyWebpackPlugin([{

context: './public',

from: '*.*'

}]),

],

devServer: {

contentBase: './public',

host: 'localhost',

port: 8080

}

}

2. 각종 모듈 재설치

  (필요할 시 수행하세요.)

3. 파이어베이스(Firebase) 패키지 설치 및 설정하기

  yarn add firebase-tools 명령으로 설치할 수 있습니다.

  이 때 firebase init 명령이 동작하지 않으면, 관리자 권한으로 에디터를 실행하세요. 또한 firebase 계정을 변경하고 싶을 때는 firebase logout 및 firebase login 명령을 이용하시면 됩니다.

4. 기존의 build 폴더를 삭제한 뒤에 yarn build으로 재빌드하기

5. 파이어베이스 호스팅 서비스를 이용해 배포하기

6. .gitignore 파일 수정 및 푸시(Push)하기

node_modules

build

.firebase/

firebase.json

.firebaserc

※ 배포 완료 ※