使用方法

Question

我想在app目录中导出/导入本地文件：

我的index.html：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <script src="https://unpkg.com/babel-standalone@6.15.0/babel.min.js"></script>
</head>
<body>
<script type="text/babel" src="main.js"></script>
</body>
</html>

actions.js：

export const ADD_TODO = 'ADD_TODO'
export const TOGGLE_TODO = 'TOGGLE_TODO'
export const SET_VISIBILITY_FILTER = 'SET_VISIBILITY_FILTER'

main.js（从index.html加载）：

import {ADD_TODO, TOGGLE_TODO, SET_VISIBILITY_FILTER} from 'actions'

现在如果我使用没有babel的javascript，我会得到：

Uncaught SyntaxError: Unexpected token import

我使用 Chrome浏览器版本60 。这个版本不应该支持ES6吗？通过支持，我应该可以使用导出/导入？

我也尝试过babel（使用从index.html加载的独立babel）。

然后我收到此错误：

Uncaught ReferenceError: require is not defined
    at <anonymous>:4:16
    at n (https://unpkg.com/babel-standalone@6.15.0/babel.min.js:12:27049)
    at r (https://unpkg.com/babel-standalone@6.15.0/babel.min.js:12:27558)
    at e.src.i.(anonymous function).error (https://unpkg.com/babel-standalone@6.15.0/babel.min.js:12:27873)
    at XMLHttpRequest.i.onreadystatechange (https://unpkg.com/babel-standalone@6.15.0/babel.min.js:12:27316)

据我所知，require在客户端不存在，但不是ES6的导出/导入（不是NodeJS导出）语法吗？..

我是否需要诉诸webpack之类的东西来实现这一目标？

根据此回答：Trying ES6 imports with Chrome but it doesn't seem to work您需要在Chrome中启用Experimental Web Platform标记并使用<script type="module" src="main.js"></script>。但使用它，停止加载任何东西。似乎浏览器只是忽略了这种类型。即使这种方法有效，我想我也不能使用babel，因为它会使用不同的类型？

P.S。根据这个：http://2ality.com/2014/09/es6-modules-final.html#named-exports-several-per-module它应该工作..

Answer 1

Chrome已经实现了大部分es6新功能，但import / export尚未实现，更详细信息：https://ruanyf.github.io/es-checker/

如果您不想使用webpack编译文件，请尝试：

$ npm install --global babel-cli

然后：

babel example.js -o compiled.js

最后，您将获得将支持浏览器的已编译文件。

另外，关键字require/exports/module.exports是一个CommonJS规范，由Node.js支持。文件https://unpkg.com/babel-standalone@6.15.0/babel.min.js使用了CommonJS规范，因此它将在浏览器端报告错误

Answer 2

大约80％的用户浏览器（source）支持

#!/usr/local/bin/python import pymongo import json from pymongo import MongoClient # DB connect client = MongoClient('10.1.2.345') db = client.test collection = db.my_profiles # Read print collection.find_one({"account" : "foo", "profile" : "bar", "info.published" : True}, {"account":1, "profile":1,"settings.region":1}) / import语句，并将在以后的版本（see this SO question）中继续使用。

使用方法

在模块（myModule.js）中：

export

在index.html

const myVar = 'Hello !!';
export {
    myVar
}

This is a good article on how to use it

JS：在客户端（ES6或使用babel）启用导出/导入？

2 个答案:

使用方法