需要满足以下三个条件:

1、高版本的Chrome ,总而言之越新越好……,其他浏览器请参考:https://caniuse.com/#search=import

2、必须在服务器环境下才能运行,譬如apache或者nginx,或者大部分语言都能开启的服务环境(我这里用phpstudy的Nginx环境来测试)

3、需要在 script 中加入 type = 'module'

index.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div id="app"></div>
</body>
<script type='module'>
import test from './test.js'
console.log(20181221204836, test) // {a: 123 }
</script>
</html>

test.js

export default {
a: 123
}

效果图如下:

活久见: 原来 Chrome 浏览器支持 Import from 语法的更多相关文章

  1. 活久见: maven pom 竟然都会崩溃!

    问题是: 我的应用的pom 并没有任何报错,但是代码报错,而且编译不通过. 如下,我本地项目,从 spring-cloud-alibaba-dependencies 0.2.1.RELEASE 升级到 ...

  2. 活久见!TCP两次挥手,你见过吗?那四次握手呢?

    活久见!TCP两次挥手,你见过吗?那四次握手呢? 文章持续更新,可以微信搜一搜「小白debug」第一时间阅读,回复[教程]获golang免费视频教程.本文已经收录在GitHub https://git ...

  3. [程序人生]那些IT界“活久见”的奇葩现象

    常言道,人活久了什么稀奇古怪的事都会见到.本文盘点几件刚毕业工作时想当然,工作若干年后啪啪打脸的“奇葩”事. (1)去年推荐一朋友来我们公司面试时,朋友说起当年她去某游戏公司时,那公司HR说这家公司是 ...

  4. 使用node.js+babel,支持import/export语法

    如果要在node里面支持import/export default语法步骤: 1.使用npm安装 babel的客户端工具 npm init 会生成package.json文件 2.接着安装bebel客 ...

  5. Chrome浏览器支持跨域访问

    创建一个chrome的快捷方式,并加上参数 --allow-file-access-from-files --disable-web-security --user-data-dir="D: ...

  6. 活久见!Linux命令行居然也可以用来查看图像?

    在 Linux 中有很多 GUI 应用程序可以查看图像,但是这对经常使用命令行来工作的人可能会觉得很繁琐.今天要介绍的是 3 个实用的 CLI 图像查看器来在终端上查看图像,让那些使用 CLI 的朋友 ...

  7. [转载]为什么有些MP4文件在Chrome浏览器上播放不了?

    http://blog.sina.com.cn/s/blog_6bb7ebcc0101c2ja.html Chrome浏览器支持HTML5,它支持原生播放部分的MP4格式(不用通过Flash等插件). ...

  8. Chrome浏览器扩展开发系列之十六:扩展中可用的Chrome浏览器API

    除了Chrome浏览器支持的chrome.* API之外,Chrome浏览器扩展还可以使用Chrome浏览器为Web页面或Chrome app提供的APIs.对于Chrome浏览器2支持的API,还可 ...

  9. Android 用Chrome浏览器打开url 自定义样式

    1.效果预览 1.1.真实效果就是从某一个APP,打开一个url,跳转到谷歌浏览器,返回之后,又回到之前的APP      1.2.说明一下条件 1.手机上必须要安装谷歌浏览器 2.手机上的默认浏览器 ...

随机推荐

  1. 微软BI 之SSRS 系列 - 报表中分组聚合中处理不规则层次结构的技巧(没有子元素的时候不展开, 删除+符号)

    分组聚合的展开和收起效果在SSRS Report中非常常用,并且有时还要处理一些比较特别的情况.比如分组合并时有的层次结构是不规则的,有的组有两层,遇到这种情况应该如何处理?   注意到下面的这个需求 ...

  2. Tim’s iT Blog

    vSphere 5.1 Lab – Nested ESXi 5.1x http://tsmith.co/2012/vsphere-5-1-lab-nested-esxi-5-1/ vSphere 5. ...

  3. infobright系列一:源码安装infobright

    1:下载infobright http://www.infobright.org/downloads/ice/infobright-4.0.7-0-src-ice.tar.gz 2:查看环境 rpm ...

  4. E437: terminal capability "cm" required 错误出现的原因和解决方法

    E437: terminal capability "cm" required 错误: 出现这个问题原因是没有配置export TERM=xterm 执行:export TERM= ...

  5. iOS UI01_Label

    @implementation AppDelegate -(void)dealloc { [_window release]; [superdealloc]; } - (BOOL)applicatio ...

  6. 【AIX】查看当前目录下文件与文件夹大小

    使用命令: du –sg ./*    #以G为单位 du –sm ./*    #以M为单位 du –sk ./*    #以k为单位

  7. Axure JS弹窗提示部件

    百度网盘:http://pan.baidu.com/s/1c1ZjUPq

  8. Linux(centos6.5)下安装jenkins

    Jenkins 的前身是 Hudson 是一个可扩展的持续集成引擎. 通俗的来讲,jenkins就是一个可以实现自动化部署的一个插件, 对于我来说,也是应用在系统部署上. 废话不多说,直接进入我们的安 ...

  9. 创建在“system.net/defaultProxy”配置节中指定的Web代理时出错解决办法。

    出现这种问题会有很多原因,大致解决方法 方法1:在CMD下输入netsh winsock reset命令 简单来说netsh winsock reset命令含义是重置 Winsock 目录.如果一台机 ...

  10. 【Oracle】Oracle中复合数据类型

    1,常见的操作数据库的技术有那些 jdbc     使用java 访问数据库的技术    PLSQL  (procedure  过程化sql) 在数据库内部操作数据的技术    proc/c++    ...