Webpack

6992 ワード

webpack テキストリンク

1.登場背景

//hello.js
function helloWorld(a){
	return 'hello world'+a+'!' 
}

// app.js
console.log(helloWorld('yoooonk'));  // hello world yooooonk!

...
<body>
  <script src="src/hello.js"></script>
  <script src="src/app.js"></script>
</body>

モジュールがない場合は、htmlファイルに上記の方法でロードして実行します.
これにより、関数はグローバルscopeで動作します.

関数スキャンを作成して使用します.

var hello = hello||{};
(function(){
	function helloWorld(a){
	return 'hello world'+a+'!' 
    }
  
  hello.helloWorld = helloWorld;
})

exportsキーワードを使用してモジュールを作成し、require()関数を呼び出して使用できます.Nodejsの使用方法

// hello.js
exports function helloWorld(a){return 'hello world'+a+'!' }

// app.js
const helloWorld = require('./hello.js');

helloWorld('yooooonk');

標準モジュールシステムの出現により、通常、バーベルおよびネットワークパッケージを使用してモジュールシステムを使用する.
EXportキーワードを使用してモジュールを作成し、importキーワードをインポートして使用します.

//hello.js
export function helloWorld(a){return 'hello world'+a+'!' }

// app.js
import * as hello from './hello.js';
//import {helloWorld} 
hello.helloWorld(a);

この問題について(Webpack), 我々は、より多くの情報をここで見つけました https://velog.io/@ouo_yoonk/Webpack

テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。

Collection and Share based on the CC Protocol