쓰기

# 오류Deprecation Warning: Sass @import rules are deprecated and will be removed in Dart Sass 3.0.0.More info and automated migrator: https://sass-lang.com/d/import │ @import "icons/dripicons"; │ ^^^^^^^^^^^^^^^^^ ╵ src/assets/scss/custom/plugins/_icons.scss 8:9 @importsrc/assets/scss/icons.scss 11:9 root stylesheet # 원인원래 Sass는 @import 규칙을 사용하여 다른 파일을 하나의 글로벌 네임스페이스로 로드했으며, 모든 내장 기능도 전 세계적으로 사용할 ..

# 오류Error: error:0308010C:digital envelope routines::unsupported at new Hash (node:internal/crypto/hash:67:19) at Object.createHash (node:crypto:130:10) at module.exports (/Users/user/Programming Documents/WebServer/untitled/node_modules/webpack/lib/util/createHash.js:135:53) at NormalModule._initBuildHash (/Users/user/Programming Documents/WebServer/untitled/node_modules/webpack/lib/NormalModul..

컴퓨터를 교체하고 기존에 개발하던 Vue 프로젝트 실행하고자 npm install 명령어 입력하였으나 아래와 같은 오류가 발생했다.node-gyp 라는 모듈 안에서 발생한 것 같았다.node@12 사용할 때는 문제가 없었던 것 같은데.. 16으로 업그레이드하고서 문제가 생긴 것 같다.node 12 또는 14 버전을 설치해보려고 했지만 옛 버전이라 brew를 통해서는 설치가 안 되는 것 같았다.----내 컴퓨터에 설치된 모듈버전은 다음과 같다.node -v 16.20.2npm -v 8.19.4 # 오류npm ERR! code 1 npm ERR! path /Users/user/Documents/GitHub/nesp/nesp-v2/nesp-web-vue/node_modules/deasync npm ERR! c..

새로운 node 프로젝트 생성하고 최초 commit 하기 위해 .gitignore 파일을 생성했고 node_modules 디렉토리나 .DS_Store 같은 파일들을 추가했는데 아무리 해도 커밋제외 대상으로 적용이 안 되었다. 인터넷 찾아보니 캐시 지우는 것 같은 명령어를 실행하길래 그대로 가져왔다. .gitignore 파일 생성하고 node_modules/ 추가하기 touch .gitignore && echo "node_modules/" >> .gitignore && git rm -r --cached node_modules ; git status

자바로 문자열에서 URL을 찾아서 다른 문자로 치환하는 기능이 필요했다. 당연히 인터넷 검색해서 이것저것 찾아봤는데 다양한 url 형식을 모두 찾아내는 정확한 정규식은 잘 없었다. 검색해서 찾은 것 + 내가 수정 및 변형해서 최종적으로 아래 정규식이 제일 정확했다. 문자열 속에서 2차, 3차 도메인과 쿼리스트링은 물론 URL에 한글 포함된 경우도 찾을 수 있다. 정규 표현식 Regular Expression ((http[s]?|ftp):\/\/)?(?:www\.)?[-a-zA-Z0-9@:%._\+~#=가-힣]{1,256}[:|\.][a-zA-Z0-9()]{1,6}\b(?:[-a-zA-Z0-9()@:%_\+,.~#?&\/=가-힣]*) as a Java string "((http[s]?|ftp):\\/\\/..

내가 일하는 곳에서는 배포환경을 주로 다음과 같이 셋 또는 넷으로 설정한다. Local Develop Real Staging 이번에는 webpack 사용하여 공통 js모듈을 개발했는데 빌드 설정 하면서 웹팩에서 기본으로 사용하는 mode 이름 때문에 조금 애먹었다. 웹팩에서 사용하는 mode는 none | development | production 세 종류가 있는데, none은 말 그대로 논이고, development가 이제 내가 생각하는 Local 느낌이고 production이 real 같은 배포용이다. mode를 저 세개 외에 다른 이름은 사용할 수 없다. 다른거 입력하면 웹팩 실행할 때 에러난다. 나는 개발환경에 배포하는거 이름을 굳이굳이 development로 하겠다고 package.json 스..

옛날엔 뭐 톰캣 임시폴더 경로에서 파일 찾아서 가져오고 그랬던 것 같은데... FileReader 사용하니까 되게 간단하네. HTML Javascript document.getElementById("id_input_file").onchange = (inputEvent) => { let file = inputEvent.target.files[0] var reader = new FileReader() reader.onload = (readerEvent) => { doucment.getElementById("id_img").setAttribute("src", readerEvent.target.result) } reader.readAsDataURL(inputEvent.target.files[0]) } https..

하나의 프로젝트 안에서 디바이스 별로 디렉토리를 나누어 pc용 모듈, mobile용 모듈을 따로 개발하려고 한다. 즉, 한 번의 빌드로 pc.js, mobile.js 라는 산출물을 만들어야 한다. 2개 이상의 js 파일로 번들링 하기 위한 설정이다. // webpack.config.js entry : { index: ! isDev ? './dist/index.js' : './src/pc/index.js', mobile: ! isDev ? './dist/mobile.js' : './src/mobile/index.js' }, output: { filename: "[name].js", chunkFilename: '[name][id].js', path: path.resolve(__dirname, 'dist'),..

빌드환경에 해당하는 .env 파일 사용하기 먼저, 필요한 노드모듈을 설치한다. npm install --save-dev dotenv @rollup/plugin-replace 빌드환경은 로컬PC(local), 개발서버(development), 운영서버(production) 총 3가지로 분류할 것이며 이를 Mode라 명칭할 것이다. 프로젝트 루트경로에 모드별 .env 파일을 생성하고 프로퍼티를 작성한다. .env.local (mode: local) .env.dev (mode: dev) .env.real (mode: real) 앱 실행 스크립트에 mode 환경변수를 추가한다. --environment MODE:[모드] // package.json { "scripts": { "build-development":..

App.svelte JsonParser.svelte {key} : expanded = !expanded}> {value} {#if expanded} {#each entries as [key, value], index(index)} {/each} {/if} Result