如何使用babel传输index.html？

我有一个ES6模块的网页，我想用babel将其转换为ES5。关于https://babeljs.io/docs/setup/#installation的babel文档，我可以用./node_modules/.bin/babel js -d target成功传输javascript文件夹，但它们不会在那里传输任何HTML。我怎样才能储存我的index.html？用同样的语法使用它失败：如何使用babel传输index.html？

./node_modules/.bin/babel index.html -d index2.html 
SyntaxError: index.html: Unexpected token (1:0) 
> 1 | <!DOCTYPE html> 
    |^
    2 | <html> 
    3 | 
    4 | <head>

MWE

export default "Hello World";

<!DOCTYPE html> 
 
    <html> 
 
    <body> 
 
    <script type="module"> 
 
    import message from "./js/message.js"; 
 
    window.message = message; 
 
    </script> 
 
    <button onclick="alert(`Message: ${window.message}`);">Get Message</button> 
 
    </body> 
 
    </html>

我用巴贝尔6.24.1（巴贝尔核心6.25.0）与NPM 3.10 0.10。我知道我不需要这个MWE的模块，真正的页面要复杂得多。

P.S .:我想继续开发未转换的版本以保留我的工作流程。我想仅将生成的代码用于生产。

来源

2017-06-29 Konrad Höffner

Babel没有实现浏览器模块支持。 – loganfsmyth

你不能。

Babel是一个JavaScript翻译器，它不涉及HTML，甚至不涉及HTML中嵌入的JavaScript。

重写您的HTML以使用外部JavaScript。使用addEventListener而不是内部事件处理程序属性。然后将Babel应用于JS文件。

来源

2017-06-29 18:19:53 Quentin

问题是我的代码是在模块中，我不能在我的HTML中不使用模块语法来包含模块（对不起，忘了添加这个要求：我想开发没有babel，只用于生产）。另外，让我的JavaScript知道我的HTML元素不是不好的风格吗？ –

如何使用babel传输index.html？

回答

相关问题