zoukankan      html  css  js  c++  java
  • 非vue等框架中html 中使用es6的模块用法小结

    以下是html中使用es6模块化引入的方法

    一、html中的引入

    <!DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>Document</title>
    </head>
    
    <body>
        <div>1212</div>
        <script type="module">
            import {add as newadd} from './b.js'
            let res = newadd(2,3)
            console.log(res)
        </script>
    </body>
    
    </html>

    注意:要加上 type="module"  !!!并且配置好本地服务器访问html 。

    如果是npm 下载后的包(node_modules),则貌似无法直接通过import ‘引入’ ,需要webpack的配置??

    二、js文件中的写法:

    function add(a, b) {
        return a + b + 2;
    }
    export { add };

    注意:建议js的导出利用export 的导出,而非export default 的导出!

  • 相关阅读:
    html5图片异步上传/ 表单提交相关
    node 常用命令
    windows下 nvm下载node被墙了解决办法
    36.迷宫(广度优先搜索)
    36.迷宫(广度优先搜索)
    35.大质数
    35.大质数
    35.大质数
    35.大质数
    35.大质数
  • 原文地址:https://www.cnblogs.com/teamemory/p/12021056.html
Copyright © 2011-2022 走看看