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