[Figma - 노코드 툴 Anima plugin 연결] npm run dev 에러 해결

우선 연결 절차

 

1. figma에서 원하는 레이어 선택 후 anima plugin을 실행

 

2. Anima에 가입이 되어 있다는 전제 하

Run -> Get code -> 원하는 코드툴 선택 (html, vue, react, no care) -> anima로 연결

 

3.

pro 를 사용한다면 export code를 하면 되지만

난 그냥 코드를 CnP 해주었다.

 

4. VSC에서 실행시

 

우선 node.js 설치해주기

그 다음에 README.md 대로 해주면 된다.

 

npm install

다음에 

npm run dev 에서 오류가 나는 경우가 있는데,

 

package.json에서 scripts 부분에 뭔가 오류가 있다고 하는데

npm install -g parcel-bundler

나는 parcel관련 설치해주면 해결이 되었었다.

 

그리고 debugger가 연결이 안되는 오류는

npm install react react-dom

난 리액트 코드로 받았기 때문에 얘를 설치해주었더니 되었다

얘네 install 해주고 npm run dev 하면 잘 실행됨.

그리고 http://localhost:1234/ 접속하면 화면이 잘 보인다. 

 

근데 나는 얘네가 BE 연결해도 작동이 원활하게 되는지... 불신이 되어서

http://localhost:1234/ 접속한 곳에서 

개발자 도구 켜서 copyOuterPATH랑 css요소 복붙 해놨당...