안녕하세요. 클스 입니다. 기존 프로젝트에서 vue3 + quasar 를 사용했는데, quasar가 기본적으로 yarn 기반 입니다. 그런데 친철하게도 pnpm도 지원합니다. 처음부터 quasar 프로젝트 생성시 pnpm 으로 하면됩니다. 아직 경험적 지원이라고 하네요~ $ pnpm create quasar # experimental support install pnpm $ brew install pnpm $ pnpm --version vi ~/.npmrc 수정 strict-ssl=false save=true save-exact=true shamefully-hoist=true 소스에서 패키지 설치 $ pnpm install $ pnpm outdated ==> 설치 버전과 최신버전 비교 그냥 업데이트 $ pnpm update 최신 업데이트 $ pnpm update -L 패키지 확인 pnpm-lock.yaml 소스 실행 $ pnpm dev ==> 에러 발생 [vite] Internal server error: No ESLint configuration found in /Users/demo/front-end/user_web/.quasar * 해결 방법 프로젝트 root에 .eslintrc.cjs 파일이 있음 rules: { ... } 에 아래와 같이 추가 '@typescript-eslint/no-unused-vars': 'warn', rules: { ... 'no-unused-vars': 'off', '@typescript-eslint/no-unused-vars': 'warn', }, * 환경변수 dotENV을 적용하여 실행하기 $ ENVIRONMENT=local pnpm dev 패키지 오래된것도 한번에 확인하고, 최신 버전도 한번에 설치해주고... 여러가지 장점도 있겠지만, 아직은 잘 모르겠습니다.  장점은 댓글로 달아주시면...

안녕하세요. 클스 입니다. vue에서 변수에 component 객체를 넣었더니, Vue.warn 이 떴다.  component 객체는 많은 정보를 담고 있어서, watch를 하게되면 엄청난 부하가 발생한다. 그래서 친절하게 markRaw를 사용하라고 알려준다. import { markRaw } from 'vue' ; export default { data() { return { layout: null , }; }, watch: { $route: { immediate: true , handler() { this .layout = markRaw( this .$route.meta.layout || DefaultLayout); }, }, }, }; Vue.js에서  markRaw  함수는 객체를 "원시"로 표시하는 데 사용되며, 이는 Vue 반응성 시스템에서 관찰되지 않음을 의미합니다. 특정 성능 문제가 있거나 특정 객체에 대해 Vue의 반응성 시스템을 선택 해제해야 하는 경우에만 사용하십시오. markRaw  함수는 다음과 같이 사용됩니다. const obj = { a: 1, b: 2, }; const rawObj = markRaw(obj); 이제  rawObj 는 반응성이 없습니다. 즉,  rawObj 의 속성이 변경되면 Vue는 렌더링을 다시 트리거하지 않습니다. markRaw  함수는 특정 성능 문제를 해결하는 데 유용합니다. 예를 들어, 매우 큰 객체를 반응성 객체로 선언하면 Vue는 객체의 모든 속성을 추적해야 합니다. 이는 성능 저하의 원인이 될 수 있습니다. 이 경우  markRaw  함수를 사용하여 객체를 반응성으로 선언하지 않고 렌더링을 다시 트리거하지 않도...