webpack-dev-server

Webpack Dev Server Not Hot Reloading .vue files

由 爱⌒轻易说出口 提交于 2019-12-23 09:28:37
问题 Been working on a project and was sure HMR was working, any of my .js files if I would update them webpack would compile and the module would be replaced all hot like. I was working on a .vue file and webpack would recompile, but there was no super fresh HMR. Hoping someone can take a look and tell me if something is off: The script I'm using in the cli looks like this. webpack-dev-server --d --watch --output-path ./public --config ./_src/webpack.config.js --progress --env.dev I'm guessing

Can't make react-hot-loader and webpack-dev-server work with react-router

由 你说的曾经没有我的故事 提交于 2019-12-23 09:17:06
问题 I'm trying to use react-hot-loader with webpack-dev-server and react-router , but when I try to access localhost:3000/ I get : Cannot GET / Of course, it works when I try to access localhost:8000/. I tried to follow react-hot-boilerplate, without success. Here's my code: server.js const http = require('http'); const express = require('express'); const consolidate = require('consolidate'); const bodyParser = require('body-parser'); const routes = require('./routes'); const app = express(); app

npm package “watch” giving “no such file or directory” error

由 纵饮孤独 提交于 2019-12-23 04:34:40
问题 Thanks in advance for helping me. I want to create a product build on changes inside src directory. For that I used watch package of npm. Below is my "scripts" inside package.json "scripts": { "webpack-dev-server": "webpack-dev-server", "dev": "watch 'npm run prod' src", "prod": "webpack --mode=production" }, Now when I run npm run dev command. It gives me: Error: ENOENT: no such file or directory, stat 'E:\projects\chatapp\run' 回答1: Try with npm install maybe it solves or you can look at

webpack-dev-server is setting wrong path for root localhost:8080

由 本小妞迷上赌 提交于 2019-12-22 22:47:09
问题 I'm real beginner in ReactJS. I need you help to set up webpack-dev-server for localhost:8080. I'm following this YouTube Tutorial to set it up, but I can't get success yet while in the tutorial its working. it sets root path as ../node_module/.bin and listed me files in it. It should set root as "react-for-everyone". See Image to check file hierarchy, browser and command for the webpack-dev-server. package.json: { "name": "react-for-everyone", "version": "1.0.0", "description": "", "main":

Why is my webpack trying to load .js files when compiling a .sass file?

由 人走茶凉 提交于 2019-12-22 10:09:34
问题 I'm trying to use blueprintjs so I followed the tutorial with this line: main.sass @import "~@blueprintjs/core"; However my webpack-dev-server gives me this error log: ERROR in ./node_modules/css-loader?{"minimize":false}!./node_modules/postcss-loader/lib?{"sourceMap":true}!./node_modules/resolve-url-loader!./node_modules/sass-loader/lib/loader.js?{"sourceMap":true}!./app/javascript/packs/main.sass Module build failed: */ ^ Invalid CSS after " */": expected 1 selector or at-rule, was '"use

How to ensure that hot CSS loads before JS in webpack-dev-server?

由 只谈情不闲聊 提交于 2019-12-22 04:36:08
问题 I'm using webpack-dev-server to hot load all of my assets including CSS. Currently though, my CSS loads after the JavaScript which causes my application issues in some places that depend on layout existing. How can I ensure that the CSS loads before the JavaScript executes? I'm thinking there must be a way to do this from module , perhaps a a callback I could hook in to? Or maybe by configuring the style-loader to have priority? This is my index.js: import './styles/main.scss'; import '.

browser automatic reload when index.html changes

由 試著忘記壹切 提交于 2019-12-21 20:16:24
问题 I am using webpack-dev-server in a very simple setup. I've found that even though the server automatically triggers a browser reload when the index.js file changes, it does not trigger a reload when the index.html changes. How can I achieve that? Here's my setup: package.json { "name": "html-reload", "version": "1.0.0", "description": "", "main": "src/index.js", "scripts": { "build": "node_modules/webpack/bin/webpack.js", "start": "webpack-dev-server --host 0.0.0.0 --port 8383 --content-base

Enabling webpack hot-reload in a docker application

由 故事扮演 提交于 2019-12-21 18:06:43
问题 I have a docker app with the following containers node - source code of the project. it serves up the html page situated in the public folder. webpack - watches files in the node container and updates the public folder (from the node container) on the event of change in the code. database this is the webpack/node container setup web: container_name: web build: . env_file: .env volumes: - .:/usr/src/app - node_modules:/usr/src/app/node_modules command: npm start environment: - NODE_ENV

How to resolve the Webpack 2 loaderUtils.parseQuery() Warning?

由 只愿长相守 提交于 2019-12-21 17:53:27
问题 When I compiled my files by using Webpack2. It showed the following warning: "loaderUtils.parseQuery() received a non-string value which can be problematic, see https://github.com/webpack/loader-utils/issues/56" I checked the github page and did not find out how to resolve this problem. This is my config: // webpack 2 configuration // https://webpack.js.org/guides/migrating/ const webpack = require('webpack'); const path = require('path'); const ExtractTextPlugin = require('extract-text

Webpack_（第三章）_使用WebpackDevServer提升开发效率

由 让人想犯罪 __ 提交于 2019-12-21 15:35:00
使用WebpackDevServer提升开发效率 我们修改代码，如果想在浏览器上正确运行，都需要手动打包 npm run bundle ,这样的话我们的开发效率是非常低下的，我们希望，如果改了src下面的原代码，那么dist目录就会自动打包，那么就简单多了，不用每次都运行 npm run bundle 了。 要想实现这样的功能，有三种做法 方法一：webpack --watch 打开package.json文件，当我们运行 npm run bundle 的时候，实际上是在运行webpack命令，我们可以给它加一个watch "scripts": { "bundle": "webpack --watch" }, 然后执行 npm run bundle ，之后修改src下面的内容。都会自动执行 npm run bundle 当加了一个watch参数的时候，是什么意思呢？意思是webpack会帮助我们去监听打包的文件，只要打包的文件发生变化，就会自动的重新打包。 我们想要在第一次运行 npm run bundle 的时候，自动帮我们实现打包并且把浏览器打开，同时还可以模拟一些服务器上的特性，这样的话通过package.json配置 webpack --watch就不行了 方法二：webpack-dev-server 借助WebpackDevServer来帮助我们实现
订阅 webpack-dev-server