webpack-dev-server

Webpack development server seperate subdomain proxied by nginx

由 夙愿已清 提交于 2019-12-02 07:56:22
im currently stuck on a probem with the webpack-dev-server which listen on a wrong domain with a wromng port. I've dockerized my Symfony application having 3 container, node, php and nginx. On the Node container the webpack-dev-server is running with the following (shortened) configuration output: { filename: '[name].[hash].js', chunkFilename: '[name].[chunkhash].js', path: Path.resolve(__dirname, 'web/static'), publicPath: '/static/' }, devServer: { contentBase: Path.join(__dirname, 'web'), host: '0.0.0.0', port: 8080, headers: { "Access-Control-Allow-Origin": "*", "Access-Control-Allow

Webpack There are multiple modules with names that only differ in casing

由 别来无恙 提交于 2019-12-02 07:17:07
I have something like this: WARNING in C:/Data/.../letsTest.jsx There are multiple modules with names that only differ in casing. This can lead to unexpected behavior when compiling on a filesystem with other case-semantic. Use equal casing. Compare these module identifiers: * C:\Data\...\node_modules\babel-loader\lib\index.js?presets[]=es2015&presets[]=react&presets[]=stage-0&presets[]=stage-2!C:\Data\...\letsTest.jsx Used by 4 module(s), i. e. multi C:/Data/Doc/13/13080801/LetsTest/letsTest.jsx * C:\Data\...\node_modules\babel-loader\lib\index.js?presets[]=es2015&presets[]=react&presets[]

React, WebPack and Babel for Internet Explorer 10 and below produces SCRIPT1002: Syntax error

由 心不动则不痛 提交于 2019-12-01 19:23:21
I've read multiple threads regarding similar issues and tried some propositions, but had no results. I've followed few tutorials related to React.js and WebPack 3 . As the result the application is working well on all browsers (at this moment) except IE 10 and below. The error points to bundle.js (once I'm using the configuration Nr.1): SCRIPT1002: Syntax error and the line - const url = __webpack_require__(83); With configuration Nr2., on local server - : SCRIPT1002: Syntax error - line with eval() And the same configuration, but running on remote server produces a bit different error:

webpack bundle.js not found

由 只谈情不闲聊 提交于 2019-12-01 19:17:34
I use webpack dev server, but can't access my bundle.js file. Edit: I am using this webpack config without bower-webpack-plugin . package.json { "name": "react_modules", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "start": "npm run serve | npm run dev", "serve": "./node_modules/.bin/http-server -p 8080", "dev": "webpack-dev-server -d --progress --colors --port 8090" }, "author": "", "license": "ISC", "devDependencies": { "babel-core": "^6.0.20", "babel-loader": "^6.0.1", "babel-preset-es2015": "^6.0.15", "bootstrap": "^3.3.5", "bower-webpack-plugin": "^0.1.9", "css

Webpack-dev-server does not place bundle in dist

由 北城余情 提交于 2019-12-01 18:55:16
I am trying to setup a Webpack configuration for a website I want to build. I want to compile SASS to CSS and place it into the dist folder. When I run npm run build it works fine but when I run npm run watch to trigger the Webpack-dev-server it does not compile the index.js to bundle.js and it won't appear in the dist folder. Is there something wrong with my webpack.config.js? index.html <html> <head> <title>Getting Started</title> <link rel="stylesheet" href="dist/css/main.min.css"> </head> <body> test <script src="dist/scripts/bundle.js"></script> </body> </html> webpack.config.js const

Enable single page app react hot reload webpack

由 有些话、适合烂在心里 提交于 2019-12-01 18:10:15
I have some problems setting up a single page react app using react router with the webpackdevserver. If I use browserhistory webpack has some problems when entering a nested route url (/client/view for example). This could be solved adding apiFallback but hot reload does still have a problem. It tries to load the hot-update.json file from the deep url (/client/view/hot-update.json) which does not exist and therefor fails and reloads the page. How can i tell hotreload to always load the hot-update.json from the base url (/)? I had a similar issue when using a publicPath other than '' , which I

Webpack dev server React Content Security Policy error

由 こ雲淡風輕ζ 提交于 2019-12-01 17:50:01
I have my single page app running on webpack-dev-server. I can load and reload my entry route over at localhost:8080 and it works every time. However i can load localhost:8080/accounts/login only via a link from within the app i.e whenever i reload localhost:8080/accounts/login from the browser refresh button i get Cannot GET /accounts/login/ as the server response, and on the console i get Content Security Policy: The page’s settings blocked the loading of a resource at self (“default-src http://localhost:8080 ”). Source: ;(function installGlobalHook(window) { .... This is my CSP header on

Webpack with bower support

由 允我心安 提交于 2019-12-01 17:21:48
Would I like to load preferably the node packages, and only if not exist, loads the bower package. I would just use the node package only as recommended in Webpack site, but I need to load a library that is just in bower, https://github.com/Stamplay/stamplay-js-sdk and https://github.com/Stamplay/angular-stamplay Try with bower-webpack-plugin I installed https://github.com/lpiepiora/bower-webpack-plugin But when I run webpack-dev-server -d --watch the error is displayed in chrome console: Uncaught TypeError: angular.module is not a function(anonymous function) @ app.js:8__webpack_require__ @

How to get image that is within a data attrbute with Webpack 2?

由 孤街浪徒 提交于 2019-12-01 13:55:58
I am using .pug templates for my HTML and standard src attributes on my images like so: img(src=`../images/${image}`) When I run webpack -p , any images defined in the src 's of my images are found by Webpack and placed into my dist directory. This is exactly what I would expect to happen. However, I now have a requirement to lazy load my images, so I want to place the reference to the image into a data-src attribute instead of the standard src , like so: img(data-src=`../images/${image}` src='data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7') Running webpack -p

Webpack-dev-server does not place bundle in dist

由 大憨熊 提交于 2019-12-01 05:27:29
问题 I am trying to setup a Webpack configuration for a website I want to build. I want to compile SASS to CSS and place it into the dist folder. When I run npm run build it works fine but when I run npm run watch to trigger the Webpack-dev-server it does not compile the index.js to bundle.js and it won't appear in the dist folder. Is there something wrong with my webpack.config.js? index.html <html> <head> <title>Getting Started</title> <link rel="stylesheet" href="dist/css/main.min.css"> </head>
订阅 webpack-dev-server