标签: es6-modules

什么"...解析为非模块实体,不能使用此构造导入"是什么意思?

我有一些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()

无法调用类型缺少调用签名的表达式.

是什么赋予了?

typescript ecmascript-6 es6-modules

90
推荐指数
4
解决办法
3万
查看次数

ES2015"导入"在节点v6.0.0中不能与--harmony_modules选项一起使用

我正在使用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)

javascript node.js ecmascript-6 es6-modules

80
推荐指数
4
解决办法
7万
查看次数

浏览器中的ES6:Uncaught SyntaxError:意外的令牌导入

我是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)

为什么?

html javascript module ecmascript-6 es6-modules

74
推荐指数
4
解决办法
9万
查看次数

ES6模块导入给出"Uncaught SyntaxError:Unexpected identifier"

对于个人项目,我正在尝试使用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,因此根据不同的来源(包括谷歌的更新日志本身),即使没有标志,这也应该有效.

任何人都可以告诉我为什么这不起作用,我做错了什么?

html javascript ecmascript-6 es6-modules

59
推荐指数
1
解决办法
8万
查看次数

在ES 6模块中重新导出默认值

在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)

javascript ecmascript-6 babeljs es6-modules

52
推荐指数
4
解决办法
2万
查看次数

ES6解构和模块导入

我的印象是这种语法:

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.)

javascript destructuring ecmascript-6 es6-modules

51
推荐指数
2
解决办法
2万
查看次数

以HTML格式内联ECMAScript模块

我一直在尝试最近添加到浏览器中的新的原生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   …

html javascript ecmascript-6 es6-modules

46
推荐指数
3
解决办法
5499
查看次数

在 ES6 Node.js 中导入“.json”扩展会引发错误

我们正在尝试使用 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+ 检索此信息?

javascript node.js es6-modules

43
推荐指数
4
解决办法
2万
查看次数

Node_modules 中带有 ES 模块的 Jest Typescript 错误 - 必须使用 import 来加载 ES 模块:

我正在尝试为使用的第 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 …

node.js typescript jestjs es6-modules

41
推荐指数
3
解决办法
3万
查看次数

使用webpack输出ES模块

使用Rollup,只需将format选项设置为,即可输出ES模块'es'.我怎么能用webpack做同样的事情?如果现在不可能,webpack是否有计划添加它?

我在文档中output.libraryTarget找到的唯一提到ES模块的是:

libraryTarget: "commonjs-module"- 使用module.exports对象(output.library被忽略)公开它,__esModule被定义(它在互操作模式下作为ES2015模块线程化)

但是,这对我来说还不太清楚.是否libraryTarget: "commonjs2"__esModule定义的唯一差异相同?什么是"互操作模式"?

javascript ecmascript-6 webpack webpack-2 es6-modules

40
推荐指数
5
解决办法
2万
查看次数