사용자 정의 모듈(User Define Module) 활용하기

사용자 정의 모듈(User Define Module) 활용하기

앞서 Node.js 환경 내장 모듈인 File System과 외부 개발 모듈인 http-server를 배웠습니다.
이제 직접 모듈을 생성해 봅니다.
먼저 모듈을 담을 [modules] 디렉터리를 만든 후 combineJS.js 파일을 생성합니다.

                    
                        // combineJS.js 파일 소스 내용
                        /* ! combineJS module @ hyungju-lee, 2020 */

                        // combineJS 모듈 정의
                        function combineJS(){
                            console.log('combineJS 모듈');
                        }
                    
                

위와 같이 코드를 입력하고 저장합니다.
제작할 모듈은 두 개 이상의 자바스크립트 파일을 병합(combine)하는 역할을 합니다.
입력한 코드는 자바스크립트 함수로, 호출하면 콘솔에 메시지를 출력합니다.
이 코드는 분리된 모듈을 제대로 호출하는지 확인하려고 입력한 것입니다.

combineJS.js 모듈을 호출할 mergeScripts.js 파일을 생성합니다.
모듈을 호출하는 코드 require('모듈 경로')를 입력한 후 적절한 변수를 만들어 참조합니다.
계속해서 불러들인 모듈을 실행하는 코드를 추가합니다.
다음을 참고하여 코드를 완성한 후 저장합니다.

                    
                        // mergeScript.js 파일 소스 내용
                        // 사용자 정의 모듈 'modules/combineJS.js' 호출
                        var combineJS = require('./modules/combineJS.js');

                        // combineJS 모듈 사용
                        combineJS();
                    
                

필요한 파일을 생성했으면, Git Bash에서 node mergeScript.js 명령어를 입력하여 실행합니다.
mergeScript.js 파일이 실행되면서 combineJS()를 수행합니다.
하지만 아래쪽에 '객체는 함수가 아닙니다.(combineJS is not a function)'라는 TypeError 오류메시지가 출력됩니다.
이 메시지로 현재 코드에 문제가 있음을 확인할 수 있습니다.

combineJS.js 파일에서 모듈을 외부로 출력(module exports)하지 않아 mergeScript.js 파일에서 모듈을 참조할 수 없어 발생한 오류입니다.
다음을 참고하여 외부로 출력하는 코드를 추가로 입력하고 저장합니다.

                    
                        // combineJS.js 파일 소스 내용
                        /* ! combineJS module @ hyungju-lee, 2020 */

                        // combineJS 모듈 정의
                        function combineJS(){
                            console.log('combineJS 모듈');
                        }

                        // combineJS 모듈 외부로 출력 (Exports)
                        module.exports = combineJS;
                    
                

다시 Git Bash에서 node mergeScript.js 명령어를 실행하면 오류 없이 conbineJS.js 모듈 코드가 정상적으로 실행됩니다. 다음 소스 처럼 combineJS.js의 코드를 정리할 수도 있습니다.
별도로 함수 이름을 정의하는 과정없이 바로 함수를 모듈로 출력했습니다.
이처럼 필요에 따라 다른 형태로도 사용할 수 있음을 기억합니다.

                    
                        // combineJS.js 파일 소스 내용
                        /* ! combineJS module @ hyungju-lee, 2020 */

                        // combineJS 모듈 외부로 출력 (Exports)
                        module.exports = function (){
                            console.log('combineJS 모듈');
                        };
                    
                

자바스크립트를 병합하는 모듈의 특성상 자바스크립트 파일을 읽고 쓸 수 있어야 합니다.
combineJS.js 파일 위쪽에서 내장 모듈 File System을 호출할 수 있게 합니다.
그런 다음 모듈 함수의 전달인자를 읽어 올 자바스크립트 파일 목록(배열), 병합하여 생성할 파일 경로(문자열) 순으로 설정합니다.
마지막으로 콘솔에 전달인자를 출력할 코드를 추가하여 전달인자 값을 제대로 받아 오는지 확인합니다.

                    
                        // combineJS.js 파일 소스 내용
                        /* ! combineJS module @ hyungju-lee, 2020 */
                        // File System 내장 모듈 호출
                        var fs = require('fs');

                        /*
                         * combineJS 모듈 정의 및 외부로 출력
                         * 모듈 내부에 전달받을 인자(배열, 문자열) 설정
                         */
                        module.exports = function(jsSrc, exportJs){
                            console.log(jsSrc, exportJs);
                        }
                    
                

                    
                        // mergeScript.js 파일 소스 내용
                        // 사용자 정의 모듈 'modules/combineJS.js' 호출
                        var combineJS = require('./modules/combineJS.js');

                        /*
                        *  combineJS 모듈 사용
                        *  전달인자 1 : 병합하고자 하는 JS 파일 리스트(배열)
                        *  전달인자 2 : 병합되어 생성된 파일 경로(문자열)
                        * */
                        combineJS(['./readFile.js', './writeFile.js'], './jsCombine.js');
                    
                

