2017-09-12 13 views
0

私はジャンゴ、WebPACKのとVue.js.を使用しています簡単なプロジェクトを持っています私がロード時に静的なバンドルを構築すると、私のバンドルが正しくコンパイルされていないようです。私はJavaScriptコンソールでエラーが発生します。予期しないキーワード「インポート」

[Error] SyntaxError: Unexpected keyword 'import' 
    (anonymous function) (main-dd2bbbf09bf9a252a3c7.js:47) 

私は本当に簡単に私webpack.config.jsを維持しようとした:

{ 
    "presets": [ 
    ["env", { "modules": false }] 
    ] 
} 

メイン:

var path = require("path"); 
var webpack = require('webpack'); 
var BundleTracker = require('webpack-bundle-tracker'); 


module.exports = { 
    context: __dirname, 
    entry: './frontend/js/main', 
    output: { 
     path: path.resolve('./frontend/bundles/'), 
     filename: "[name]-[hash].js", 
    }, 

    plugins: [ 
    new BundleTracker({filename: './webpack-stats.json'}), 
    ], 

    resolve: { 
    extensions: ['', '.js', '.vue', '.json'], 
    }, 

    module: { 
    rules: [ 
     { 
     test: /\.vue$/, 
     loader: 'vue-loader', 
     options: { 
      loaders: { 
      } 
      // other vue-loader options go here 
     } 
     }, 
     { 
     test: /\.js$/, 
     loader: 'babel-loader', 
     exclude: /node_modules/ 
     }, 
     { 
     test: /\.(png|jpg|gif|svg)$/, 
     loader: 'file-loader', 
     options: { 
      name: '[name].[ext]?[hash]' 
     } 
     } 
    ], 
    }, 
} 

.babelrcは次のようになります。 js(最終的に爆発する)は単純です:

import Vue from 'vue' 
import App from './App.vue' 

new Vue({ 
    el: '#app', 
    render: h => h(App) 
}) 
+0

あなたはnode_modulesフォルダを削除して、もう一度 'NPMのinstall'を実行しようとしています。 –

+0

はい。役に立たない – mikebz

答えて

0

Webpackや関連ライブラリのバージョンが問題であることが判明しました。完全な溶液が行われ、ここに掲載されています。https://github.com/mikebz/djangovue

{ 
    "name": "djangovue", 
    "version": "0.0.0", 
    "description": "", 
    "main": "index.js", 
    "author": "Mike Borozdin", 
    "license": "MIT", 
    "scripts": { 
    "build": "cross-env NODE_ENV=prod webpack --progress --config webpack.config.js", 
    "watch": "cross-env NODE_ENV=dev webpack --progress --config webpack.config.js --watch" 
    }, 
    "devDependencies": { 
    "babel": "^6.23.0", 
    "babel-core": "^6.26.0", 
    "babel-loader": "^6.1.2", 
    "babel-preset-env": "^1.6.0", 
    "babel-preset-es2015": "^6.24.1", 
    "cross-env": "^5.0.5", 
    "css-loader": "^0.28.7", 
    "file-loader": "^0.11.2", 
    "node-libs-browser": "^0.5.0", 
    "vue-loader": "^12.2.2", 
    "vue-template-compiler": "^2.4.2", 
    "webpack": "^3.5.6", 
    "webpack-bundle-tracker": "0.0.5", 
    "webpack-dev-server": "^2.8" 
    }, 
    "dependencies": { 
    "vue": "^2.4.2" 
    } 
} 
関連する問題