关于前端的导入导出

关于Js文件的导入导出

总结: 一般常用还是

export default 和 import

require nodejs环境才用这个

1、框架直接 import 和 default 就能用是因为打包工具给她打包了

如果需要在全局引入，找到main.js

import 123 from "./路径/路径"; 如果有SRC '@/until/time.js'

Vue.prototype.$挂载名字 = 123;

使用的话就是 $挂载名字

2、 node用的是commonjs规范

3、 JS模块化，ESM模块

转自‘TVM’CSDN

1.首先说 exports 和 module.exports 1).exports是module.exports的一个引用,这两个是commonjs的规范,require是AMD规范引入格式;

2).如果要对外暴露属性或方法，就用 exports ，要暴露对象(类似class，包含了很多属性和方法)，就用 module.exports;

3).导出和引入 , exports 在此不再赘述,用的比较少,大家可自行搜索

modules.exports导出和 import requeire引入

modules.exports写法1 import是es6新引入的

modules.exports写法2 一般nodejs环境才用 require

贴张图，更好理解import和require

5、html 的 src 引入

这里有个重点，一定要写function

time.js 文件
function formatTime(seconds) {
        var hours = Math.floor(seconds / 3600);
        var minutes = Math.floor((seconds % 3600) / 60);
        var remainingSeconds = seconds % 60;

        var result = "";
        if (hours > 0) {
                result += hours + "小时";
        }
        if (minutes > 0) {
                result += minutes + "分钟";
        }
        if (remainingSeconds > 0) {
                result += remainingSeconds + "秒";
        }

        return result;
}
    let a11 = 222
    
html 文件
<script src="./js/time.js"></script>
或者 但不能 / 
<script src="js/time.js"></script>

var timeInSeconds = 61;
console.log('a11 :>> ', a11);
var formattedTime = formatTime(timeInSeconds);
console.log('formattedTime :>> ', formattedTime);

6、html的第二种导入导出 这里的重点，静态HTML遵循的ESM模块，src要写module

config.js
export default {
	origin:'https://www.baidu.com/',
	allPages: 4,
	tit:'12998',
                                这里就不用写function了
        formatTime(seconds) {
            var hours = Math.floor(seconds / 3600);
            var minutes = Math.floor((seconds % 3600) / 60);
            var remainingSeconds = seconds % 60;

            var result = "";
            if (hours > 0) {
                    result += hours + "小时";
            }
            if (minutes > 0) {
                    result += minutes + "分钟";
            }
            if (remainingSeconds > 0) {
                    result += remainingSeconds + "秒";
            }

            return result;
        }
};

html
  <script type="module">
     import * as all from '../config.js';
     import List from '../config.js';
     
     console.log('all :>> ', all);
     console.log('time.fo :>> ', time.formatTime(68));
</script>