Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • 13:16
    webpack-bot labeled #9605
  • 13:14
    webpack-bot labeled #9605
  • 12:50
    sokra synchronize #9605
  • 12:50

    sokra on cache-resolve-snapshot

    add immutablePaths next to mana… store snapshot of resolving dep… add size info to print-cache-fi… and 5 more (compare)

  • 12:38
    noscripter synchronize #9603
  • 12:38
    webpack-bot labeled #9604
  • 12:37
    webpack-bot labeled #9605
  • 12:37
    webpack-bot labeled #9605
  • 12:37
    sokra opened #9605
  • 12:36

    sokra on cache-resolve-snapshot

    store snapshot of resolving dep… add size info to print-cache-fi… improve build dependencies test and 4 more (compare)

  • 12:35
    noscripter synchronize #9603
  • 12:30
    webpack-bot labeled #9603
  • 12:20
    webpack-bot labeled #9604
  • 12:20
    shaodahong opened #9604
  • 12:20
    webpack-bot labeled #9603
  • 12:20
    noscripter opened #9603
  • 12:16

    sokra on cache-resolve-snapshot

    add size info to print-cache-fi… improve build dependencies test Avoid retry of unserializable e… and 3 more (compare)

  • 09:59
    shaodahong edited #9600
  • 09:50
    webpack-bot unlabeled #9599
  • 09:46
    shaodahong edited #9600
sdyalor
@sdyalor
generate named chunks without configuration?
Screen Shot 2019-08-14 at 4.30.33 PM.png
Gilad Lekner
@glekner
Hello dear people, i'm having trouble switching from webpack --watch to webpack-dev-server --hot. my project is using a server for API so I assume using proxy is possible, but i'm getting a 404 on my bundle files. anyone available?
YeMiancheng
@YMC-GitHub
what is your webpack-dev-server config?
you run a inner server--webpack-dev-server and plan to use proxy for a back-end server?
Gilad Lekner
@glekner
its more complicated because theres a GO executable, that probably manipulates the index.html built from webpack. that executable runs with a "bridge" on port 9000. if i run only the devserver in port 8000 i see the index.html but without css/javascript.
but the hot-reload works, in a hacky way, because i used now writeToDisk ( the bridge searches in the disk for the bundles )
can i run the webpack-dev-server without port? i mean not serve it?
nwallis
@nwallis
Hi, I am using babel-loader with @babel/plugin-syntax-dynamic-import plugin, and it seems to be prefixing my bundled modules with './' ... e.g. './my_module', however the code generated to require them, only uses 'my_module'... no './'... If I edit the generated source and remove './' from the module definition, then it loads ok... any ideas where I should be looking in my config to identify why this is happening?
the generated script is being run in a node environment...
suiyi79
@suiyi79
有中国人吗
killerisl
@killerisl
its so hard to learn
hatanon
@sthtnr
@killerisl yea, I think so too
nwallis
@nwallis
hey... when trying to using dynamic import for a module, my the bundle renderer throws error "render function or template not defined in component"... however if I import directly into my main file (no async), then it renders fine... I am using single file components with <template></template> for vue-loader to extract..
any thoughts on this?
Patrick Holmes
@pjholmes

Hi. I have vue project generated with vue create and the typescript option. In order to support from API calls, I have the following in my vue.config.js file:

const configure = require('./src/server/configure')

module.exports = {  
  devServer: {
    before: configure,
    https: true
  }
}

If I write configure.js in JavaScript it works fine. However, if I change it to TypeScript and give it a .ts extension,
I get the error:

 ERROR  Error loading vue.config.js:
 ERROR  Error: Cannot find module './src/server/configure'

Is it possible to write the configure code in TypeScript and if so, what do I need to change?

Milan Lajtoš
@mlajtos
Hi, is there a way to evaluate ES modules inside a loader? Like val-loader, but for ES20xy... Can I somehow wire in babel-loader to do the transpilation? I'll be glad for any pointer. Thank you all :)
ulearnpro
@ulearnpro
ULEARN - LMS script built on Laravel 5.8 and React JS 16.4
  • An application similar to UDEMY with all the basic features that needed for Learning Management System(LMS), which is completely available as an open source at GitHub.
    https://www.ulearnpro.com
