반응형 소프트웨어 개발/Vue4 vue vite, yarn - alias 경로(path) 설정 1. vue vite에 alias 경로를 설정하기 위해서는 path 라이브러리를 설치합니다. yarn add path 2. vue프로젝트 디렉토리에 있는 vite.config.js 파일을 편집합니다. import { defineConfig } from 'vite' import vue from '@vitejs/plugin-vue' import path from 'path' // https://vitejs.dev/config/ export default defineConfig({ resolve:{ alias:{ '/@': path.resolve(__dirname,'./src'), '/@components': path.resolve(__dirname,'./src/components') } }, plugins:.. 2023. 4. 9. 윈도우 10/11 vue - yarn으로 vite 프로젝트 설정 1. 아래와 같은 명령어를 커멘드창에 입력합니다. yarn create vite 2. "yarn create vite"명령어를 실행을 하였으면 아래 그림과 같이 나타나며 Project name란에 프로젝트명을 작성합니다. 3. Select a framework 선택란에 다양한 javascript framework 선택지가 있지만 우리는 Vue 프로젝트를 생성하기에 Vue를 선택합니다. 4. Select a variant 선택란에서는 javascript를 선택합니다. 5. 정상적으로 프로젝트가 생성이 되었다면 아래 그림과 같이 나타납니다. 5. 생성한 프로젝트 디렉토리로 이동합니다. cd [프로젝트명] 6. yarn 명령어를 실행합니다. 별 다른 이슈가 없다면 아래 그림과 같이 나타납니다. yarn 7. .. 2023. 4. 9. [vuejs]비트 vite - Error [ERR_REQUIRE_ESM]: Must use import to load ES Module 1. 오류 증상 Error [ERR_REQUIRE_ESM]: Must use import to load ES Module Instead rename index.js to end in .cjs, change the requiring code to use import(), or remove "type": "module" from ..... 2. 원인 nodejs 버전에 맞지 않아서 생긴 오류 => nodejs 버전 최소 14.18.0 필요 3.해결 nodejs 16.xx 버전대로 설치하여 해결 2023. 2. 8. [Vue 3] should be avoided by marking the component with `markRaw` or using `shallowRef` instead of `ref`. 해결방법 이슈 should be avoided by marking the component with `markRaw` or using `shallowRef` instead of `ref` 원인 컴포넌트 참조 시 shallowRef 사용하지 않아서 발생 해결 방법 컴포넌트 참고를 shallowRef 사용하여 해결 import { shallowRef } from "vue"; import TodoPast from './TodoPast.vue'; ... ... export default{ setup() { const prov_compt = shallowRef(TodoPast); ... ... ... } } 2021. 12. 27. 이전 1 다음 반응형
