2017-04-14 6 views
0

ES6構文を使い始める前に、メインのMesageTester.Create("bar");が失敗するのはなぜですか?別のコンストラクタでインポートされたクラスを使用する

I持ってSRCで次/ app.js(もWebPACKのエントリです):、のsrc /ヘルパー/ MessageTester.js別のファイルで

import {MessageTester} from './helpers/MessageTester'; 

class Main { 
    constructor() { 
     //does run 
     console.log("trying.."); 

     //causes crash "Uncaught ReferenceError: MesageTester is not defined" 
     MesageTester.Create("bar"); 
    } 
} 

//is fine 
MessageTester.Create("foo"); 

//for testing 
new Main(); 

、私はこれを持っています:

class MessageTester { 
    constructor(msg) { 
     document.querySelector('#root').innerHTML = `<p>` + msg + `</p>`; 
    } 

    static Create(msg) { 
     return new MessageTester(msg); 
    } 
} 

export {MessageTester}; 
コメントで述べたように

、メインの外MessageTester.Create()作品、そしてメインのコンストラクタが実行されています。

場合、それはここに私のWebPACKの設定が(aside-として、私は、ソースマップが正常に動作している場合は...ここではなく、必ずバグに関係している可能性があるかわからない)ですが、関連するのです:

// webpack.config.js 
const webpack = require('webpack') 
const path = require('path') 
const HtmlWebpackPlugin = require('html-webpack-plugin'); 
const CopyWebpackPlugin = require('copy-webpack-plugin'); 

const config = { 
    context: path.resolve(__dirname, 'src'), 
    entry: { 
     jistudio: './app.js' 
    }, 
    output: { 
     path: path.resolve(__dirname, 'dist'), 
     filename: '[name].bundle.js', 
     sourceMapFilename: '[name].map', 
     chunkFilename: '[id].chunk.js' 
    }, 
    module: { 
     rules: [{ 
      test: /\.js$/, 
      include: path.resolve(__dirname, 'src'), 
      use: [{ 
       loader: 'babel-loader', 
       options: { 
        presets: [ 
         ['es2015', {modules: false}] 
        ] 
       } 
      }] 
     }] 
    }, 
    devtool: 'eval-source-map', 
    plugins: [ 
     new HtmlWebpackPlugin({ 
      template: './index.html', 
      chunksSortMode: 'dependency' 
     }), 
     new CopyWebpackPlugin([ 
      { 
       from: path.resolve(__dirname, 'assets'), 
      } 
     ]), 
     new webpack.optimize.UglifyJsPlugin({sourceMap: true}) 
    ], 
    devServer: { 
     contentBase: path.join(__dirname, "dist"), 
     compress: true, 
     port: 3000 
    } 
} 

module.exports = config 

答えて

0

欠けているs

MessageTester.Create("bar"); 
+0

lol ...ありがとう!私はかなりコピー/貼り付けているので、私はそれがウェブパックの設定の何かだったので、私は自分自身に疑問を抱いていたので、どのように私は本当に面白かったか面白い) 非常に感謝! – davidkomer

関連する問題