[英]How do I include libphonenumber-js in my angular2 app using systemJS?
After installing https://github.com/halt-hammerzeit/libphonenumber-js using npm and updating my systemjs.config.ts to include使用 npm 安装https://github.com/halt-hammerzeit/libphonenumber-js并更新我的 systemjs.config.ts 以包含后
map:{
...
'libphonenumber-js': 'node_modules/libphonenumber-js'
},
packages: {
...
'libphonenumber-js': {
main: './custom.es6.js',
defaultExtension: 'js'
}
},
and attempting to use并试图使用
import { parse, format, asYouType } from 'libphonenumber-js';
in my @Directive, I'm stuck with在我的@Directive 中,我被困住了
Cannot find module 'libphonenumber-js'
找不到模块“libphonenumber-js”
How on earth am I supposed to wire this library into my app?我到底应该如何将这个库连接到我的应用程序中?
EDIT:编辑:
Directory layout:目录布局:
websiteName网站名称
websiteName/index.html网站名称/index.html
websiteName/node_modules网站名称/节点模块
websiteName/node_modules/libphonenumber-js网站名称/node_modules/libphonenumber-js
websiteName/app网站名称/应用程序
websiteName/app/systemjs.config.ts网站名称/应用程序/systemjs.config.ts
Index.html contains: Index.html 包含:
<script src="/app/systemjs.config.js"></script>
<script>
System.import('app').catch(function (err) { console.error(err); });
</script>
systemjs.config.ts contains: systemjs.config.ts 包含:
declare var System: any;
/**
* System configuration for Angular samples
* Adjust as necessary for your application needs.
*/
(function (global) {
System.config({
paths: {
// paths serve as alias
'npm:': 'node_modules/'
},
// map tells the System loader where to look for things
map: {
// our app is within the app folder
app: 'app',
// other references
'libphonenumber-js': 'npm:libphonenumber-js'
},
// packages tells the System loader how to load when no filename and/or no extension
packages: {
app: {
main: './main.js',
defaultExtension: 'js'
},
// other references
'libphonenumber-js': {
main: './bundle/libphonenumber-js.min.js',
defaultExtension: 'js'
}
}
});
})(this);
Your package configuration is incorrect.您的包配置不正确。 It needs to point at the source file for
libphonenumber-js
.它需要指向
libphonenumber-js
的源文件。 Need to update the references to match your project structure.需要更新引用以匹配您的项目结构。
Try this:尝试这个:
(function (global) {
System.config({
paths: {
// paths serve as alias
'npm:': './node_modules'
},
// map tells the System loader where to look for things
map: {
// our app is within the app folder
app: 'app',
// other references
'libphonenumber-js': 'npm:libphonenumber-js'
},
// packages tells the System loader how to load when no filename and/or no extension
packages: {
app: {
main: './main.js',
defaultExtension: 'js'
},
// other references
'libphonenumber-js': {
main: 'libphonenumber-js.min',
defaultExtension: 'js'
}
}
});
})(this);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.