在另一个构造函数中使用导入的类

问题描述：

ES6语法入门，为什么Main中的MesageTester.Create("bar");失败？在另一个构造函数中使用导入的类

，我有以下的的src/app.js（这也是进入的WebPack）：

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();

在另一个文件中，的src /助理/ MessageTester.js，我有这样的：

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

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

export {MessageTester};

正如在评论中指出，主要的外MessageTester.Create()作品，主要的构造函数运行。

如果它是相关的，这里是我的WebPack配置（作为aside-我不知道，如果源地图的正常工作......可能与该bug在这里，但不知道）：

// 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

答

Missing s

MessageTester.Create("bar");

大声笑...谢谢！有趣的是，我很确定它是在webpack配置中的东西，因为我几乎复制/粘贴，所以它让我怀疑自己;）非常感谢！ – davidkomer

在另一个构造函数中使用导入的类

相关推荐