我需要在4个文件上禁用AMD并在加载其他3个文件之前先加载video.js ,因为它们依赖于它。 当我尝试在webpack.config.js中这样做时:
const path = require('path') const webpack = require('webpack') module.exports = { entry: './src/main.js', output: { path: __dirname + '/public', filename: 'bundle.js' }, devServer: { inline: true, contentBase: './src', port: 3333 }, plugins: [ new webpack.DefinePlugin({ 'process.env': { 'NODE_ENV': JSON.stringify('production') } }) ], module: { loaders: [ { test: /\.js$/, exclude: /node_modules|lib/, loader: 'babel', query: { presets: ['es2015', 'react', 'stage-2'], plugins: ['transform-class-properties'] } }, { test: /\.json$/, loader: 'json-loader' }, { test: /[\/\\]lib[\/\\](video|playlist|vpaid|overlay)\.js$/, exclude: /node_modules|src/ loader: 'imports?define=>false' } ] } }它并没有真正起作用,因为它只加载video.js (禁用AMD)并完全忽略其他3个文件。
我的文件夹结构是这样的:
▾ lib/ overlay.js playlist.js video.js vpaid.js ▸ node_modules/ ▾ public/ 200.html bundle.js ▾ src/ App.js index.html main.js LICENSE package.json README.md webpack.config.js现在,我找到了一些让我退后一步的东西,因为现在连video.js都没有加载:
require('imports?define=>false!../lib/video.js') require('imports?define=>false!../lib/playlist.js') require('imports?define=>false!../lib/vpaid.js') require('imports?define=>false!../lib/overlay.js')而只是抛出这些警告:
WARNING in ./~/imports-loader?define=>false!./lib/video.js Critical dependencies: 15:415-422 This seems to be a pre-built javascript file. Though this is possible, it's not recommended. Try to require the original source to get better results. @ ./~/imports-loader?define=>false!./lib/video.js 15:415-422 WARNING in ./~/imports-loader?define=>false!./lib/playlist.js Critical dependencies: 10:417-424 This seems to be a pre-built javascript file. Though this is possible, it's not recommended. Try to require the original source to get better results. @ ./~/imports-loader?define=>false!./lib/playlist.js 10:417-424 WARNING in ./~/imports-loader?define=>false!./lib/vpaid.js Critical dependencies: 4:113-120 This seems to be a pre-built javascript file. Though this is possible, it's not recommended. Try to require the original source to get better results. @ ./~/imports-loader?define=>false!./lib/vpaid.js 4:113-120 WARNING in ./~/imports-loader?define=>false!./lib/overlay.js Critical dependencies: 10:416-423 This seems to be a pre-built javascript file. Though this is possible, it's not recommended. Try to require the original source to get better results. @ ./~/imports-loader?define=>false!./lib/overlay.js 10:416-423所以,我的问题是,我怎样才能在webpack.config.js这项工作,以便我不会收到这些警告?
I need to disable AMD on 4 files and load video.js first before loading the other 3 files, because they depend on it. When I tried doing it in webpack.config.js like so:
const path = require('path') const webpack = require('webpack') module.exports = { entry: './src/main.js', output: { path: __dirname + '/public', filename: 'bundle.js' }, devServer: { inline: true, contentBase: './src', port: 3333 }, plugins: [ new webpack.DefinePlugin({ 'process.env': { 'NODE_ENV': JSON.stringify('production') } }) ], module: { loaders: [ { test: /\.js$/, exclude: /node_modules|lib/, loader: 'babel', query: { presets: ['es2015', 'react', 'stage-2'], plugins: ['transform-class-properties'] } }, { test: /\.json$/, loader: 'json-loader' }, { test: /[\/\\]lib[\/\\](video|playlist|vpaid|overlay)\.js$/, exclude: /node_modules|src/ loader: 'imports?define=>false' } ] } }It doesn't really work, because it just loads video.js (with disabled AMD) and completely ignores the other 3 files.
My folder structure is like so:
▾ lib/ overlay.js playlist.js video.js vpaid.js ▸ node_modules/ ▾ public/ 200.html bundle.js ▾ src/ App.js index.html main.js LICENSE package.json README.md webpack.config.jsNow, I found something that takes me 1 step back, because now even video.js doesn't load:
require('imports?define=>false!../lib/video.js') require('imports?define=>false!../lib/playlist.js') require('imports?define=>false!../lib/vpaid.js') require('imports?define=>false!../lib/overlay.js')and instead just throws these kinds of warnings:
WARNING in ./~/imports-loader?define=>false!./lib/video.js Critical dependencies: 15:415-422 This seems to be a pre-built javascript file. Though this is possible, it's not recommended. Try to require the original source to get better results. @ ./~/imports-loader?define=>false!./lib/video.js 15:415-422 WARNING in ./~/imports-loader?define=>false!./lib/playlist.js Critical dependencies: 10:417-424 This seems to be a pre-built javascript file. Though this is possible, it's not recommended. Try to require the original source to get better results. @ ./~/imports-loader?define=>false!./lib/playlist.js 10:417-424 WARNING in ./~/imports-loader?define=>false!./lib/vpaid.js Critical dependencies: 4:113-120 This seems to be a pre-built javascript file. Though this is possible, it's not recommended. Try to require the original source to get better results. @ ./~/imports-loader?define=>false!./lib/vpaid.js 4:113-120 WARNING in ./~/imports-loader?define=>false!./lib/overlay.js Critical dependencies: 10:416-423 This seems to be a pre-built javascript file. Though this is possible, it's not recommended. Try to require the original source to get better results. @ ./~/imports-loader?define=>false!./lib/overlay.js 10:416-423So, my question is, how can I make this work in webpack.config.js so that I don't get these warnings?
最满意答案
我已经解决了这个问题! 要完成这项工作,您需要这样:
{ test: /[\/\\]lib[\/\\](video|playlist|vpaid|overlay)\.js$/, exclude: /node_modules|src/ loader: 'imports?define=>false' }和这个
require('script-loader!../lib/video.js') require('script-loader!../lib/playlist.js') require('script-loader!../lib/vpaid.js') require('script-loader!../lib/overlay.js')一起!
现在,如果你使用它(而不是脚本加载器):
require('imports?define=>false!../lib/video.js') require('imports?define=>false!../lib/playlist.js') require('imports?define=>false!../lib/vpaid.js') require('imports?define=>false!../lib/overlay.js')它不会起作用! (你需要import-loader和script-loader同时工作。
I have solved the problem! To make this work you need this:
{ test: /[\/\\]lib[\/\\](video|playlist|vpaid|overlay)\.js$/, exclude: /node_modules|src/ loader: 'imports?define=>false' }and this
require('script-loader!../lib/video.js') require('script-loader!../lib/playlist.js') require('script-loader!../lib/vpaid.js') require('script-loader!../lib/overlay.js')together!
Now, if you use this (instead of script-loader):
require('imports?define=>false!../lib/video.js') require('imports?define=>false!../lib/playlist.js') require('imports?define=>false!../lib/vpaid.js') require('imports?define=>false!../lib/overlay.js')It's not gonna work! (you need both imports-loader and script-loader working in unison.
更多推荐
发布评论