[parcel 5] typography js, build

typography Js

자바스트립트와 함께하는 css typopgraphy

자동으로 구글 폰트를 연결해주는 등의 기능이 있다.

먼저 설치해주자

yarn add typography

typography.js 파일 생성

import Typography from "typography";

const typography = new Typography({

baseFontSize: "18px",

baseLineHeight: 1.666,

googleFonts: [

{

name: "Montserrat",

styles: ["700"]

},

{

name: "Open Sans",

styles: ["400"]

}

],

headerFontFamily: ["Montserrat", "Helvetica Neue", "sans-serif"],

bodyFontFamily: ["Open Sans", "sans-serif"]

});

typography.injectStyles();

export default typography;

index.js에서 임포트

import typography from "./typography";

프로덕션으로 빌드하기

package.json수정

"scripts": {

"start": "parcel index.html",

"build": "parcel build index.html -d build --public-url ./"

}

yarn build 하면 끝!