我有一些TypeScript文件:
MyClass.ts
class MyClass {
constructor() {
}
}
export = MyClass;
Run Code Online (Sandbox Code Playgroud)
MyFunc.ts
function fn() { return 0; }
export = fn;
Run Code Online (Sandbox Code Playgroud)
MyConsumer.ts
import * as MC from './MyClass';
import * as fn from './MyFunc';
fn();
Run Code Online (Sandbox Code Playgroud)
这使我在尝试使用时出错 new
模块"MyClass"解析为非模块实体,无法使用此构造导入.
和试图打电话时 fn()
无法调用类型缺少调用签名的表达式.
是什么赋予了?
我正在使用node v6.0.0并想使用ES2016(ES6).但是我意识到"导入"语法不起作用.在ES2015中编写模块化代码不是"导入"的基础吗?我尝试使用--harmony_modules选项运行节点,但仍然有关于"导入"的相同错误.这是代码.
没有"导入"的工作代码:
'use strict';
let sum = 0;
class Number {
addNumber(num1, num2) {
return num1 + num2;
}
}
let numberObj = new Number();
sum = numberObj.addNumber(1,2);
console.log("sum of two number 1 and 2 "+ sum);
Run Code Online (Sandbox Code Playgroud)
使用"import"操作代码:
server.js
'use strict';
import Number from "./Number";
let sum = 0;
let numberObj = new Number();
sum = numberObj.addNumber(1,2);
console.log("sum of two number 1 and 2 "+ sum);
Run Code Online (Sandbox Code Playgroud)
Number.js
'use strict';
export default class Number {
addNumber(num1, num2) { …Run Code Online (Sandbox Code Playgroud) 我是ES6的新手(ECMAScript 6),我想在浏览器中使用它的模块系统.我读过ES6受Firefox和Chrome支持,但我收到以下错误export
Uncaught SyntaxError: Unexpected token import
我有一个test.html文件
<html>
<script src="test.js"></script>
<body>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
和一个test.js文件
'use strict';
class Test {
static hello() {
console.log("hello world");
}
}
export Test;
Run Code Online (Sandbox Code Playgroud)
为什么?
对于个人项目,我正在尝试使用ES6导入来编写更清晰的代码.作为第一次测试,我正在编写一个应该生成菜单的对象.当我直接加载类时,整个代码正在工作,但是当在ES6中使用导入和导出时,它会import在行中产生"未捕获的SyntaxError:Unexpected identifier"错误main.js
我有以下文件:
资产/ JS/menu.module.js
'use strict';
export default class Menu
{ ... }
Run Code Online (Sandbox Code Playgroud)
资产/ JS/main.js
import Menu from "./menu.module.js";
window.addEventListener('DOMContentLoaded', () => {
const menu = new Menu();
});
Run Code Online (Sandbox Code Playgroud)
的index.html
<script type="module" src="assets/js/menu.module.js"></script>
<script src="assets/js/main.js">
Run Code Online (Sandbox Code Playgroud)
请注意,这些只是相关的代码行.
使用<script type="module">或不使用线似乎对我没有任何影响.我确实启用了实验和ES6模块的chrome标志,因为没有它我收到一个关于import没有定义的错误.
Chrome版本为62,因此根据不同的来源(包括谷歌的更新日志本身),即使没有标志,这也应该有效.
任何人都可以告诉我为什么这不起作用,我做错了什么?
在ES6中,是否可以缩短以下代码.我有一个App.js文件和一个index.js.
index.js
import App from './App';
export default App;
Run Code Online (Sandbox Code Playgroud)
像这样的东西
index.js
export default App from './App.js'
Run Code Online (Sandbox Code Playgroud) 我的印象是这种语法:
import Router from 'react-router';
var {Link} = Router;
Run Code Online (Sandbox Code Playgroud)
具有与此相同的最终结果:
import {Link} from 'react-router';
Run Code Online (Sandbox Code Playgroud)
有人可以解释一下有什么区别吗?
(我原本以为这是一个React Router Bug.)
我一直在尝试最近添加到浏览器中的新的原生ECMAScript模块支持.最终能够直接从JavaScript轻松导入脚本是令人愉快的.
/example.html
<script type="module">
import {example} from '/example.js';
example();
</script>
Run Code Online (Sandbox Code Playgroud)
/example.js
export function example() {
document.body.appendChild(document.createTextNode("hello"));
};
Run Code Online (Sandbox Code Playgroud)
但是,这只允许我导入由单独的外部 JavaScript文件定义的模块.我通常更喜欢内联用于初始渲染的一些脚本,因此它们的请求不会阻止页面的其余部分.使用传统的非正式结构库,可能如下所示:
/inline-traditional.html
<body>
<script>
var example = {};
example.example = function() {
document.body.appendChild(document.createTextNode("hello"));
};
</script>
<script>
example.example();
</script>
Run Code Online (Sandbox Code Playgroud)
但是,天真地内联模块文件显然不起作用,因为它会删除用于将模块标识到其他模块的文件名.HTTP/2服务器推送可能是处理这种情况的规范方式,但它仍然不是所有环境中的选项.
是否可以使用ECMAScript模块执行等效转换?有没有办法<script type="module">在同一文档中导入另一个模块导出的模块?
我想这可以通过允许脚本指定文件路径,并且表现得好像它已经从路径下载或推送一样.
/inline-name.html
<script type="module" name="/example.js">
export function example() {
document.body.appendChild(document.createTextNode("hello"));
};
</script>
<script type="module">
import {example} from '/example.js';
example();
</script>
Run Code Online (Sandbox Code Playgroud)
或者可能通过完全不同的参考方案,例如用于本地SVG refs:
/inline-id.html … 我们正在尝试使用 Node.js 为 ES6 导出和导入模块的新方法。从package.json文件中获取版本号对我们来说很重要。下面的代码应该这样做:
import {name, version} from '../../package.json'
Run Code Online (Sandbox Code Playgroud)
但是,在执行时抛出以下错误:^
TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".json" for T:\ICP\package.json imported from T:\ICP\src\controllers\about.js
Run Code Online (Sandbox Code Playgroud)
有什么我们遗漏的吗?不支持
扩展.json吗?
有没有其他方法可以使用 Node.js 13+ 检索此信息?
我正在尝试为使用的第 3 方包编写一个简单的玩笑测试,该包仅导出 ES 模块。它是服务器的包装器http。
这是我设置的测试存储库(只需运行yarn && yarn jest即可重现):https://github.com/jamesopti/hocuspocus-testing
无论我尝试什么配置,在尝试运行它时仍然会收到此错误:
Must use import to load ES Module: /Users/j/hocuspocus-testing/node_modules/@hocuspocus/server/dist/hocuspocus-server.esm.js
> 1 | import { Server, Hocuspocus } from '@hocuspocus/server'
| ^
2 | import * as request from 'supertest'
3 |
4 | describe('Server (e2e)', () => {
Run Code Online (Sandbox Code Playgroud)
我已经尝试过的事情:
ES 模块上的 Jest 说明:https ://jestjs.io/docs/ecmascript-modules
在 Jest 配置中使用transformIgnorePatterns
transformIgnorePatterns: ['node_modules/(?!@hocuspocus/)']使用 Babel 通过babel-jest
将 Jest 配置中的转换设置修改为 '^.+\.jsx?$': 'babel-jest', '^.+\.tsx?$': 'ts-jest'
遇到错误You appear to …
使用Rollup,只需将format选项设置为,即可输出ES模块'es'.我怎么能用webpack做同样的事情?如果现在不可能,webpack是否有计划添加它?
我在文档中output.libraryTarget找到的唯一提到ES模块的是:
libraryTarget: "commonjs-module"- 使用module.exports对象(output.library被忽略)公开它,__esModule被定义(它在互操作模式下作为ES2015模块线程化)
但是,这对我来说还不太清楚.是否libraryTarget: "commonjs2"与__esModule定义的唯一差异相同?什么是"互操作模式"?
es6-modules ×10
ecmascript-6 ×8
javascript ×8
html ×3
node.js ×3
typescript ×2
babeljs ×1
jestjs ×1
module ×1
webpack ×1
webpack-2 ×1