如何让Javascript的导入导出正常工作。我需要转译器吗？
我对此感到很困惑。我所要做的就是简单地将我的javascript分解成模块，并将它们包含在特定的页面中。有些页面可能需要我的user-module.js，有些页面可能不需要。
我已经谷歌了，阅读了教程，但它仍然不适用于我。
下面是一个简单的测试用例：
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库来运行这个简单的示例吗？我太lost...lol了，请帮帮我！
哦，正如你所看到的，我正在使用KnockoutJS。不确定这是否是问题所在。
谢谢。
约翰
回答 2
Stack Overflow用户
发布于 2019-07-10 03:10:13
(在类似jsfiddle的代码中，没有一种很好的方式来展示如何做到这一点，所以我为内联代码道歉)
下面是你想要做的一个非常基本的例子(去掉击倒部分)
这里的一个关键是，您需要告诉浏览器您的脚本是一个模块(type="module") (有关不将type定义为module时可能遇到的其他一些问题，请参阅ES6 in the browser: Uncaught SyntaxError: Unexpected token import )。
解决问题的另一个关键问题是，您试图以错误的方式调用.sayHello()。
userService.user.sayHello(); // wrong
userService.sayHello(); // right您是exported用户，因此不需要执行.user，导出的对象上没有user属性。userService已经是user
工作示例：
HTML：
<!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};Stack Overflow用户
发布于 2019-07-10 02:54:36
例如，您需要一个像webpack这样的模块捆绑器来处理这个问题
将您的主文件作为条目，并根据您的导入生成一个single JavaScript文件。
一个简单的webpack配置示例。
var path = require('path');
module.exports = {
entry: './main.js',
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'output.bundle.js'
}
};https://stackoverflow.com/questions/56959001
复制相似问题