murat aka
@murat-aka
All that for free? Why?
ulearnpro
@ulearnpro
Yes, everything for free.
To reach out to more users and trying to get customisation works..
Iwan Aucamp
@aucampia
is there some way to prevent vendors bundle from being rebuilt unless package-lock or something changes?
or is there some way to only package it once?
Ankur Sharma
@a4abs
Hi,
Is there a way to inject bundle.js content into HTML file?
bitttttten
@bitttttten
what's the best way to debug a silently failing webpack build? i am using a fork of create-react-app and it just goes from "Ready to start the build." to "Exiting.. Done in 31.66s.", finishing without outputting any files or even logging out the gzip differences. my logs inside CRA run up to compiler.run. any tips?
Alfhir
@Alfhir
Hi, when i split code with 4.0 using the defaults, where do fonts go? I imported them like the assets management pages says, but they dont seem to end up in their own chunk
siva
@sivajsl_twitter
Am have strong knowledge in react js and node js
Am looking for new remote job now
If anyone interested on me please contact my gamil sivakumarjegadesan@gmail.com
Iwan Aucamp
@aucampia
... s/^Am/I am/g ... your welcome
Is there some way I can access command line parameters passed to webpack-cli from the config file?
Yatekii
@Yatekii
o/
has anyone got a good template for vuejs + scss + typescript + vue?
bitttttten
@bitttttten
if you export a function rather than a json object in the config file, can't you access the env from the first argument @aucampia ?
module.exports = (env) => { .. }
John Marinelli
@johnmarinelli
why would we want NamedChunks/NamedModules in development mode, but not production? is it for code obfuscation & minification?
deAtog
@deAtog
@johnmarinelli in a production environment using consistent naming can be problematic from a caching perspective. Most web servers are not configured to send expiration headers for static content and many proxy servers will cache the data for an arbitrary period of time as a result to avoid checking if it has been modified. In addition to this, chunk and module names would give an attacker some insight as to how your site is designed/configured making a successful attack a little easier. E.g. by knowing what modules you use, they may be able to exploit known issues with them.
John Marinelli
@johnmarinelli
@deAtog got it, thanks
Kevin Cameron
@kevinkace
anywhere to find ver2 docs?
John Marinelli
@johnmarinelli

in a custom webpack script, we are using chunk.entrypoints. this was deprected in v4 - the message is: Chunk.entrypoints: Use Chunks.groupsIterable and filter by instanceof Entrypoint instead.

i've tried the following:

import webpack, { Entrypoint } from 'webpack'
const groups = chunk.groupsIterable
for (const group in groups) {
  if (group instanceof Entrypoint) { ... }
}

but then it says Entrypoint is not an object.

looking through the webpack source, it seems Entrypoint is not exported. so how exactly should I check if a module is an entrypoint?

edwardj2
@edwardj2
Hey guys I need a pakala app installed to my phone any help from you guys
618457
@618457
Hi Guys, I got an error when I webpack with mini-css-extract-plugin with material-icons.css, come up with error as follow
in ./node_modules/@quasar/extras/material-icons/material-icons.css

