Angular-cli: require not working

[Waterstraal]

Bug Report or Feature Request (mark with an x)

• [x] bug report -> please search issues before submitting
• [ ] feature request

Versions.

@angular/cli: 1.0.0
node: 6.9.4
os: win32 x64

Repro steps.

run ng new angular-cli-require-test
add const requireTest = require('@angular/common'); in AppModule
run ng build

The log given by the failure.

ERROR in C:/Sandboxes/Research/angular-cli-require-test/src/app/app.module.ts (8,19): Cannot find name 'require'.

Desired functionality.

I would like to see require work in an angular-cli project.

Mention any other details that might be useful.

I need require to set up highcharts per documentation

[vmasek]

Until this issue is resolved you can workaround it by declaring it.
declare const require: any;

[filipesilva]

Overall, whenever you need to do const lib = require('lib') you can instead do import * as lib from 'lib';.

[larssn]

Then how do you require static assets?

import * as mySound from './sound.wav'; doesn't work.

const mySound = require('./sound.wav'); would supposedly work, IF require worked.

(I need Webpack to understand the path to the resource, in order to create the bundle correctly)

[filipesilva]

@larssn importing .wav files isn't part of the base functionality of either require or import, but rather something that only works because webpack (or another bundler) converts those files into something else that can be loaded.

You should be able to load that file using other methods like a simple ajax call, or the http Angular service.

[larssn]

Well I know that webpack has various plugins (like file-loader) that _should_ be able to handle it.

The code I need to work is:

const audio = new Audio(require('../../../assets/audio/notify.wav'));
audio.play();

Ps. Thanks for replying.

PPs. Using json-loader I can import json files using the import syntax, but that doesn't seem to work for other file types using other loaders.

[filipesilva]

I'm sorry to say but we don't intend on adding a .wav loader, or most of these other loaders. It is convenient but not mandatory to load them via require calls since there are other ways to load them.

Adding more loaders leads to a bigger dependency footprint and more stuff to support so we try to keep loaders to a minimum. It's a very slippery slope to 'just add this one more loader' so we don't do it. Another con of doing it is that it is non-standard and not portable to other build systems at all.

[larssn]

Thats perfectly fine! I've ng eject'ed already, so I'm just trying to make it work with whatever I can find. No luck yet.

I had my money on require, but I just can't make it work, no matter what I do.

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}