Coder Social home page Coder Social logo

Comments (2)

fulls1z3 avatar fulls1z3 commented on June 20, 2024

You're seeing the message Uncaught Error: No NgModule metadata found for 't'. because UglifyJs is minifying the source. Actually t might refer to AppModule, Compiler, etc. (as they were discussed on #29 and angular/angular-cli#6833).

In order to disable minifying, you'll need to customize your config/webpack.config.js more or less the way below:

const webpackMerge = require('webpack-merge'),
  webpackConfig = require('angular-webpack-config');

const aotPlugin = require('@ngtools/webpack').AotPlugin,
  copyWebpackPlugin = require('copy-webpack-plugin'),
  htmlElementsWebpackPlugin = require('html-elements-webpack-plugin');

const _ = require('lodash');

const mergeUnique = function(key, uniques, getter = a => a) {
  return (a, b, k) => (
    k === key && [
      ...b,
      ..._.differenceWith(
        a, b, item => uniques.indexOf(getter(item)) >= 0
      )
    ]
  );
};

const browserConfig = function(root, settings) {
  return {
    /**
     * Add additional plugins to the compiler.
     *
     * See: http://webpack.github.io/docs/configuration.html#plugins
     */
    plugins: [
      new aotPlugin({
        tsConfigPath: './tsconfig.json',
        entryModule: root(`${settings.paths.src.client.app.root}/app.browser.module#AppBrowserModule`)
      }),

      new copyWebpackPlugin([
        {
          from: `${root(settings.paths.src.client.assets.root)}/config.json`,
          to: './config.json'
        },
        {
          from: `${root(settings.paths.src.client.assets.root)}/i18n/en.json`,
          to: './i18n/en.json'
        },
        {
          from: `${root(settings.paths.src.client.assets.root)}/i18n/tr.json`,
          to: './i18n/tr.json'
        }
      ]),

      new htmlElementsWebpackPlugin(require(root(`${settings.paths.config}/html-elements.config`)))
    ]
  };
};

module.exports = function(options, root, settings) {
  switch (options.env) {
    case 'prod':
    case 'production':
      return !!options.platform
        ? options.platform === 'server'
          ? webpackConfig.universal.server.prod(root, settings)
          : webpackMerge({
            customizeArray: mergeUnique(
              'plugins',
              ['UglifyJsPlugin'],
              plugin => plugin.constructor && plugin.constructor.name
            )
          })(webpackConfig.universal.browser.prod(options, root, settings), browserConfig(root, settings))
        : webpackMerge({
          customizeArray: mergeUnique(
            'plugins',
            ['UglifyJsPlugin'],
            plugin => plugin.constructor && plugin.constructor.name
          )
        })(webpackConfig.universal.browser.prod(options, root, settings), browserConfig(root, settings));
    case 'test':
    case 'testing':
      return webpackConfig.test(root, settings);
    case 'dev':
    case 'development':
      return !!options.platform
        ? options.platform === 'server'
          ? webpackConfig.universal.server.dev(root, settings)
          : webpackMerge(webpackConfig.universal.browser.dev(options, root, settings), browserConfig(root, settings))
        : options.hmr
          ? webpackMerge(webpackConfig.spa.hmr(options, root, settings), browserConfig(root, settings))
          : webpackMerge(webpackConfig.spa.dev(options, root, settings), browserConfig(root, settings));
  }
};

This way, you'll be able to modify the plugins provided by angular-webpack-config without modifying its source from node_modules. And it will give you which NgModule doesn't have a metadata, rather than just t.

However, I suggest you to re-clone the repo and perform a fresh yarn to try these tricks. Because yesterday, I made several commits to resolve a tremendous amount of issues.

from universal.

theomathieubhvr avatar theomathieubhvr commented on June 20, 2024

Thanks I just got a 'No provider for StateTransferService!'
I am going to be able to debug this now.

Many many thanks 👍

from universal.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.