These are chat archives for webpack/webpack

14th
Sep 2018
Michael Wolfenden
@michael-wolfenden
Sep 14 2018 03:18

Hi, I am unable to get a scenario working in webpack 3 to work in webpack 4

I have a non-spa application using server-rendered html that is using vuejs on every page to add some dynamic html.

I used to use the CommonsChunkPlugin to create a shared js and css file loaded on every page, and then each page has its own js file, but I an unable to get this configuration working using the new splitChunks.

Is this scenario still supported?
, I have a cut down example of the current setup here

https://gist.github.com/michael-wolfenden/fa2c9dcfbf74d3a0e486fa964b959c2b

sushant singh chauhan
@sushantlp
Sep 14 2018 05:46
hi all . i had problem in webpack i m using facebook react with webpack . i import react date css not proper load
Mauricio Amezcua
@maurinator
Sep 14 2018 13:37
Hello amazing people of webpack! I am trying to use internationalized js by using the parallel-webpack plugin. I want to avoid running multiple compilations of the css. Does anyone know how to achieve this? Parallel-webpack takes an array of webpack configs and runs the webpack compiler on them.
ajay yadav
@ajay7868
Sep 14 2018 13:48
i am using webpack in angular but when run project it make lot of chunk file its taking lot of response time .plz any help
Tom Morten Berge
@norsecode
Sep 14 2018 14:14
Not really sure if this is a Truffle or Webpack question but here goes. I started truffle with the webpack example and been working from there. Everything has been going well, have a couple of contracts running and and a webpage up. However, I want to now run with multiple js and html files. Looks like the solution lies with using HtmlWebpackPlugin in the webpack.config.js file. I haven't really looked into that file yet and more I look at it the more confuse I get :) First of all I can't seem to find my app.js file which I have been using so far. I was in the build directory at init, but after I deleted it, it never comes back and I can't find it anywhere, but my html page has been working. I also having problems specifying the location of my html file when I'm using the HtmlWebpackPlugin, I'm getting a entry point not found when running (npm run dev). So I must be missing something very basic. Anyone have any ideas?
JM Presley
@jmptr
Sep 14 2018 14:17
@norsecode that's a looooot of setup, do you have a link to your project?
Tom Morten Berge
@norsecode
Sep 14 2018 14:21
@jmptr You should be able to access it here:
https://github.com/NewspaceMarket/platform-contracts
does not have my latest attempt with HtmlWebpackPlugin checked in, but still would like to solve the app.js mystery
Krzysztof Władyka
@kwladyka
Sep 14 2018 14:35
why import Grid from "@material-ui/core/Grid"; in index.js throw
ERROR in ./node_modules/jss/node_modules/symbol-observable/index.js
Module not found: Error: Can't resolve './lib/index' in '/Users/kwladyka/Library/Mobile Documents/com~apple~CloudDocs/storage/Projects/form-validator-demo/node_modules/jss/node_modules/symbol-observable'
 @ ./node_modules/jss/node_modules/symbol-observable/index.js 1:17-39
 @ ./node_modules/jss/lib/utils/isObservable.js
 @ ./node_modules/jss/lib/plugins/observables.js
 @ ./node_modules/jss/lib/Jss.js
 @ ./node_modules/jss/lib/index.js
 @ ./node_modules/@material-ui/core/Styles/withStyles.js
 @ ./node_modules/@material-ui/core/Styles/index.js
 @ ./src/js/index.js
error Command failed with exit code 2.
Krzysztof Władyka
@kwladyka
Sep 14 2018 14:54
hmm it looks like I needed rm node_modules to fix it...
JM Presley
@jmptr
Sep 14 2018 14:55
@norsecode Just briefly looking at your webpack config, I think you can use multiple instances of HtmlWebpackPlugin, and configure each one with the chunks you want in it. See the options here: https://github.com/jantimon/html-webpack-plugin#options
Tom Morten Berge
@norsecode
Sep 14 2018 15:11
@jmptr Been trying that, but I can't seem to be able to specify the right path to the file. That's when I started to look for my app.js file but couldn't find it.
pushed my latest webconfig.js file so you can see how I'm trying to do it.
JM Presley
@jmptr
Sep 14 2018 15:15
@norsecode I cloned and built your project, everything is in the dist folder. dist has app & build folders, app has an index.html and build has an app.js
Tom Morten Berge
@norsecode
Sep 14 2018 15:17
@jmptr hmm, I don't see a dist folder. what command did you run?
JM Presley
@jmptr
Sep 14 2018 15:23
npx webpack
Tom Morten Berge
@norsecode
Sep 14 2018 15:26
@jmptr that did it. I can see them now. Hopefully that will help me solve my path problem. Thanks alot! Still find it strange that it's been working.
JM Presley
@jmptr
Sep 14 2018 15:32
@norsecode I might remove your prepare task until you've stabilized your build process, that might make things less fragile to you
Isaac Brown
@irbrownie
Sep 14 2018 15:52
I'm getting a weird issue where webpack can't find a package that has been included in my project.
It's a loader that the v8-cache says it can't find.
Tom Morten Berge
@norsecode
Sep 14 2018 16:10
@jmptr will look into that. Little bit easier to see what's going on when I can at least see my files. So HtmlWebpackPlugin is generating a html page now which points to my js file. The path seems to be correct, but when I am trying to run I am getting: Entrypoint undefined = ./app/index.html. Does this mean it can't find my html file or my js file maybe?
Tom Morten Berge
@norsecode
Sep 14 2018 17:02
@jmptr no worries about the last one. seems to just be a warning, strange but just a warning. Can live with that for now :)
Thanks for your help!
Thomas Havlik
@thavlik
Sep 14 2018 19:17
Hi folks, I am trying to get a toolchain started with happypack and fork-ts-checker-webpack-plugin. Webpack appears to be undefining compiler.hooks at some point, and the following error is yielded: ```
/home/tom/node/VSCodeNewProject/node_modules/fork-ts-checker-webpack-plugin/lib/index.js:424
            this.compiler.hooks.forkTsCheckerReceive.call(this.diagnostics, this.lints);
                                                     ^

TypeError: Cannot read property 'call' of undefined
    at ForkTsCheckerWebpackPlugin.handleServiceMessage (/home/tom/node/VSCodeNewProject/node_modules/fork-ts-checker-webpack-plugin/lib/index.js:424:54)
    at ChildProcess.<anonymous> (/home/tom/node/VSCodeNewProject/node_modules/fork-ts-checker-webpack-plugin/lib/index.js:382:70)
    at ChildProcess.emit (events.js:182:13)
    at emit (internal/child_process.js:812:12)
    at process._tickCallback (internal/process/next_tick.js:63:19)
Not everyone seems to be getting this error, and the source code for this plugin is really small so I've gone through it and cannot see anything in there that would be doing this
Makes me think it's webpack doing something stupid
works even with webpack 4
theRealFakeRock
@theRealFakeRock
Sep 14 2018 22:31
Hello I'm trying to inject environment variables, production database credentials, on run time. I am compiling down an express app using es6. For some reason the environment variables are getting erased or something?
theRealFakeRock
@theRealFakeRock
Sep 14 2018 23:27
never mind I figured it out. I just don't use DefinePlugin to define environment variables