node mergeScript.js 다시 combineJS.js 파일로 돌아와 그림처럼 코드를 입력합니다.
첫 번째 인자로 전달받은 배열 아이템(병합할 개별 자바스크립트 파일)마다 코드를 적용할 수 있도록 배열 객체의 forEach() 코드를 입력했습니다.
forEach() 내부에 입력된 함수는 세 개의 전달인자 값을 받습니다.
첫번째는 배열의 개별 아이템(file)을 가리키고, 두번째는 배열 각 아이템의 색인(index) 숫자입니다.
세번째 전달인자는 배열 자신을 가리키지만, 현재 코드에서는 의미가 없어서 생략했습니다.
이 코드는 전달받은 인자 값을 콘솔에서 확인할 수 있게 합니다.

                    
                        // combineJS.js 파일 소스 내용
                        /* ! combineJS module @ hyungju-lee, 2020 */
                        // File System 내장 모듈 호출
                        var fs = require('fs');

                        /*
                         * combineJS 모듈 정의 및 외부로 출력
                         * 모듈 내부에 전달받을 인자(배열, 문자열) 설정
                         */
                        module.exports = function(jsSrc, exportJs){
                            // 배열 jsSrc를 개별적으로 접근 조작하기 위해
                            // forEach 배열 메소드 사용
                            jsSrc.forEach(function(file, index){
                                console.log(file, index);
                            });
                        }
                    
                

Git Bash에서 node mergeScript.js 명령어를 다시 실행하면, 첫 번째 인자로 전달받은 jsSrc 배열의 각 아이템(file)과 각 아이템의 색인 숫자가 출력됩니다.

                    
                        // combineJS.js 파일 소스 내용
                        /* ! combineJS module @ hyungju-lee, 2020 */
                        // File System 내장 모듈 호출
                        var fs = require('fs');

                        /*
                         * combineJS 모듈 정의 및 외부로 출력
                         * 모듈 내부에 전달받을 인자(배열, 문자열) 설정
                         */
                        module.exports = function(jsSrc, exportJs){
                            // 배열 jsSrc를 개별적으로 접근 조작하기 위해
                            // forEach 배열 메소드 사용
                            jsSrc.forEach(function(file, index){
                                var content = fs.readFileSync(file);
                                console.log('콘텐츠: \n' + content);
                            });
                        }
                    
                

각 file의 경로로 문서 내용을 읽어오는 코드를 추가로 입력합니다.
combineJS.js 파일에서 내장모듈 File system의 readFileSync()에 file을 전달하여 동기적으로 읽어 들이고,
변수 content가 참조한 내용을 콘솔에 출력하도록 코드를 입력하고 저장합니다.
Git Bash에서 node mergeScript.js 명령어를 실행하면 각 자바스크립트 파일의 내용이 화면에 출력됩니다.

그림처럼 빈 문자열을 참조한 변수 mergeCode를 생성하여 읽은 각 파일을 병합합니다.
forEach()의 함수 내부에 문자열 접합코드를 입력하고, 콘솔에 출력하는 코드를 추가합니다.
각 파일 내용이 병합된 결과는 Git Bash에서 확인할 수 있습니다.

                    
                        // combineJS.js 파일 소스 내용
                        /* ! combineJS module @ hyungju-lee, 2020 */
                        // File System 내장 모듈 호출
                        var fs = require('fs');

                        /*
                         * combineJS 모듈 정의 및 외부로 출력
                         * 모듈 내부에 전달받을 인자(배열, 문자열) 설정
                         */
                        module.exports = function(jsSrc, exportJs){
                            var mergeCode = '';
                            // 배열 jsSrc를 개별적으로 접근 조작하기 위해
                            // forEach 배열 메소드 사용
                            jsSrc.forEach(function(file, index){
                                // fs.readFileSync() 사용하여 파일 내용 읽기
                                mergeCode += fs.readFileSync(file);
                            });
                            console.log(mergeCode);
                        }
                    
                

다음으로는 내장 모듈 File System의 writeFileSync()를 사용하여
병합된 코드(mergeCode)를 내용으로 하는 새 문서를 생성하도록 코드를 작성합니다.
사용 방법은 앞서 배운 것처럼 첫 번째로 새 문서 파일의 생성 경로(exportJS)를,
두 번째로 새 문서의 내용(mergeCode)을 인자로 전달합니다.
다음을 참고하여 코드를 입력한 후 저장합니다.

                    
                        // combineJS.js 파일 소스 내용
                        /* ! combineJS module @ hyungju-lee, 2020 */
                        // File System 내장 모듈 호출
                        var fs = require('fs');

                        /*
                         * combineJS 모듈 정의 및 외부로 출력
                         * 모듈 내부에 전달받을 인자(배열, 문자열) 설정
                         */
                        module.exports = function(jsSrc, exportJs){
                            var mergeCode = '';
                            // 배열 jsSrc를 개별적으로 접근 조작하기 위해
                            // forEach 배열 메소드 사용
                            jsSrc.forEach(function(file, index){
                                // fs.readFileSync() 사용하여 파일 내용 읽기
                                mergeCode += fs.readFileSync(file);
                            });
                            fs.writeFileSync(exportJs, mergeCode);
                        }
                    
                

지금까지 실습한 내용을 정리하면 다음과 같이 구분할 수 있습니다.
하나는 모듈(module)을 사용하는 이해를 돕기 위해 자바스크립트 파일을 병합하는 간단한 모듈 하나를 생성하여
이 모듈을 외부로 출력(module exports)하는 방법이고, 다른 하나는 모듈을 호출하여 사용하는 방법입니다.
여전히 사용 방법이 어렵다면, 배운 내용을 복습하여 잘 정리한 후 다음 과정으로 넘어가는 것이 좋습니다.