Vue.js遅延ロード

Question

。

https://vuejs.org/v2/guide/components.html#Async-Components

を、私はこのしようとすると：：

Vue.component('setting',() => import('./components/settings/setting.vue')); 

を私が手：

error in ./resources/assets/admin/vue/core.js 

Syntax Error: Unexpected token (36:31) 

    34 | */ 
    35 | 
> 36 | Vue.component('setting',() => import('./components/settings/setting.vue')); 
    |        ^

ここで間違っている可能性は何？今、私は私のコンポーネントは、ここでそれを見つけた遅延ロードしたいと思いますかコンポーネントを登録すると、「正常」なものがすべて動作していますか？コメントから次の

Answer 1

。 publicPathを指定する必要があります。 は、ここでは、おそらくあなたのmanifest.jsonを、間違ったパスを生成するため、WebPACKのは見つけることができないされていたlaravelミックスとlaravel 5.5上でテスト作業webpack.mix.jsファイル

const { mix } = require('laravel-mix'); 
mix.setPublicPath('public/'); 



mix.webpackConfig({ 
    output: { 
     chunkFilename: 'js/[name].[chunkhash].js', 
     publicPath: '/' 
    }, 
    module: { 
     rules: [{ 
      test: /\.js?$/, 
      exclude: /node_modules/, 
      loader: 'babel-loader', 
      options: { 
       presets: ['babel-preset-env'], 
       plugins:['babel-plugin-dynamic-import-webpack'] 
      } 
     }, 

    ] 
    } 
}); 


mix.js('resources/assets/js/app.js', 'public/js') 
.sass('resources/assets/sass/app.scss', 'public/css') 
.version(); 

の小型版です正しいチャンクファイルパス。だからあなたの解決策は、パスを変更するか、上の例のようにデフォルトのパスを使うだけです。 上記のコードは、パブリック/ JSのと同様に、チャンクファイル内のapp.jsを生成する必要があります。また、それは最終的にちょうどあなたのブレードに

<script src="{{mix('/js/app.js')}}"></script>をごapp.jsファイルを参照

今すぐ公開ディレクトリにあなたはバベルローダーとバベルダイナミックインポートプラグインは最初はインストールされている必要があり注意を をmanifest.jsonをを生成します私はlaravelミックスが.babelrcファイルを読み込むかどうかわからないんだけど、それがないならば、それは