Question

我正在使用https://github.com/sloria/cookiecutter-flask进行项目，并且我尝试将javascript函数添加到由webpack捆绑的js文件中并从html访问它。我想我错过了一些基本的东西。

背景源文件：

我将以下代码添加到plugins.js：

function foo () {
    console.log('bar')
}

尝试从html文档调用它来测试如下

<script type="text/javascript">
    foo();
</script>

我可以看到我的功能已捆绑，但我无法访问它。

这是我得到的错误：

我已经不得不将expose-loader添加到我的webpack.config.js中以使jquery按照this issue工作：

Answer 1

在我的经验中，当我使用Webpack时，我将代码捆绑到模块中，这些模块将它们封装到该模块的范围内。我希望在模块外部明确def write_time_series_to_wav(time_series, sampling_rate): file_prefix = 'generated_' file_names_list = [] i = 0 for series in time_series: file_name = file_prefix + str(i) + '.wav' librosa.output.write_wav(file_name, series, sampling_rate) file_names_list.append(file_name) i = i + 1 return file_names_list def stitch_wavs_together(file_names): wav_clips = [] clip_file_list = glob.glob('generated_*.wav') print (clip_file_list) for file in clip_file_list: print (file) clip = AudioSegment.from_wav(file) wav_clips.append(clip) whole_clip = wav_clips[0] for i in range(1, len(wav_clips)): whole_clip = whole_clip + wav_clips[i] whole_clip.export('whole_clip.wav', format='wav') def convert_spect_to_wav(file_name): spectrogram_array = np.load(file_name) print (spectrogram_array.shape) spectrogram_list = [] for spectrogram in spectrogram_array: #print (spectrogram.shape) spectrogram_list.append(spectrogram) #spectrogram_list = spectrogram_array.tolist() #print (spectrogram_list) # Convert spectrogram to time series time_series = convert_spect_to_time_series(spectrogram_list) # Write time series out to wav files file_names = write_time_series_to_wav(time_series, 22050) print (file_names) # Piece together the wav files stitch_wavs_together(file_names)，然后export或import将其放入我想要访问它的新范围内的代码。

听起来您希望可以在全局范围内访问某些代码，以便直接从您的标记访问它。要在浏览器中执行此操作，最好将其直接附加到require对象。可能首先检查以确保您不会覆盖已在该命名空间中的内容：

Window

那就是说，我建议你避免以这种方式发展 - 污染全局命名空间通常不是一个很好的模式，并导致很多潜在的冲突。如果必须以这种方式工作，至少将对象分配给附加到function foo() { console.log('bar!'); } if (!Window.foo) { Window.foo = foo; } else { console.warn('Foo is already assigned!'); }的命名空间，您可以在其中放置应用程序功能，而不会有与其他Window属性冲突的风险：< / p>

Window

Answer 2

我无法弄清楚如何让ES6语法在文件中工作，不断遇到此错误：

这是基于此related question的解决方法

未捕获的ReferenceError - 如何访问webpack捆绑的功能

2 个答案: