uniappにjsファイルを導入する方法

Uniapp が成長と開発を続けるにつれて、クロスプラットフォーム アプリケーションの開発に Uniapp を使用する開発者が増えています。開発プロセス中に、自分で作成した js ファイルを導入する必要がある場合があります。この記事ではUniappを使ったjsファイルの導入方法を紹介します。

1. ページに js ファイルを導入します

1. ページ ディレクトリで js ファイルを導入する必要があるページを見つけます (例:index.vue)
2. このページでは script タグ内で、次のコードを使用して js ファイルを導入します。

import xxx from '@/xxx.js' 

このうち、「@」記号はプロジェクトのルート ディレクトリを表し、xxx は js ファイルの名前を表します。自分で書いたファイル。ファイルがルート ディレクトリにない場合は、インポート パスを変更する必要があります。

3. コード内で js ファイルのメソッドまたは変数を使用します。例:

xxx.doSomething();

2. js ファイルをコンポーネントに導入します

1. js ファイルを導入する必要があるコンポーネント ファイルを見つけます (例: my-component.vue)
2. コンポーネントの script タグで、次のコードを使用して js ファイルを導入します。

import xxx from '@/xxx.js' 

同様に、「@」記号はプロジェクトのルートディレクトリを表し、xxxは自分で作成したjsファイルの名前を表します。ファイルがルート ディレクトリにない場合は、インポート パスを変更する必要があります。

3. js ファイルのメソッドまたは変数をコンポーネント コードで使用します (例:

mounted() {
  xxx.doSomething();
}

3. js ファイルをグローバルに導入します

#) ##プロジェクトのルート ディレクトリで、vue.config.js ファイルを見つけます。
1. 次のコードをファイルに追加します。

2. configureWebpack: {
     externals: {
       'xxx': 'xxx'
     },
     resolve: {
       alias: {
         '@': path.resolve(__dirname, './src')
       }
     }
   }

その中に、「xxx」: 'xxx'インポートされた JS ファイルの名前の最初の 'xxx' はプロジェクト内のファイルの名前で、2 番目の 'xxx' はグローバルワールドの名前です。'@' 記号はプロジェクトのルートも表しますディレクトリ。

js ファイルを使用する必要がある場合は、次のコードを使用してそれを導入します:

3. window.xxx.doSomething();

IV. 概要

上記の 3 つの方法を通じて、独自の js ファイルを Uniapp に導入し、ページ、コンポーネント、またはグローバルで使用できます。 js ファイルを記述するときは、導入の失敗やコードの混乱を避けるために、名前とパスの仕様に注意する必要があります。

以上がuniappにjsファイルを導入する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。