Browserify 시도 (node.js의 require 메소드를 브라우저에서 사용)
6333 단어 browserify자바스크립트Node.js
경위
환경
npm
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
`-- [email protected]
Browserify란?
Browsers don't have the require method defined, but Node.js does. With Browserify you can write code that uses require in the same way that you would use it in Node.
node-fetch를 node.js에서 실행
구현 코드
node.js
http://localhost:5000/file.txt
를 준비해 둔다 example.js
const fetch = require('node-fetch');
async function Fetch() {
const response = await fetch('http://localhost:5000/file.txt', {method: 'GET'});
const body = await response.text();
console.log(body);
}
Fetch();
실행 결과
c:\BrowserifyExample>node example.js
The test succeeded.
require('node-fetch')를 브라우저에서 실행
node ./node_modules/browserify/bin/cmd.js example.js -o public/bundle.js
<!DOCTYPE html>
<html>
<body>
<h1>Open the Console on your browser.</h1>
<script src="bundle.js"></script>
</body>
</html>
node ./node_modules/serve/bin/serve.js ./public
익스프레스 프레임워크와 협력
browserify-middleware
를 사용하면 서버 측에서 require ()가있는 node.js에 대한 JavaScript를 브라우저에서 처리 할 수있는 JavaScript로 변환하여 반환 할 수 있습니다.const browserify = require('browserify-middleware');
const express = require('express');
const app = express();
app.use(`/`, browserify("./example.js"));
const server = app.listen(3000, () => {
const address = server.address();
console.log(`http://localhost:${address.port}\n`);
});
변환된 JavaScript 코드
소스 코드
Reference
이 문제에 관하여(Browserify 시도 (node.js의 require 메소드를 브라우저에서 사용)), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/hachicomb/items/3cb5abf3547dcbf6a735텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)