Javascript 为 filesaver.js 导入

Question

我刚开始使用 Javascript 中的导入功能，对 how to install filesaver.js.

中的说明感到困惑

在我的代码中我有：

<script src="/scripts/FileSaver.js"></script>

<script>
    import { saveAs } from 'file-saver/FileSaver';
    $("#xmlToFile").click(function() {
            var xml = $("#jobXml").val();
            var blob = new Blob([xml], { type: 'text/xml' });
            var filename = $("#Job_JobID").val();
            saveAs(blob, filename + ".txt");
        });
</script>

但是 Chrome 在带有 Unexpected Token {

的导入行上阻塞

我做错了什么？

Answer 1

该模块似乎是为使用 WebPack and Babel 的项目设计的，但您试图将其直接加载到浏览器中而不进行转换。

他们的 wiki has an example 展示了如何使用为浏览器预编译的版本：

<script src="http://cdn.jsdelivr.net/g/filesaver.js"></script>
<script>
      function SaveAsFile(t,f,m) {
            try {
                var b = new Blob([t],{type:m});
                saveAs(b, f);
            } catch (e) {
                window.open("data:"+m+"," + encodeURIComponent(t), '_blank','');
            }
        }

SaveAsFile("text","filename.txt","text/plain;charset=utf-8");

</script>

Answer 2

您需要启用实验性 Javascript 功能才能使用导入语句。

查看此 MDN link 以获得更多帮助。

Answer 3

您不需要导入另存为试试这个

    $("#xmlToFile").click(function() {
            var xml = "texte here"
            var blob = new Blob([xml], { type: 'text/xml' });
            saveAs(blob, "title" + ".txt");
        });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://fastcdn.org/FileSaver.js/1.1.20151003/FileSaver.min.js"></script>

<button id="xmlToFile">Click</button>

Answer 4

我没有足够的权力发表评论，但想为可能正在寻找的其他人添加，

 <script src="https://fastcdn.org/FileSaver.js/1.1.20151003/FileSaver.min.js"></script>

用法不再有效。那个网站不存在。您可以 npm install file-saver，然后指向 <script> 标签中的 node_modules FileSaver.js 文件。

Javascript 为 filesaver.js 导入

Javascript Import for filesaver.js

javascript

filesaver.js