如何使Javascript的IMPORT EXPORT工作.我需要翻译机吗? [英] How to get Javascript's IMPORT EXPORT working. Do I need transpiler?
问题描述
我对此很困惑.我要做的只是将我的javascript分解成模块,然后将它们包含在某些页面中.有些页面可能需要我的user-module.js,有些页面可能不需要.
我已经Google搜索过,请阅读教程,但它仍然对我不起作用.
这是一个简单的测试用例:
1.包括我的HTML中的脚本
<script src="../js/login-view-model.js"></script>
现在,在里面...
2.尝试包含另一个模块/js文件
// LoginViewModel
// I NEED MY IMPORT HERE
import { userService } from '../js/viewModels/user-service.js'
var LoginViewModel = function () {
self = this;
userService.user.sayHello();
}; // End View Model
ko.applyBindings(new LoginViewModel());
现在,在我的user-service.js中
user-service.js
let user = {
sayHello: function() { alert("hello") };
}
export {user};
我看不到我想念的东西.
我是否需要使用另一个JS库来使此简单示例正常工作?我很迷路...大声笑,请帮忙!
哦,您可以看到我正在使用KnockoutJS.不确定是否是问题所在.
谢谢.
约翰
(实际上并没有很好的方法来展示如何在jsfiddle之类的方法中做到这一点,因此我为内联代码表示歉意)
这是您要尝试做的非常基本的示例(减去敲除部分)
这里的一个关键是您需要告诉浏览器您的脚本是一个模块( 查看模型 用户服务 I am so confused about this. All I want to do is simply break up my javascript into modules, and include them in certain pages. Some pages may need my user-module.js , some pages may not. I have Googled, read the tutorials, and it's still not working for me. Here is a simple test case: 1. Include my script from my html Now, inside there... 2. TRY to include another module/js file Now, inside my user-service.js user-service.js I don't see what I am missing. Do I need to use another JS library to get this simple example working? I am so lost...lol , please help! Oh, as you can see I am using KnockoutJS. Not sure if that is the problem. Thank you. John (There isn't really a good way to show how to do this in something like jsfiddle, so I appologize for the inline code) Here is a very basic example of what you're trying to do (minus the knockout part) One key here is that you need to tell the browser that your script is a module ( The other key fix to your problem is that you're trying to invoke You Working Example: HTML: View Model User Service
这篇关于如何使Javascript的IMPORT EXPORT工作.我需要翻译机吗?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!type="module"
)(请参阅import { user } from "./userservice.js";
user.sayHello();
let user = {
sayHello: function() { alert("hello"); }
};
export {user};
<script src="../js/login-view-model.js"></script>
// LoginViewModel
// I NEED MY IMPORT HERE
import { userService } from '../js/viewModels/user-service.js'
var LoginViewModel = function () {
self = this;
userService.user.sayHello();
}; // End View Model
ko.applyBindings(new LoginViewModel());
let user = {
sayHello: function() { alert("hello") };
}
export {user};
type="module"
) (see ES6 in the browser: Uncaught SyntaxError: Unexpected token import for some other issues you can run into when not defining type
as module
).sayHello()
in the wrong way. userService.user.sayHello(); // wrong
userService.sayHello(); // right
exported
user so you don't need to do .user
, there is no property of user
on your exported object. userService
is already user
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script src="loginviewmodel.js" type="module"></script>
</body>
</html>
import { user } from "./userservice.js";
user.sayHello();
let user = {
sayHello: function() { alert("hello"); }
};
export {user};