简体   繁体   English

Webpack和导入 - 加载程序错误“无法解决”

[英]Webpack and imports-loader error “Can't resolve”

I'm trying to use Webpack (v3.6.0) to bundle a lot of js files for my web application, some are angular components, but mostly they are legacy code. 我正在尝试使用Webpack(v3.6.0)为我的Web应用程序捆绑大量js文件,其中一些是角度组件,但大多数是遗留代码。

The legacy code is heavily interdependent of some specific functions. 遗留代码与某些特定功能严重相互依赖。 For instance, we have a specific file that declares 3 functions (PrepareTranslation, PrepareLocalTranslation and Translate), that are used throughout the system. 例如,我们有一个特定的文件,声明在整个系统中使用的3个函数(PrepareTranslation,PrepareLocalTranslation和Translate)。

I was looking for a way to make this 3 functions global, but instead, I found an article about 'imports-loader' that would allow me to inject variables into that code using a specific notation: 我正在寻找一种方法来使这3个函数全局化,但相反,我发现了一篇关于'imports-loader'的文章,它允许我使用特定的符号将变量注入到该代码中:

require("imports-loader?$=jquery!./myjs");

The above code would, inside myjs.js make 上面的代码会在myjs.js里面生成

var $ = require('jquery');

However, when I try using this method to inject requires and variables into my classes, Webpack throws an error "Can't resolve imports-loader?$=jquery!./myjs". 但是,当我尝试使用此方法将需求和变量注入我的类时,Webpack会抛出错误“无法解析导入 - 加载器?$ = jquery!./ myjs”。 Removing the ! 删除! from the string fixes the error, but I don't quite like the sintax that way, and it differs from everything I was able to find online so far. 从字符串修复错误,但我不太喜欢sintax那样,它与我迄今为止在网上找到的所有内容都不同。

My entrypoint script for webpack is as follows: 我对webpack的入口点脚本如下:

window._SYS_VER = '452';

import 'jquery';

import 'ThirdParty/angular/angular';

import Emitter from 'ThirdParty/emitter';

//SimpleMVC related
import 'imports-loader?jQuery=jquery./js/simplemvc/simplemvc.modaldialog';
import 'imports-loader?jQuery=jquery./js/simplemvc/simplemvc.paneldialog';
//     import 'imports-loader?jQuery=jquery!./js/simplemvc/simplemvc.paneldialog';
import Translation from 'JS/simplemvc/simplemvc.i18n';

// jQuery related
import 'JS/jquery/ui/jquery-ui.min';
import 'JS/jquery/masked/jquery.maskedinput';
import 'JS/jquery/growl/jquery.growl';
import 'imports-loader?prepareTranslation=>Translation.prepareTranslation./js/jquery/alerts/jquery.alerts';

I have tried using require syntax instead of import, but it works the same way. 我尝试使用require语法而不是import,但它的工作方式相同。

I was able to make jquery available on every js using webpack.ProvidePlugin, but it didn't work for my i18n functions, then I started trying with imports-loader 我能够使用webpack.ProvidePlugin在每个js上使用jquery,但它对我的i18n函数不起作用,然后我开始尝试使用imports-loader

Any ideas? 有任何想法吗?

webpack将导入 - 加载器分开,因此需要通过以下方式安装:

yarn add imports-loader

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM