무료
다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결웹 게임을 만들며 배우는 Vue
url
https://en.pimg.jp/023/182/267/1/23182267.jpg
- 미해결웹 게임을 만들며 배우는 Vue
npm run dev 실행 시 Cannot Get/ 오류
안녕하세요. 제로초님. <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <meta name="view-port" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>반응속도 체크</title> </head> <body> <div id="root"></div> <script src="dist/app.js"></script> </body></html> 위 코드에서 src="dist/app.js" 부분에 cannot resolve directory 'dist' / cannot resove file 'app.js' 에러가 뜨는데요. dist 폴더가 없을 때 강사님께서는 이와 같은 에러가 없는 반면, 저는 webpack-dev-server가 4 이상을 써서이렇게 되는 것인지.. 대체 어떤 곳에서 문제가 발생하는지를 잘 모르겠네요.ㅜㅜ webpack serve --env development로 실행을 했을 때 서버는 정상적으로 실행은 또 되는데 Cannot Get/ 에러가 뜨네요... dist/app.js 로 인한 문제인 것인지... 실례가 되지 않는다면 어떻게 해결해야 할지 팁을 주실 수 있으실까요? 아래는 1. pagekage.json 2. webpack.config.js 3. npm run dev 실행 후 터미널 로그 4. 브라우저 실행 화면 입니다. [package.json] { "name": "response-check", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "build": "webpack --watch", "dev": "webpack serve --env development" }, "author": "", "license": "ISC", "dependencies": { "vue": "^2.6.14" }, "devDependencies": { "css-loader": "^6.5.1", "vue-loader": "^15.9.8", "vue-style-loader": "^4.1.3", "vue-template-compiler": "^2.6.14", "webpack": "^5.62.1", "webpack-cli": "^4.9.1", "webpack-dev-server": "^4.4.0" }} [webpack.config.js] const VueLoaderPlugin = require('vue-loader/lib/plugin');const path = require('path');module.exports = { mode: 'development', devtool: 'eval', devServer: { port: 8080, }, resolve: { extensions: ['.js', '.vue'], }, entry: { app: path.join(__dirname, 'main.js'), }, module: { rules: [ { test: /\.vue$/, use: 'vue-loader', }, { test: /\.css$/, use: [ 'vue-style-loader', 'css-loader', ], }, ], }, plugins: [ new VueLoaderPlugin(), ], output: { filename: '[name].js', path: path.join(__dirname, 'dist'), publicPath: '/dist', },}; [webpack serve --env development] 실행 후 터미널 로그 =================================================== <i> [webpack-dev-server] Project is running at: <i> [webpack-dev-server] Loopback: http://localhost:8080/ <i> [webpack-dev-server] On Your Network (IPv4) <i> [webpack-dev-server] Content not from webpack is served from 'C:\Users\programming\vue-webgame\4.반응속도체크\pu blic' directory asset app.js 559 KiB [emitted] (name: app) runtime modules 26.3 KiB 13 modules modules by path ./node_modules/ 441 KiB modules by path ./node_modules/webpack-dev-server/client/ 52.7 KiB 12 modules modules by path ./node_modules/webpack/hot/*.js 4.3 KiB 4 modules modules by path ./node_modules/html-entities/lib/*.js 81.3 KiB 4 modules modules by path ./node_modules/url/ 37.4 KiB 3 modules modules by path ./node_modules/querystring/*.js 4.51 KiB 3 modules modules by path ./node_modules/vue-style-loader/lib/*.js 6.71 KiB 2 modules modules by path ./node_modules/css-loader/dist/runtime/*.js 2.33 KiB 2 modules modules by path ./*.vue 5.71 KiB 8 modules ./main.js 113 bytes [built] [code generated] webpack 5.62.1 compiled successfully in 2558 ms =============================================== [브라우저 실행 화면]
- 미해결웹 게임을 만들며 배우는 Vue
귀퉁이 8개의 위치에 관련하여 질문드립니다.
// 자기 기준으로 8개 귀퉁이를 적음 around = around.concat([ state.tableData[row][cell - 1] , state.tableData[row][cell + 1]]); 위와 같이 되어 있는데요여기서 궁금한게 state.tableData[row][cell-1]의 경우 왼쪽 칸이 없다면 어떻게 되는건가요?위의 state.tableData[row - 1]에 대해서는 undefine에 대해서 확인을 하는거 같거든요여기서 무슨 의미로 쓰였는지 이해가 잘 안되는데설명해 주실수 있을까요?
- 미해결웹 게임을 만들며 배우는 Vue
MineForm.vue 작성시 input 에 v-model 을 사용하면 안되나요?
MineForm.vue 작성할 떄, value 를 v-bind로 하고, onChange 이벤트를 추가해서, value 가 바뀔 때마다 vue 인스턴스에 data도 바뀔 수 있도록 하는데요! v-model 을 사용해서 간단하게 해도 괜찮나요? 성능상에서 문제가 따로 발생할까요? 아님 아예 똑같은 기능인가요?
- 미해결웹 게임을 만들며 배우는 Vue
Vue 가 import from 목록에 나오지를 않습니다.
현재 숫자야구를 보고 있는데요. Vue를 import하려고 아무리해도 안나오네요. 뭔가 이유라도 있는건가요? 목록 안나와서 이리저리 해보다가 끝에 .vue 로 하니 되더라구요... 문제 없는건가요??
- 해결됨웹 게임을 만들며 배우는 Vue
브라우저에 아무것도 표시가 되지 않습니다.
강좌 코드랑 똑같고, 버전도 webpack4, vue2.6, compiler도 2.6 등등 다 맞춰줬는데도 화면엔 아무것도 그려주지 않아서 당황스럽네요. visual studio code 쓰고 있고, live server (port 5500) 사용한게 문제가 된걸려나요??
- 미해결웹 게임을 만들며 배우는 Vue
질문드립니다
안녕하세요 강의 잘 보고 있습니다 궁금한 게 있어서 글 남깁니다 배열의 변화를 인식하지 못 하는 것은 주소를 참조하기 때문일까요?
- 미해결웹 게임을 만들며 배우는 Vue
Webpack 오류 도와 주세요
안녕하세요 요즘 vue를 공부하던 중 강좌 쉽게 설명해주셔서 기초개념 잡기에 도움을 많이 받고 있습니다. - 먼저 유사한 질문이 있었는지 검색해보세요. 유사 질문이 있으나 오류 내용이 달라서 질문 올립니다. 모든 소스는 동일하며 아래 그림과 같이 package.json 설정 되어 있습니다. "npm run build" 실행시 아래 마지막 그림과 같이 오류 발생합니다. webpack.config.js를 읽지 못하는것 같아 여러 방법으로 해보았으나 해결이 되지 않아 도움 요청 드립니다.
- 미해결웹 게임을 만들며 배우는 Vue
component data관련 질문이 있습니다.
안녕하세요 강의 잘 듣고있습니다. 감사합니다. component에서 data를 함수로 만들어서 처리해줘야 데이터 중복이 발생하지 않는다고 말씀해주셨는데 제가 데이터를 data() { return {} } data: () => ({객체 }); 형식으로 사용하지 않고 es6 화살표함수로 사용하였는데 이때 props가 처리되지 않는 상황이 발생하였습니다. 에러는 뜨지않았는데 혹시 이러한 이유가 무엇때문인지 여쭤볼 수 있을까요???..
- 미해결웹 게임을 만들며 배우는 Vue
.vue 확장자 파일 생성이 안되요 ㅠㅠ
안녕하세요!! 수업 열심히 듣고 있는 학생입니다!! 감사합니다!!! 강의를 듣던 중 이제 webpack에 대한 내용을 시작했는데 .vue 확장자 파일을 만드는 것을 따라했는데 생성이 되지 않습니다ㅠㅠ 제가 intellij를 쓰고 있는데 그때문인가 싶기도 하구,,,, 확장자를 추가하는 법을 구글에 검색해보았지만 잘 나오지 않아서 질문드립니다..
- 미해결웹 게임을 만들며 배우는 Vue
실패하고 나서 자동으로 첫번째 시도...
안녕하세요. 수업 잘듣고 있는 수강생입니다. 10번 실패하고 나서 다시 초기화 해서 작동되는 부분에 질문 하나 드립니다. 맨 처음에 시작할때는 시도가 0으로 시작하는데 10번을 틀리고 나서 다시 초기화 되서 실행할때는 맨처음에 자동으로 첫번째 빈값이 들어가서 실행이 되고 카운트가 되어 버립니다. 이거는 무엇때문에 그러는건가요? 코드를 계속 찾아 보는데 왜 자동으로 1이 추가되는지 모르겠습니다.
- 해결됨웹 게임을 만들며 배우는 Vue
v-show
<div v-show="result.length"> <div>평균 시간: {{average}}ms</div> <button v-on:click="onReset">리셋</button> </div> 안녕하세요! v-show="resul.length" 가 true, false의 조건이 되는 이유를 모르겠습니다!
- 해결됨웹 게임을 만들며 배우는 Vue
reduce 화살표 함수에서
안녕하세용 화살표 함수에서 리턴값 a+c말고 0이 의미하는 것은 어떤 의미인가요~?
- 미해결웹 게임을 만들며 배우는 Vue
홈런일 때
홈런일 땐 초기화가 되는 것이니 this.tries.push({ try: this.value, result: '홈런', }); 이 부분을 기재하지 않아도 상관 없나요??
- 미해결웹 게임을 만들며 배우는 Vue
v-for"t in tries" :key="t.try"
강의에선 :key 를 기재 하시 않으셨는데 완성본에선 key가 있더라구요! 해당 내용에 대해서 찾아봣으나 정확하게 이해가 되지 않아서 여쭤봅니다. key="t.try"가 의미하는 바는 무엇인가요??
- 미해결웹 게임을 만들며 배우는 Vue
웹팩에 에러가 나요 ㅠㅠ
--- 웹팩 에러 문구 뭐가 문제일까요 ㅠㅠ 이것저것 찾아보고 수정했는데 무슨 문제인지 모르겠습니다... 다시 처음부터 차근차근 하려면 폴더를 삭제하고 하면 되나요? 아니면 터미널 초기화 같은걸 시켜야 하나요...?
- 미해결웹 게임을 만들며 배우는 Vue
devtools 에러
사진과 같은 에러가 나오는데 어떻게 해결해야 할까요...?
- 미해결웹 게임을 만들며 배우는 Vue
this.$root.$data.turn 작동하지를 않습니다..ㅠㅠ
undefined TdComponent.vue?c5a7:15 {__ob__: Observer} TdComponent.vue?c5a7:16 {__ob__: Observer} TdComponent.vue?c5a7:17 undefined vue.esm.js?efeb:628 [Vue warn]: Error in v-on handler: "TypeError: Cannot read property '1' of undefined" found in ---> <TdComponent> at src/components/molecules/TdComponent.vue <TrComponent> at src/components/molecules/TrComponent.vue <TableComponent> at src/components/oranlsms/TableComponent.vue <TicTacToe> at src/components/TicTacToe.vue <App> at src/App.vue <Root> warn @ vue.esm.js?efeb:628 logError @ vue.esm.js?efeb:1893 globalHandleError @ vue.esm.js?efeb:1888 handleError @ vue.esm.js?efeb:1848 invokeWithErrorHandling @ vue.esm.js?efeb:1871 invoker @ vue.esm.js?efeb:2188 original._wrapper @ vue.esm.js?efeb:7565 vue.esm.js?efeb:1897 TypeError: Cannot read property '1' of undefined at VueComponent.onClickTd (TdComponent.vue?c5a7:19) at invokeWithErrorHandling (vue.esm.js?efeb:1863) at HTMLTableCellElement.invoker (vue.esm.js?efeb:2188) at HTMLTableCellElement.original._wrapper (vue.esm.js?efeb:7565) logError @ vue.esm.js?efeb:1897 globalHandleError @ vue.esm.js?efeb:1888 handleError @ vue.esm.js?efeb:1848 invokeWithErrorHandling @ vue.esm.js?efeb:1871 invoker @ vue.esm.js?efeb:2188 original._wrapper @ vue.esm.js?efeb:7565 제로초님 안녕하세요.. ㅠㅠ this.$root.$data.turn 작동하지를 않습니다..ㅠㅠ ㅇ
- 미해결웹 게임을 만들며 배우는 Vue
선생님 1-6 강좌 이름에 엠퍼센드가 들어가요.
Q&A가 앰퍼센드가 들어가서 이상해지는 거 같아요 혹시 제목을 고쳐주실 수 있으신가요?
- 미해결웹 게임을 만들며 배우는 Vue
선생님 e.preventDefault();의 의미를 한번 더 알려주실 수 있나요?
선생님 e.preventDefault();의 의미를 한번 더 알려주실 수 있나요? submit()가 되고 나서 새로고침을 방지해준다는 의미인가요?