Webpack

How to expose Vue as global object

由 不想你离开。 提交于 2021-02-10 23:23:17
问题 I am integrating legacy code with newer one, built with Webpack. In legacy code, plain js accessed Vue simply with: new Vue(...) , from global scope. In Webpack, Vue will get sucked into vendor bundle and I would like to expose Vue back, so my legacy code would still see it as window.Vue What I have done so far (webpack 3.x): { test: require.resolve('vue/dist/vue.esm.js'), use: [{loader: 'expose-loader', options: 'Vue' }] } I get close with this, but I end up with window.Vue.default having

webpack和webpack-cli的安装和卸载

由 ぐ巨炮叔叔 提交于 2021-02-10 22:51:59
删除全局webpack-cli webpack4.x开始官方文档是说要安装cli所以如果的在用4.+就需要卸载cli npm uninstall -g webpack-cli # 注释给我这种小白提供参考 # 卸载 uninstall 可以简写成 un # 全局 -g 的完整写法是 --global # 现在问题来了这样真的卸载了webpack-cli吗？ # 答案是没有。到现在为止我还没有发现那个webpack-cli是全局安装的，至少官方文档没看到。 # 那就看下面怎么删除局部webpack-cli 删除本地（局部）webpack-cli npm uninstall webpack-cli # 仔细看你会发现去掉全局参数 -g # 这时候你的命令行会快速滚动一些删除信息。 # webpack-cli删除成功 删除全局webpack npm uninstall -g webpack # 这个注释还是给小白看的 # 为什么要局部全局删除webpack # 因为你可能在安装webpack时不确定自己是全局安装 # 还是本地安装，所以建议先执行全局删除命令 # 然后在执行下面的本地删除命令 删除本地webpack npm un webpack # 这时候小白的webpack是删除完成了 # 还没完看下面怎么说 检查webpack残余文件 ls # 用ls命令查看一下是否有这几个文件 #

dynamically setting __webpack_public_path__ does not work after build in vue application

由 北战南征 提交于 2021-02-10 21:12:03
问题 I have a vue frontend, and spring boot backend application. My application has multiple instances with different url paths (for example /instance1, /instance2), but uses the same build project - meaning every instances runs the same jar. Also the application serves static files - the index.html of the compiled vue application. My problem is that the vue application needs to know dynamically from which url path to get all its static files, so for example when i get the index.html of instance1

svg-sprite-loader with Angular 8 custom webpack config

由 佐手、 提交于 2021-02-10 20:31:46
问题 I am trying to use svg-sprite-loader package (to create a svg sprite) with my Angular 8 project using custom webpack config. I am using below custom config: const SpriteLoaderPlugin = require('svg-sprite-loader/plugin'); module.exports = { module: { rules: [ { test: /\.(svg)$/, loader: 'svg-sprite-loader', options: { spriteFilename: './src/assets/svg/combinedicons.svg', runtimeCompat: true, }, }, ], }, plugins: [ new SpriteLoaderPlugin({ plainSprite: true, }), ], }; I am getting following

svg-sprite-loader with Angular 8 custom webpack config

由 谁说胖子不能爱 提交于 2021-02-10 20:29:38
问题 I am trying to use svg-sprite-loader package (to create a svg sprite) with my Angular 8 project using custom webpack config. I am using below custom config: const SpriteLoaderPlugin = require('svg-sprite-loader/plugin'); module.exports = { module: { rules: [ { test: /\.(svg)$/, loader: 'svg-sprite-loader', options: { spriteFilename: './src/assets/svg/combinedicons.svg', runtimeCompat: true, }, }, ], }, plugins: [ new SpriteLoaderPlugin({ plainSprite: true, }), ], }; I am getting following

weex 启动 ios 模拟器

由 旧街凉风 提交于 2021-02-10 18:31:08
前提需要的安装 　　node 　　npm 　　weex-toolkit 　　cocoaPods 1. 创建weex工程 　　weex create helloWolrd 2. 进入helloWolrd文件夹安装依赖，我用cnpm install的话就会报错，这里最好用npm install 　　npm install 3. 添加ios应用 　　weex platfrom add ios 4. 到platforms/ios目录下为ios工程用cocoaPods安装第三方依赖，这里ios工程需要安装的依赖可以打开ios目录下的Podfile文件查看，如下 　　 　　好了，接下来用pod命令对这些依赖进行安装，cd到ios目录，pod install就可以了，前提是要先安装好cocoaPods，ios开发对它都比较熟悉，这个网上有很多教程。还有如果pod库很久没有更新的话很可能会安装失败，因为找不到上图中新版本的weex相关的库，建义pod setup，pod update更新一下库。这个最好翻-墙操作，否则会等很久。如果之前更新过pod，那使用 pod install --no-repo-update 安装会更快。安装好后如下： 　　 5. 再回到weex根目录，启动ios 模拟器 　　weex run ios 　　这一行命令下去，会先启动weex的webpack服务

Webpack have trouble with scopes

由 拟墨画扇 提交于 2021-02-10 18:17:02
问题 There are several modules that are connected to app.js, for example the code that is inside: var test = "TEST"; Here is my webpack.config: module.exports = { entry: './src/app.js', output: { filename: './dist/bundle.js' } }; The problem is that when I try to call my test variable in the developer console, I get an error: Something about the scope, when I connect app.js directly - everything works, what's the problem and how to fix it? 回答1: Yes, this is a scope problem. There are two ways to

Webpack have trouble with scopes

由 生来就可爱ヽ(ⅴ＜●) 提交于 2021-02-10 18:06:11
问题 There are several modules that are connected to app.js, for example the code that is inside: var test = "TEST"; Here is my webpack.config: module.exports = { entry: './src/app.js', output: { filename: './dist/bundle.js' } }; The problem is that when I try to call my test variable in the developer console, I get an error: Something about the scope, when I connect app.js directly - everything works, what's the problem and how to fix it? 回答1: Yes, this is a scope problem. There are two ways to

Why can't I determine the path for require.context in a karma shim by passing a variable?

由 一个人想着一个人 提交于 2021-02-10 17:27:34
问题 I want to set the path for require.context(path, ...) in a shim file called by karma (set in the files parameter in the config) dynamically, but somehow, as soon as I use a variable for path, I get the error 'Cannot find module "."' in the CLI. This is very odd, because if I hardcode the very same path into the call, it runs without a problem. Aka, if I do var testPath = '../src'; console.log("PATH 2 " + testPath); // ../src var appContext = require.context(testPath, true, /\.spec\.ts/); I'll

Can ES6 be used natively in webpack.config.js?

由 让人想犯罪 __ 提交于 2021-02-10 15:47:47
问题 This answer: How can I use ES6 in webpack.config.js? seems to imply a transpilation step. Can ES6 be used natively? How? For example I tried to convert the simple example here from require to import and receive the following error (function (exports, require, module, __filename, __dirname) { import path from 'path' ^^^^ SyntaxError: Unexpected identifier 回答1: You should use webpack-cli --config-register (-r) to allow that. To use that flag, you must have babel-register installed. webpack -
订阅 Webpack