Vue.jsに外部Javascriptファイルをロードする

Question

webpackでVueJsを使用してプロジェクト内の資産フォルダにあるjav3ファイルmymain.min.jsをインクルードして初期化するにはどうすればよいですか？

Webpack.base.conf

resolve: { 
    extensions: ['.js', '.vue', '.json'], 
    alias: { 
     'vue$': 'vue/dist/vue.esm.js', 
     '@': resolve('src'), 
     'sauJs': path.resolve(__dirname, '../src/assets/mymain.min.js'), 
    } 
    }, 

また、私はあなたが実際に何を決意誤解されているCannot GET /src/assets/mymain.min.js

Answer 1

を取得しかし、私のindex.htmlページへ<script src="src/assets/mymain.min.js"></script>を追加しようとしています。これは実際に一緒にバンドルするJavaScriptコードを置く場所ではありません。それはあなたが使用している場合ということになります

'@': resolve('src'), 

：あなたがそうのような解決の別名を指定

require('@/test') 

それが解決されます：

require('src/test') 

この親戚のパスをどこにでも置かないようにするのに役立ちます。また、長いパスを入力すると、すべてのタイプの裾。

ウェブパックファイルには、uncompiled JavaScriptファイルを指定するentryプロパティが必要です。あなたがあなたのバンドルに含めるのJavaScriptファイルをインポートすることができ、あなたのmain.jsファイルで

module.exports = { 
    entry: './example/main.js', 
} 

。

main.js

import Vue from 'vue'; 
// Or: 
const vue = require('vue') 
// Or(.js extension can be omitted): 
import MyFile from './src/MyFile.js' 

他のアプローチは、別のentryプロパティを指定することで、何かが私は個人的に行っていません。

これは、この回答の範囲外の方法です。あなたはより多くの情報が必要な場合は、ドキュメントをチェックアウトする必要があります：

https://webpack.js.org/concepts/

あなたが複雑に対処したくない場合は代わりに、これはあなたの人生を容易にすることができます：

https://symfony.com/blog/introducing-webpack-encore-for-asset-management

か：

https://github.com/JeffreyWay/laravel-mix