CODEWITHSUNDEEP
javascriptangularjstypescriptwebpackbabeljs
Justin
Justin

Reputation: 2334

Webpack does not create output file (not using webpack-dev-server)

I am using webpack (NOT the dev-server, I know that doesn't output a file), and it is not creating a dist folder or output file.

I've tried running it directly through webpack (installed globally) and npm run build which uses a locally installed webpack. Neither work.

Here's my config:

const path = require('path');

module.exports = {
  entry: {
    app: './src/entry.js',
  },
  output: {
    path: path.join('/dist'),
    filename: '[name].bundle.js',
  },
  module: {
    loaders: [
      {
        test: /\.tsx?$/,
        loader: 'ts-loader',
      },
      {
        test: /\.js$/,
        exclude: /node_modules/,
        loaders: ['ng-annotate'],
      },
      {
        test: /\.js$/,
        exclude: /(node_modules)/,
        loader: 'babel', // 'babel-loader' is also a legal name to reference
        query: {
          presets: ['es2015', 'latest'],
        },
      },
      {
        test: /\.css$/,
        loader: 'style-loader!css-loader',
      },
      {
        test: /\.html$/,
        loader: 'html',
      },
      {
        test: /\.less$/,
        loader: 'style!css!less',
      },
    ],
  },
  resolve: {
    extensions: ['', '.webpack.js', '.web.js', '.ts', '.tsx', '.js'],
    root: [
      path.resolve('./src'),
      path.resolve('./node_modules'),
    ],
    alias: {
      vendor: path.join('/node_modules'),
    },
    fallback: ['node_modules'],
  },
};

I've attempted to fix the problem by creating the dist folder manually, but that doesn't work either, the file still is not created.

The weird thing is that it DID build the file before, but now it's stopped. I've not changed the output location or the entry file at any point.

Any suggestions?

Upvotes: 10

Views: 15071

Answers (1)

monokh
monokh

Reputation: 1990

Your webpack output path is absolute:

output: {
    path: path.join('/dist'), <----
    filename: '[name].bundle.js',
},

My guess is it's being generated in your root directory. /dist would mean from the root of your file system, not relative to your project directory.

It should be:

output: {
    path: path.join('./dist'),
    filename: '[name].bundle.js',
},

Upvotes: 15

Related Questions