kdh5998

<p>해결했습니다! 감사합니다ㅎㅎ</p>

localhost:3090 접속 시 404에러

<div style="color: #eeffff; background-color: #212121; font-family: Consolas, 'Courier New', monospace; font-size: 14px; line-height: 19px; white-space: pre;">
<div><span style="color: #89ddff;"><</span><span style="color: #f07178;">html</span><span style="color: #89ddff;">></span></div>
<div>&nbsp; &nbsp; <span style="color: #89ddff;"><</span><span style="color: #f07178;">head</span><span style="color: #89ddff;">></span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #89ddff;"><</span><span style="color: #f07178;">meta</span> <span style="color: #c792ea; font-style: italic;">charset</span><span style="color: #89ddff;">="</span><span style="color: #c3e88d;">UTF-8</span><span style="color: #89ddff;">"</span> <span style="color: #89ddff;">/></span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #89ddff;"><</span><span style="color: #f07178;">meta</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #c792ea; font-style: italic;">name</span><span style="color: #89ddff;">="</span><span style="color: #c3e88d;">viewport</span><span style="color: #89ddff;">"</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #c792ea; font-style: italic;">content</span><span style="color: #89ddff;">="</span><span style="color: #c3e88d;">width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0</span><span style="color: #89ddff;">"</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #89ddff;">/></span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #89ddff;"><</span><span style="color: #f07178;">meta</span> <span style="color: #c792ea; font-style: italic;">http-equiv</span><span style="color: #89ddff;">="</span><span style="color: #c3e88d;">X-UA-Compatible</span><span style="color: #89ddff;">"</span> <span style="color: #c792ea; font-style: italic;">content</span><span style="color: #89ddff;">="</span><span style="color: #c3e88d;">ie=edge</span><span style="color: #89ddff;">"</span> <span style="color: #89ddff;">/></span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #89ddff;"><</span><span style="color: #f07178;">title</span><span style="color: #89ddff;">></span>슬리액<span style="color: #89ddff;"></</span><span style="color: #f07178;">title</span><span style="color: #89ddff;">></span></div>
<div><span style="color: #89ddff;">&nbsp; &nbsp; &nbsp; &nbsp; <</span><span style="color: #f07178;">style</span><span style="color: #89ddff;">></span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #f07178;">html</span><span style="color: #89ddff;">,</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #f07178;">body</span> <span style="color: #89ddff;">{</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #b2ccd6;">margin</span><span style="color: #89ddff;">:</span> <span style="color: #f78c6c;">0</span><span style="color: #89ddff;">;</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #b2ccd6;">padding</span><span style="color: #89ddff;">:</span> <span style="color: #f78c6c;">0</span><span style="color: #89ddff;">;</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #b2ccd6;">overflow</span><span style="color: #89ddff;">:</span> <span style="color: #f78c6c;">initial</span> <span style="color: #f78c6c;">!important</span><span style="color: #89ddff;">;</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #89ddff;">}</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #f07178;">body</span> <span style="color: #89ddff;">{</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #b2ccd6;">font-size</span><span style="color: #89ddff;">:</span> <span style="color: #f78c6c;">15px</span><span style="color: #89ddff;">;</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #b2ccd6;">line-height</span><span style="color: #89ddff;">:</span> <span style="color: #f78c6c;">1.46668</span><span style="color: #89ddff;">;</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #b2ccd6;">font-weight</span><span style="color: #89ddff;">:</span> <span style="color: #f78c6c;">400</span><span style="color: #89ddff;">;</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #b2ccd6;">font-variant-ligatures</span><span style="color: #89ddff;">:</span> <span style="color: #f78c6c;">common-ligatures</span><span style="color: #89ddff;">;</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #b2ccd6;">-moz-osx-font-smoothing</span><span style="color: #89ddff;">:</span> <span style="color: #f78c6c;">grayscale</span><span style="color: #89ddff;">;</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #b2ccd6;">-webkit-font-smoothing</span><span style="color: #89ddff;">:</span> <span style="color: #f78c6c;">antialiased</span><span style="color: #89ddff;">;</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #89ddff;">}</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #f07178;">*</span> <span style="color: #89ddff;">{</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #b2ccd6;">box-sizing</span><span style="color: #89ddff;">:</span> <span style="color: #f78c6c;">border-box</span><span style="color: #89ddff;">;</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #89ddff;">}</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #89ddff;"></</span><span style="color: #f07178;">style</span><span style="color: #89ddff;">></span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #89ddff;"><</span><span style="color: #f07178;">link</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #c792ea; font-style: italic;">rel</span><span style="color: #89ddff;">="</span><span style="color: #c3e88d;">stylesheet</span><span style="color: #89ddff;">"</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #c792ea; font-style: italic;">href</span><span style="color: #89ddff;">="</span><span style="color: #c3e88d;">https://a.slack-edge.com/bv1-9/client-boot-styles.dc0a11f.css?cacheKey=gantry-1613184053</span><span style="color: #89ddff;">"</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #c792ea; font-style: italic;">crossorigin</span><span style="color: #89ddff;">="</span><span style="color: #c3e88d;">anonymous</span><span style="color: #89ddff;">"</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #89ddff;">/></span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #89ddff;"><</span><span style="color: #f07178;">link</span> <span style="color: #c792ea; font-style: italic;">rel</span><span style="color: #89ddff;">="</span><span style="color: #c3e88d;">shortcut icon</span><span style="color: #89ddff;">"</span> <span style="color: #c792ea; font-style: italic;">href</span><span style="color: #89ddff;">="</span><span style="color: #c3e88d;">https://a.slack-edge.com/cebaa/img/ico/favicon.ico</span><span style="color: #89ddff;">"</span> <span style="color: #89ddff;">/></span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #89ddff;"><</span><span style="color: #f07178;">link</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #c792ea; font-style: italic;">href</span><span style="color: #89ddff;">="</span><span style="color: #c3e88d;">https://a.slack-edge.com/bv1-9/slack-icons-v2-16ca3a7.woff2</span><span style="color: #89ddff;">"</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #c792ea; font-style: italic;">rel</span><span style="color: #89ddff;">="</span><span style="color: #c3e88d;">preload</span><span style="color: #89ddff;">"</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #c792ea; font-style: italic;">as</span><span style="color: #89ddff;">="</span><span style="color: #c3e88d;">font</span><span style="color: #89ddff;">"</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #c792ea; font-style: italic;">crossorigin</span><span style="color: #89ddff;">="</span><span style="color: #c3e88d;">anonymous</span><span style="color: #89ddff;">"</span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #89ddff;">/></span></div>
<div>&nbsp; &nbsp; <span style="color: #89ddff;"></</span><span style="color: #f07178;">head</span><span style="color: #89ddff;">></span></div>
<div>&nbsp; &nbsp; <span style="color: #89ddff;"><</span><span style="color: #f07178;">body</span><span style="color: #89ddff;">></span></div>
<div>&nbsp; &nbsp; &nbsp; &nbsp; <span style="color: #89ddff;"><</span><span style="color: #f07178;">div</span> <span style="color: #c792ea; font-style: italic;">id</span><span style="color: #89ddff;">="</span><span style="color: #c3e88d;">app</span><span style="color: #89ddff;">"></</span><span style="color: #f07178;">div</span><span style="color: #89ddff;">></span></div>
<div><span style="color: #89ddff;">&nbsp; &nbsp; &nbsp; &nbsp; <</span><span style="color: #f07178;">script</span> <span style="color: #c792ea; font-style: italic;">src</span><span style="color: #89ddff;">="</span><span style="color: #c3e88d;">/dist/app.js</span><span style="color: #89ddff;">"></</span><span style="color: #f07178;">script</span><span style="color: #89ddff;">></span></div>
<div>&nbsp; &nbsp; <span style="color: #89ddff;"></</span><span style="color: #f07178;">body</span><span style="color: #89ddff;">></span></div>
<div><span style="color: #89ddff;"></</span><span style="color: #f07178;">html</span><span style="color: #89ddff;">></span></div>
</div>
<p>index.html은 root에 있고 /dist/app.js 로 되어있습니다.</p>
<p>webpack.config.ts에 주신 것과 같이 넣었는데</p>
<p><img src="https://cdn.inflearn.com/public/files/posts/120532c6-c796-4208-a5bb-aaa004ce7c12/blob" alt="" /></p>
<p>에러 표시가 납니다.</p>

<p><img src="https://cdn.inflearn.com/public/files/posts/de546c5a-a790-43e3-b8c4-dfcadf25f2b1/blob" alt="" /></p>
<p>2번 질문에 대해 해봤는데, 노가다로 이렇게 카운트 센다음에 list.vue에서 출력했더니 나오긴 하는데, 너무 비효율적인것 같네요... 공통되는걸 함수로 만들어서 넣고 싶은데 같은 methods범위에서 선언하니까 사용이 안되는것같은데, 어떻게하면 효율적으로 할 수 있을까요?</p>

kdh5998

Posts