การเรียงลำดับการนำเข้าโมดูล js และดำเนินการปัญหา

คำสั่งการนำเข้าจะถูกยกขึ้นไปที่ด้านบนสุดของโมดูลเสมอ โมดูลที่ประกอบด้วย

// some non-import code
import foo from 'foo';
// some more non-import code 2
import bar from 'bar';
// some more non-import code 3

จะทำงานเหมือนกับว่าการนำเข้าทั้งหมดอยู่ที่ด้านบนสุด:

import foo from 'foo';
import bar from 'bar';

// some non-import code
// some more non-import code 2
// some more non-import code 3

สำหรับสิ่งที่ดูเหมือนคุณต้องการทำ คุณสามารถให้ B มีเมธอด init หรือบางอย่างที่คุณเรียกเพื่อให้มันทำสิ่งต่างๆ ได้:

import B from '@/app/fileB'
console.log('file A test')
B.init();

ตัวเลือกอื่นที่ฉันชอบคือการนำเข้าและส่งออก ฟังก์ชัน เสมอ คุณสามารถมีโมดูล makeB แทนที่จะเป็น B แล้วเรียกมันใน A:

// b
export const makeB = () => {
  const b = {};
  console.log('creating B now');
  // other stuff
  return b;
};

// a
import { makeB } from './makeB';
console.log('file A test');
const b = makeB();
// do stuff with b