代码之家  ›  专栏  ›  技术社区  ›  GaryO

用typescript(newb)导入外部模块时出现问题

  •  0
  • GaryO  · 技术社区  · 7 年前

    index.d.ts 看起来像这样:

    declare namespace FileSaver {
        function saveAs(data: Blob, filename?: string, disableAutoBOM?: boolean): void;
    }
    declare global {
        const saveAs: typeof FileSaver.saveAs;
    
        interface Window {
            saveAs: typeof FileSaver.saveAs;
        }
    }
    export = FileSaver;
    

    当我在代码中导入时(尝试了各种方法,这里是最新的):

    import { saveAs } from 'file-saver';
    // later...
    saveAs(blob, 'stuff.json');
    

    汇总给我这个错误:

    build/js/src/ngl.js → build/js/ngl.dev.js, build/js/ngl.esm.js...
    (!) Missing global variable name
    Use output.globals to specify browser global variable names corresponding 
      to external modules
    file-saver (guessing 'fileSaver')
    

    而且我的代码在浏览器(Chrome)中不起作用。我在运行时得到:

    viewer.js:915 Uncaught TypeError: Cannot read property 'saveAs' of undefined
        at Viewer.__render (viewer.js:915)
        at Viewer.render (viewer.js:947)
        at viewer.js:745
    

    这是我的 rollup.config.js (因此略为缩短):

    import buble from 'rollup-plugin-buble';
    import json from 'rollup-plugin-json';
    import resolve from 'rollup-plugin-node-resolve';
    import commonjs from 'rollup-plugin-commonjs';
    
    var path = require('path');
    var pkg = require('./package.json');
    var external = Object.keys(pkg.dependencies);
    
    ...
    
    export default {
      input: 'build/js/src/app.js',
      plugins: [
        resolve({
          jsnext: true,
          main: true
        }),
        commonjs({
          namedExports: {
            'node_modules/chroma-js/chroma.js': [ 'scale' ],
            'node_modules/signals/dist/signals.js': [ 'Signal' ],
            'node_modules/sprintf-js/src/sprintf.js': [ 'sprintf' ]
          }
        }),
        json(),
        buble()
      ],
      output: [
        {
          file: "build/js/app.dev.js",
          format: 'umd',
          name: 'App',
          sourcemap: true
        },
        {
          file: "build/js/app.esm.js",
          format: 'es',
          name: 'App',
          sourcemap: true
        }
      ],
      external: external
    };
    
    1 回复  |  直到 7 年前
        1
  •  1
  •   Matt McCutchen    7 年前

    尝试删除 external 来自的选项 rollup.config.js file-saver 模块应该从包中省略,因为它将在您的目标环境中可用;在浏览器中,情况并非如此。