나는 새로운 해요 ES6 (ECMAScript를 6), 그리고 나는 그것의 사용하고자하는 모듈 시스템을 브라우저에서. ES6이 Firefox와 Chrome에서 지원된다는 것을 읽었지만 다음을 사용하여 다음 오류가 발생합니다.export
Uncaught SyntaxError: Unexpected token import
test.html 파일이 있습니다.
<html>
<script src="test.js"></script>
<body>
</body>
</html>
및 test.js 파일
'use strict';
class Test {
static hello() {
console.log("hello world");
}
}
export Test;
왜?
<script type="module"></script>추가하지 않으면 해당 오류가 발생한다는 것입니다. 나는 <script>import ... </script>크롬이 이제 플래그없이 ES6 모듈을 지원한다고 고의적으로 벽에 머리를 부딪 히고 있었는데, 브라우저에 이것이 ES6 모듈이라는 것을 지정하기 위해 type 속성이 필요하다는 것을 알았습니다. 오류.
답변:
현재 많은 최신 브라우저가 ES6 모듈을 지원합니다. 스크립트 (응용 프로그램의 진입 점 포함)를 가져 오는 한이를 사용하여 <script type="module" src="...">작동합니다.
자세한 내용 은 caniuse.com 을 참조하십시오 : https://caniuse.com/#feat=es6-module
Chrome 베타 (61) / Chrome Canary에서 ES6 모듈을 사용해 볼 수 있습니다.
폴 아일랜드어로 할일 MVC의 참조 구현 - https://paulirish.github.io/es-modules-todomvc/
기본 데모가 있습니다-
//app.js
import {sum} from './calc.js'
console.log(sum(2,3));
//calc.js
let sum = (a,b) => { return a + b; }
export {sum};
<html>
<head>
<meta charset="utf-8" />
</head>
<body>
<h1>ES6</h1>
<script src="app.js" type="module"></script>
</body>
</html>
도움이 되었기를 바랍니다.
<script type="module"></script>추가해야한다는 점입니다. 그렇지 않으면 오류가 발생합니다. 나는 <script>import ... </script>크롬이 이제 플래그없이 ES6 모듈을 지원한다고 고의로 계속 벽에 머리를 부딪 히고 있었고, 브라우저에 이것이 ES6 모듈이라는 것을 지정하기 위해 type 속성이 필요하다는 것을 알았습니다.
js소스 를 가질 수 없습니다 ).
안타깝게도 현재 많은 브라우저에서 모듈을 지원하지 않습니다.
이 기능은 현재 브라우저에서 기본적으로 구현되기 시작했습니다. TypeScript 및 Babel과 같은 많은 트랜스 파일러와 Rollup 및 Webpack과 같은 번 들러에서 구현됩니다.
MDN 에서 발견
그것은 내 mjs를 스크립트에 추가하는type="module" 데 도움이되었습니다 import.
<script type="module">
import * as module from 'https://rawgit.com/abernier/7ce9df53ac9ec00419634ca3f9e3f772/raw/eec68248454e1343e111f464e666afd722a65fe2/mymod.mjs'
console.log(module.default()) // Prints: Hi from the default export!
</script>