๋ฒ๊ทธ ์ค๋ช
Webpack์ผ๋ก TypeScript ์ฑ์ ์ปดํ์ผํ๋ ค๊ณ ํ๋ฉด ๊ฐ ๋ก์ผ์ผ์ ๋ํด '../moment'๋ฅผ ํ์ธํ ์ ์๋ค๋ ์ค๋ฅ๊ฐ ๋ฐ์ํฉ๋๋ค.
์ด ์ค๋ฅ๋ ๋ค๋ฅธ ๋ชจ๋ ๋ก์ผ์ผ์ ๋ํด ๋ฐ๋ณต๋ฉ๋๋ค.
ERROR in ./node_modules/moment/locale/km.js
Module not found: Error: Can't resolve '../moment' in 'C:\PROGS\dev\var\private\moment-test\node_modules\moment\locale'
@ ./node_modules/moment/locale/km.js 5:50-70
@ ./node_modules/moment/locale sync ^\.\/.*$
@ ./node_modules/moment/moment.js
@ ./src/app.ts
์ฌํํ๊ธฐ ์ํด
src/app.ts
import * as moment from "moment";
console.log(moment().format("YYYY"));
ํจํค์ง.json
{
"private": true,
"dependencies": {
"moment": "2.23.0"
},
"devDependencies": {
"awesome-typescript-loader": "5.2.1",
"typescript": "3.2.2",
"webpack": "4.28.3",
"webpack-cli": "3.2.1"
}
}
tsconfig.json
{ "include": [ "./src/" ] }
์นํฉ.config.js
module.exports = {
entry: "./src/app.ts",
output: { filename: "bundle.js" },
resolve: { extensions: [".ts"] },
module: { rules: [ { test: /\.ts$/, use: { loader: "awesome-typescript-loader" } } ] }
}
์์๋๋ ํ๋
yarn run webpack -p
๋ ์ค๋ฅ ์์ด ์๋ํด์ผ ํฉ๋๋ค.
์๊ฐ๋ณ ํ๊ฒฝ
ํ๊ฒฝ์์ ๋ค์ ์ฝ๋๋ฅผ ์คํํ๊ณ ์ถ๋ ฅ์ ํฌํจํ์ญ์์ค.
console.log((new Date()).toString())
console.log((new Date()).toLocaleString())
console.log((new Date()).getTimezoneOffset())
console.log(navigator.userAgent)
console.log(moment.version)
์ด ์ฝ๋๋ ๋์ผํ ์ค๋ฅ๋ก ์คํจํฉ๋๋ค!
์ด ์์ฒญ์ ์ด์ด์ฃผ์
์ ๊ฐ์ฌํฉ๋๋ค.
์ด๊ฒ์ ์คํ ์ค๋ฒํ๋ก์ ๋ํ ํ๋ฅญํ ์ง๋ฌธ์
๋๋ค.
์ด๊ฒ์ ๋ฒ๊ทธ์ ๋๋ค. ๊ทธ๋ ์ง ์์ต๋๊น? ์คํ ์ค๋ฒํ๋ก๋ ์ง๋ฌธ์ ์ ํฉํ์ง๋ง ์๋ฌด๋ ๊ฑฐ๊ธฐ์์ ๋ฒ๊ทธ๋ฅผ ์์ ํ์ง ์์ต๋๋ค.
๊ทํ์ ๋ต๋ณ์ TypeScript๋ก WebPack์ ์ง์ํ์ง ์๋๋ค๋ ์๋ฏธ๋ก ํด์๋ฉ๋๋ค. ๋๋ฌด ๋๋น !
Webpack ๋ฐ TypeScript์ ํจ๊ป Moment๋ฅผ ์ฌ์ฉํ๋ ๋ฐฉ๋ฒ์ ๋ํ ๋ค์ํ ์์ต์๊ฐ ์ธํฐ๋ท์ ์์ต๋๋ค. ๋ค๋ฅธ ๋ง์ ์ฌ๋๋ค์ด ํจ๊ป ์ ์ฌ์ฉํ๋ ๊ฒ ๊ฐ์ต๋๋ค. ๋ ๋ง์ ์ฌ๋๋ค์ด ์ด ๋ฌธ์ ๋ฅผ ๊ฒช๊ณ ์๊ณ ์ด๋ฅผ ํด๊ฒฐํ ์ปค๋ฎค๋ํฐ ์ง์์ด ์ถฉ๋ถํ๋ค๋ฉด ๊ทธ๋ ๊ฒ ํ ์ ์์ต๋๋ค.
๊ทธ๊ฑด ๊ทธ๋ ๊ณ ๋๋ ๊ฐ์ ๋ฌธ์ ๊ฐ์์์ต๋๋ค - ๋ด๊ฐ ์ ๊ฒฝ ์ฐ์ง ์์ ์๊ฐ ๋ก์ผ์ผ์ ์ํด ๋ฐ์ํ๋ ๊ฒ ๊ฐ์ต๋๋ค. ์ด ์จ๋ผ์ธ ๊ธฐ์ฌ ์์ ํด๊ฒฐ์ฑ ์ ์ฐพ์์ต๋๋ค. ์ ๊ฒฝ์ฐ์๋ ๋ก์ผ์ผ ํ๋ฌ๊ทธ์ธ์ ๋ฌด์ํ๊ธฐ์ ์ถฉ๋ถํ์ต๋๋ค.
ํ๋ฌ๊ทธ์ธ: [์๋ก์ด webpack.IgnorePlugin(/^.\/locale$/, /moment$/)]
์ด๊ฒ์ ๊ฝค ์ฃผ๋ฅ์ ์ธ ์ฌ์ฉ ์๋๋ฆฌ์ค์ฒ๋ผ ๋ณด์ด๋ฏ๋ก ๋ฌธ์ ์
@authguidance-examples PR์ https://github.com/moment/momentjs.com ์์ ํ์ํฉ๋๋ค!
๋๋ ๊ฐ์ ๋ฌธ์ ์ ์ง๋ฉดํ๊ณ ์ฌ๊ธฐ์ ๋ฌธ์ ๊ฐ์์์ต๋๋ค.
package.json
ํ์ผ์ ๋ฐฉ๊ธ ์ถ๊ฐ๋ npm i --save react-moment
์ฌ์ฉ์ ์ง์ ๋ช
๋ น์ ์ฌ์ฉํ์ฌ ์ค์นํ์ง๋ง node_modules์๋ lib๊ฐ ์์์ผ๋ฏ๋ก ์คํํฉ๋๋ค.npm install --save moment react-moment
์ ํญ์ "๋ช ์ด ์ "์ฒ๋ผ ํ์๋๋์ง ์๋ ์ฌ๋? ๋ ์ง๊ฐ ์ด๋ป๋
๋๋ reactjs์ ์๊ฐ์ ์ถ๊ฐํ์ต๋๋ค. import * as moment from "moment"; ์์กด์ฑ ์ฃผ์ ์์ "moment": "2.23.0"์ด ์ถ๊ฐ๋์์ง๋ง
์ ์๋์ง ์์ ์ค๋ฅ... reactjs์์
์น์ ํ๊ฒ ๋์์ฃผ์ธ์...
์ ์ด ์ง์ ์ด ๋ซํ์ง ์์ต๋๊น? 2019๋ 12์ 2์ผ์ ๋ง์ง๋ง ๋๊ธ @marwahaha
๊ฐ์ฅ ์ ์ฉํ ๋๊ธ
๋๋ ๊ฐ์ ๋ฌธ์ ์ ์ง๋ฉดํ๊ณ ์ฌ๊ธฐ์ ๋ฌธ์ ๊ฐ์์์ต๋๋ค.
package.json
ํ์ผ์ ๋ฐฉ๊ธ ์ถ๊ฐ๋npm i --save react-moment
์ฌ์ฉ์ ์ง์ ๋ช ๋ น์ ์ฌ์ฉํ์ฌ ์ค์นํ์ง๋ง node_modules์๋ lib๊ฐ ์์์ผ๋ฏ๋ก ์คํํฉ๋๋ค.npm install --save moment react-moment