zoukankan      html  css  js  c++  java
  • node 支持esmodule

    方法一 在 package.json 内指定 type 字段为 module

    该"type"字段定义Node.js用于所有 .js 以该 package.json 文件为最接近父文件的文件的模块格式 。
    .js 当最近的父 package.json 文件包含 "type" 值为的顶级字段时,以 结尾的文件将作为ES模块加载 "module"

      "type": "module",
    

    方式二 修改文件后缀为mjs

    注意mjs和commonjs尽量不能混用
    index.mjs

    import obj from "./module.mjs";
    console.log(obj);
    
    

    module.mjs

    export default {
      a: 1,
    };
    
    

    执行

    node index.mjs
    

    结果:

    方法三 使用webpack编译

    1安装webpack和webpack-cli

    npm install webpack webpack-cli --save-dev
    

    2.安装babel

    npm install --save-dev babel-loader @babel/core
    npm install @babel/preset-env --save-dev
    

    3.新建webpack.config.js

    const path = require("path");
    module.exports = {
      //配置模式
      mode: "development",
      //配置入口文件
      entry: "./index.js",
      //输出文件
      output: {
        path: path.join(__dirname, "/dist"),
        filename: "test.js",
      },
      module: {
        rules: [
          //使用babel编译js
          {
            test: /.m?js$/,
            exclude: /node_modules/,
            use: {
              loader: "babel-loader",
            },
          },
        ],
      },
    };
    
    

    4.新建babel.config.json文件

    {
      "presets": ["@babel/preset-env"]
    }
    
    

    5.执行编译后的 test.js

    node test.js
    

    6.结果:

  • 相关阅读:
    Vue日期转化
    javascript数组去重
    javascript数组及类数组详解
    javascript的argument和克隆方法详解
    javascript中对this的理解
    javascript命名空间及对象枚举的理解
    javascript继承模式详解
    javascript的call和apply区别
    javascript原型及原型链详解
    javascript对象及包装类
  • 原文地址:https://www.cnblogs.com/heihei-haha/p/14685403.html
Copyright © 2011-2022 走看看