JS：在客户端启用导出/导入（ES6 或使用 babel）？

Question

JS：在客户端启用导出/导入（ES6 或使用 babel）？

And*_*ius 5 javascript google-chrome include ecmascript-6 babeljs

我想导出/导入应用程序目录中的本地文件：

我的index.html：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <script src="https://unpkg.com/babel-standalone@6.15.0/babel.min.js"></script>
</head>
<body>
<script type="text/babel" src="main.js"></script>
</body>
</html>

Run Code Online (Sandbox Code Playgroud)

actions.js：

export const ADD_TODO = 'ADD_TODO'
export const TOGGLE_TODO = 'TOGGLE_TODO'
export const SET_VISIBILITY_FILTER = 'SET_VISIBILITY_FILTER'

Run Code Online (Sandbox Code Playgroud)

main.js（从index.html加载）：

import {ADD_TODO, TOGGLE_TODO, SET_VISIBILITY_FILTER} from 'actions'

Run Code Online (Sandbox Code Playgroud)

现在如果我使用没有 babel 的 javascript，我会得到：

Uncaught SyntaxError: Unexpected token import

我使用Chrome 浏览器版本 60。这个版本不是应该已经支持ES6了吗？通过支持，我应该能够使用导出/导入？

我还尝试了 babel （使用从加载的独立 babel index.html）。

然后我得到这个错误：

Uncaught ReferenceError: require is not defined
    at <anonymous>:4:16
    at n (https://unpkg.com/babel-standalone@6.15.0/babel.min.js:12:27049)
    at r (https://unpkg.com/babel-standalone@6.15.0/babel.min.js:12:27558)
    at e.src.i.(anonymous function).error (https://unpkg.com/babel-standalone@6.15.0/babel.min.js:12:27873)
    at XMLHttpRequest.i.onreadystatechange (https://unpkg.com/babel-standalone@6.15.0/babel.min.js:12:27316)

Run Code Online (Sandbox Code Playgroud)

我知道require客户端不存在这种情况，但这不是 ES6 的导出/导入（不是 NodeJS 导出）语法吗？..

我需要诉诸类似的方法webpack才能发挥作用吗？

根据这个答案：尝试使用 Chrome 导入 ES6 但它似乎不起作用，您需要Experimental Web Platform在 Chrome 中启用标志并使用<script type="module" src="main.js"></script>. 但使用它会停止加载任何内容。看来浏览器只是忽略了这种类型。即使这种方法可行，那么我想我将无法使用 babel，因为它会使用不同的类型？

PS根据此： http: //2ality.com/2014/09/es6-modules-final.html#named-exports-several-per-module它应该可以工作..