Module build failed (from ./node_modules/@vue/cli-service/node_modules/mini-css-extract-plugin/dist/loader.js):
TypeError: Cannot assign to read only property 'exports' of object '#<Object>'
618457
@618457
I work with vue-cli, the material-icons.css came with Quasar-framework. The config of vue.config.js is as follow:
    module: {
      rules:[
          {
            test:/\.vue$/,
            loader: 'vue-loader',
          },
          {
            test: /\.(sa|sc|c)ss$/,
            use: [
              {
                loader: MiniCssExtractPlugin.loader,
                options: {
                  // publicPath: '../',
                  hmr: process.env.NODE_ENV === 'development',
                },
              },
              'css-loader',
              'postcss-loader',
              'sass-loader',
            ],
            exclude: /node_modules/,
          },
          {
            test: /\.less$/,
            use: [{
              loader: 'style-loader' // creates style nodes from JS strings
            }, {
              loader: 'css-loader' // translates CSS into CommonJS
            }, {
              loader: 'less-loader' // compiles Less to CSS
            }]
          },
          {
            test: /\.styl$/,
            loader: 'stylus-loader'
          },
          {
            test: /\.(ttf|eot|svg|woff|woff2)/,
            loader: "file-loader",
            options: {
              name: "[name].[ext]",
              outputPath: "fonts/", 
              publicPath: "../fonts/"
            }
        },
          {
            test: /\.js$/,
            loader: 'babel-loader',
          },
          { 
              test: /\.(png|jpg|jpeg|gif|svg)/,
              use: {
                loader: 'url-loader',
                options: {
                  outputPath: 'images/', // 图片输出的路径
                  limit: 100000
                }
              }
          },
      ]
    },
I think is it the problem that in the material-icons.css the fonts were not handling properly
@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: url('./web-font/flUhRq6tzZclQEJ-Vdg-IuiaDsNcIhQ8tQ.woff2') format('woff2'), url('./web-font/flUhRq6tzZclQEJ-Vdg-IuiaDsNa.woff') format('woff');
}
here is the vue.config.js of webpack setting
{
            test: /\.(sa|sc|c)ss$/,
            use: [
              {
                loader: MiniCssExtractPlugin.loader,
                options: {
                  // publicPath: '../',
                  hmr: process.env.NODE_ENV === 'development',
                },
              },
              'css-loader',
              'postcss-loader',
              'sass-loader',
            ],
            exclude: /node_modules/,
          },
{
            test: /\.(ttf|eot|svg|woff|woff2)/,
            loader: "file-loader",
            options: {
              name: "[name].[ext]",
              outputPath: "fonts/", 
              publicPath: "../fonts/"
            }
        },
618457
@618457
Yes I tried one by one it's the problem of the woff loader is not working. But I tried file-loader and url-loader come with the same error
Evilebot Tnawi
@evilebottnawi
You forgot plugin
618457
@618457
    plugins: [
      // new VueLoaderPlugin(),
      new HtmlWebpackPlugin({
        chunks:['index', 'vendor'],
        hash:true,
        minify:{
            removeAttributeQuotes:true,
            removeComments: true,
            collapseWhitespace: true,
            removeAttributeQuotes: true
        }
      }),
      new CopyWebpackPlugin([
        {
            from: path.resolve(__dirname, 'static'),
            to: path.resolve(__dirname, 'dist/static'),
            ignore: ['.*']
        }
      ]),
      new webpack.ProvidePlugin({
        _:'lodash' 
      }),
      new CopyWebpackPlugin([
          {
              from: path.resolve(__dirname, 'static'),
              to: path.resolve(__dirname, 'dist/static'),
              ignore: ['.*']
          }
      ]),
      new PurifyCSSPlugin({
        paths: glob.sync(path.join(__dirname, 'src/*.html'))
      }),
      new MiniCssExtractPlugin({
        filename: "[name].css",
        chunkFilename: "[id].css",
        ignoreOrder: false, 
      }),
      new OptimizeCSSAssetsPlugin({
        cssProcessorOptions: {safe: true}
      }),
      new CompressionWebpackPlugin({
          filename: '[path].gz[query]',
          algorithm: 'gzip',
          test: productionGzipExtensions,
          threshold: 10240,
          minRatio: 0.8
      }),
      new ProgressBarPlugin({ 
        format: '  build [:bar] ' + chalk.green.bold(':percent') + ' (:elapsed seconds)'
      }),
      new CleanWebpackPlugin()
    ],
Carl Olsen
@unstoppablecarl
Trying to solve this problem. I have a writeup here https://github.com/unstoppablecarl/vue-webpack-css-bug I think it has to do with webpack not removing empty chunks