반응형 소프트웨어 개발/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 다음 반응형
