2017-06-02 63 views
0

我使用的是由Minko生成的angular-seed。也使用了@ymmetrik/angular2-leaflet。正常生產建立工作良好。運行npm run build.prod.rollup.aot時,它會失敗並顯示錯誤。'latLng'沒有通過'node_modules/leaflet/dist/leaflet-src.js'導出彙總構建失敗小冊子

dist/tmp/app/home/demo/leaflet-d3/ping/ping-demo.component.js (23:21) 'tile 
Layer' is not exported by 'node_modules/leaflet/dist/leaflet-src.js' 
dist/tmp/app/home/demo/leaflet-d3/ping/ping-demo.component.js (41:22) 'latL 
ng' is not exported by 'node_modules/leaflet/dist/leaflet-src.js' 
dist/tmp/app/home/demo/leaflet-d3/ping/ping-demo.component.js (68:31) 'circ 
le' is not exported by 'node_modules/leaflet/dist/leaflet-src.js' 
node_modules/@asymmetrik/angular2-leaflet/dist/leaflet/core/leaflet.directive.js (6:32) 
'latLng' is not exported by 'node_modules/leaflet/dist/leaflet-src.js' 
node_modules/@asymmetrik/angular2-leaflet/dist/leaflet/core/leaflet.directive.js (20:21) 
'map' is not exported by 'node_modules/leaflet/dist/leaflet-src.js' 
node_modules/@asymmetrik/angular2-leaflet/dist/leaflet/layers/control/leaflet-control-la 
yers.wrapper.js (13:31) 'control' is not exported by 'node_modules/leaflet/dist/leaflet- 
src.js' 

project.config.ts 彙總命名進口

this.ROLLUP_NAMED_EXPORTS = [ 
     ...this.ROLLUP_NAMED_EXPORTS, 
     {'node_modules/leaflet/dist/leaflet.js': [ 'leaflet' ]}, 

    ]; 

額外的軟件包,

let additionalPackages: ExtendPackages[] = [ 
     { 
     name: 'leaflet', 
     path: 'node_modules/leaflet/dist/leaflet.js' 
     }, 
     { 
     name: '@asymmetrik/angular2-leaflet', 
     path: 'node_modules/@asymmetrik/angular2-leaflet/dist/bundles/angular2-leaflet.js' 
     } 
    ]; 

彙總配置(build.bundles.app.rollup.aot.ts)

import Config from '../../config'; 
import { writeFile } from 'fs'; 
import { join } from 'path'; 

const nodeResolve = require('rollup-plugin-node-resolve'); 
const commonjs = require('rollup-plugin-commonjs'); 
const includePaths = require('rollup-plugin-includepaths'); 
const rollup = require('rollup'); 

const alias = require('rollup-plugin-alias'); 


const config = { 
    entry: join(Config.TMP_DIR, Config.BOOTSTRAP_FACTORY_PROD_MODULE), 
    sourceMap: true, 
    treeshake: true, 
    moduleName: 'main', 
    plugins: [ 
    includePaths({ 
     include: {}, 
     paths: [join(Config.TMP_DIR, 'app')], 
     external: [], 
     extensions: ['.js', '.json', '.html', '.ts'] 
    }), 
    alias({ 
      jszip: join(__dirname, '../../../node_modules/jszip/dist/jszip.min.js') 
     }), 
    nodeResolve({ 
     jsnext: true, main: true, module: true 
    }), 
    commonjs({ //See project.config.ts to extend 
     include: Config.ROLLUP_INCLUDE_DIR, 
     namedExports: Config.getRollupNamedExports() 
    }) 
    ] 
}; 
export = (done: any) => { 
    rollup.rollup(config) 
    .then((bundle: any) => { 
     const result = bundle.generate({ 
     format: 'iife' 
     }); 
     const path = join(Config.TMP_DIR, 'bundle.js'); 
     writeFile(path, result.code, (error: any) => { 
     if (error) { 
      console.error(error); 
      process.exit(0); 
     } 
     done(); 
     }); 
    }) 
    .catch((error: any) => { 
     console.error(error); 
     process.exit(0); 
    }); 
}; 
+0

Leaflet'master'版本現在也使用Rollup,因此您可以嘗試一下。入口文件是'src/Leaflet.js' IIRC。它應該儘快發佈,版本爲'1.1'。 – ghybs

+0

感謝您的快速響應。我會檢查它。我的現有彙總是否存在任何配置問題? @ghybs –

+0

不工作仍然有同樣的問題。@ ghybs –

回答

1

問題wa當我運行npm run build.prod.rollup.aot時,上述錯誤開始出現。但是我解決了這個問題。問題出在命名導出上。 leaflet-src.js沒有導出所需的模塊。因此我在project.config.ts中添加了名爲exports的缺少的東西。

this.ROLLUP_NAMED_EXPORTS = [ 
     ...this.ROLLUP_NAMED_EXPORTS, 
     {'node_modules/leaflet/dist/leaflet.js': [ 'leaflet' ]}, 
     {'node_modules/leaflet/dist/leaflet-src.js': [ 'latLng', 'map','control' ]}, 

    ]; 

現在它按預期工作。