설정 파일

설정 파일

webpack.base.conf.js

Webpack기본 설정 으로 정해진 파일입니다. 해당 파일을 통해 기본적인 웹팩 설정을 변경할 수 있습니다. 설정 정보가 궁금하다면 웹팩의 공식 홈페이지를 참고해주시기 바랍니다 https://webpack.js.org/configuration/
webpack.base.conf.js
  
const VueLoaderPlugin = require('vue-loader/lib/plugin')

require('dotenv').config();

module.exports = {
  module: {
    rules: [
      {
        test: /.js$/,
        exclude: /(node_modules|bower_components)/,
        use: {
          loader: 'babel-loader',
          options: {
            presets: ['es2015']
          }
        }
      },
      {
        test: /.css$/,
        use:  ["style-loader", "css-loader"]
      },
      {
        test: /.vue$/,
        use: {
          loader: 'vue-loader'
        }
      }
    ],
  },
  plugins: [
    new VueLoaderPlugin()
  ]
}

webpack.entry.js

Webpack엔트리 로 정해진 파일입니다. 여기서는 번들링 될 모든 파일을 포함시켜야 하며 .css, .less, .js 등이 app.js 에 포함됩니다. webpack.base.conf.js 설정에 따라 포함시킬 수 있는 파일이 다르며 기본적으로 js, css 파일을 포함시킬 수 있습니다. 이 파일에 포함시킬 것들은 주로 수정을 하지않는 라이브러리 입니다. 예를 들면 부트스트랩 과 같은 경우가 있겠습니다.
webpack.entry.js

 /* webpack.entry.js
  * 
  * Entry for bundling by webpack.
  * for example, if you have your own script, or plguin,
  * you can import that. 
  * ex) import "./bower_components/animate.css/animate.min.css"
  * 
  * you are able to include js, css
  * if you want to contain other scripts like .ts, .less, .sass,
  * set the loaders in ./webpack.base.conf.js
  * 
  * after import assets it will be contained in app.js
 */

import Vue from 'vue';

Vue.component(
  'hello-component', 
  require('~/components/hello-component.vue').default
);

new Vue({
  el: '#app'
});

.env

이 파일은 개발과정에서 설정 할 수 있는 상수로 구성된 설정파일입니다. 이 파일은 깃허브에 배포시 포함시킬 필요가 없습니다. 티스토리 API 설정이나 PUBLIC PATH 등의 환경설정 정보를 설정할 때 사용합니다.
.env

# APP

APP_MODE=development

# Development

TISTORY_CLIENT_ID=dc08305218d22fb1af479b044d4707d0
TISTORY_CALLBACK=http://localhost:8080

# Build

# TISTORY_CLIENT_ID=7a27ccf663340c05c6dc2e4d28f63be7
# TISTORY_CALLBACK=https://appwriter.tistory.com
# PUBLIC_PATH=https://tistory2.daumcdn.net/tistory/2710108/skin/images/