IT개발/Vue.js(12)
-
아놔... ".vue" 붙이는걸...ㅠㅠ Failed to mount component: template or render function not defined.
In my case, I imported my component (in router) as: import bsw from 'common-mod/src/components/webcommon/webcommon' It is simply solved if I changed it to import bsw from 'common-mod/src/components/webcommon/webcommon.vue' https://stackoverflow.com/questions/41983767/vue-template-or-render-function-not-defined-yet-i-am-using-neither Vue template or render function not defined yet I am using neit..
2023.03.07 -
VS CODE 플러그인
- Vetur - Night Owl - Material Icon Theme - Live Server - ESLint - Prettier - Auto Close Tag - Atom Keymap
2022.03.04 -
[Vue] process.env.XXXX 사용시, 왜 undefined 가 생기지?
.env.production 파일에 아래와 같이 설정하고 # production 설정파일 NODE_ENV=production BASE_URL=/ KAKAO_URL=https://www.kakaocorp.com/ //js단 alert(`${process.env.KAKAO_URL}`); 아무리 호출해도 안되길래 구글링해서 봤더니... 역시 document는 진리! Note that only NODE_ENV, BASE_URL, and variables that start with VUE_APP_ will be statically embedded into the client bundle with webpack.DefinePlugin. It is to avoid accidentally exposing a priv..
2021.12.31 -
Vue 수요가 늘것 같다!!! S전자도 Vue를 FrontEnd Framework로 가져갈수도 있다고하니... 와우!
https://www.youtube.com/watch?v=KSH9d8KG3ag [라이브] 국내시장 Vue에 대한 수요가 늘어날것 같아요 제가 수강도하고, 구독하고 있는 '개발의 품격'님의 영상에서 좋은 소식을 알리네요. Vue로 죽기살기로 한번 해보려고 하고 있는데 흐흐 잘됐다. 앞으로 이걸로 당분간 뽕을 뽑아보자!!
2021.10.23 -
[Vue] component A 에서 component B 함수 호출 방법2
// Component A Vue.component('UserMngtSearchForm', { created() { //생성될때, root 콤포넌트의 refs에 유니크하게 Component A의 this객체를 바인딩함. this.$root.$refs.UserMngtSearchForm = this; }, methods: { search: function() { alert('UserMngtSearchForm search is called'); } } }); // Component B Vue.component('UserMgntDetailForm', { methods: { deleteItem: function() { //삭제후, Component A의 search 함수 호출 this.$root.$refs.Use..
2021.07.29 -
[Vue] component A 에서 component B 함수 호출 방법1
// Component A Vue.component('UserMngtSearchForm', { methods: { search: function(){ alert('UserMngtSearchForm search is called'); }, } }) // Component B Vue.component('UserMgntDetailForm', { methods: { delete: function(){ // Component A의 search 함수 호출 component('UserMngtSearchForm').search(); }, } })
2021.07.29 -
[Vuejs] mutations/actions 함수의 파라미터는 제한이 있다!
단일 파라미터는 상관없으나 2개이상의 파라미터를 전달해야할경우! 반드시 { var1, var2 ,var3 .... } 괄호를 엮어 객체화 시켜줘서 던져랏! { /* ... */ mutations : { SET_ITEMS_AND_PAGE(state, {items,page}){ //
2021.07.27 -
Vuex 라이프 사이클
[ref] Vuex 기본개념 : Vuex 제대로 사용하는 방법 (Vuex의 기초부터 심화까지) [ref] Vuex 심화 (모듈화): [Vuetorials] 7. Vuex Best Practice로 가는 여정 사용 흐름 예시) javascript 파일 => Actions,Mutations, Getters,State 접근 가능 router.js 참고 : store.getters["myStore/isLogin"] Vue Components => Actions 호출 (비동기일때) => Mutations호출 => State 조작 https://livebook.manning.com/book/testing-vue-js-applications/chapter-6/70 Vue Components => Mutations호출..
2021.07.27 -
npm run build 전후 스크립트 추가하기
// package.json 내부 설정 { "name": "npm-scripts-example", "version": "1.0.0", "description": "npm scripts example", "scripts": { "prebuild": "echo I run before the build script", "build": "cross-env NODE_ENV=production webpack", "postbuild": "echo I run after the build script" } }
2021.07.15 -
vue router 에서 vuex modules store 참조하기
router.js에서 store.js 내 vuex 저장소 모듈을 사용하려면 아래와 같이, store.getters["스토어모듈명/함수명"] 접근하면 됨. const isLogin = store.getters["userStore/isLogin"]; // router.js import Vue from "vue"; import Router from "vue-router"; import { store } from "@/js/store/store"; Vue.use(Router); ... ... router.beforeEach((to, from, next) => { console.log(store); const isLogin = store.getters["userStore/isLogin"]; if (to.match..
2021.07.14 -
devexpress customs theme 적용하기
https://js.devexpress.com/Documentation/20_1/Guide/Vue_Components/Create_a_DevExtreme_Application/ Create a DevExtreme Application: DevExtreme - JavaScript UI Components for Angular, React, Vue and jQuery by DevExpress 20.1 Thank you! We appreciate your feedback. js.devexpress.com Configure Themes Switch the Theme The DevExtreme Vue Template uses a main theme for the view content and an addition..
2021.07.08 -
Vue.js #01. 뷰 시작하며...
프론트 개발자가 부족해 급하게 포지션을 변경하게 되었다. 그러면서 프론트단 기술을 뭘로 할것인가? Angular를 할까? Vue.js를 할까? 결국 Vue.js로 선택! 사실 jquery만 사용하여 MVC 개발을 하다가 MVVM을 하려하니 뇌구조를 바꿀필요가 있었다. 프로젝트의 목표가 명확하니 그과정이 비록 힘들지라도 반드시 이겨내고 해내리라. 계획은 이러하다. 1. Vue 기초 => 유료강의로 후다닥 2. Vue 응용 => Todo리스트 실습 3. Vue 실무 => Vue용 DevExpress UI 컴포넌트 기반 개발 기반 지식 : 자바스크립트(ES5, ES6), Webpack, nodejs, git, npm(node package manager) ... 그과정을 블로그로 남겨보겠다. kr.vuejs...
2020.12.02