This repository was archived by the owner on Apr 13, 2022. It is now read-only.
Angular build cannot resolve '../package' and 'child_process' #152
Description
angular-cli is reporting "Can't resolve" errors when building Angular application which uses solid-client.
One of the errors is pointing to this repository and second one points to a XMLHttpRequest - dependency used by rdflib.
Error message
ERROR in ./~/solid-client/lib/meta.js
Module not found: Error: Can't resolve '../package' in '/data2/space/angular-testing/angular-solid-client/node_modules/solid-client/lib'
@ ./~/solid-client/lib/meta.js 7:10-31
@ ./~/solid-client/lib/index.js
@ ./src/app/app.component.ts
@ ./src/app/app.module.ts
@ ./src/main.ts
@ multi ./src/main.ts
ERROR in ./~/xmlhttprequest/lib/XMLHttpRequest.js
Module not found: Error: Can't resolve 'child_process' in '/data2/space/angular-testing/angular-solid-client/node_modules/xmlhttprequest/lib'
@ ./~/xmlhttprequest/lib/XMLHttpRequest.js 15:12-36
@ ./~/rdflib/lib/util.js
@ ./~/rdflib/lib/index.js
@ ./~/solid-client/lib/util/rdf-parser.js
@ ./~/solid-client/lib/index.js
@ ./src/app/app.component.ts
@ ./src/app/app.module.ts
@ ./src/main.ts
@ multi ./src/main.tsInformation
solid-client: 0.24.3
# ng version
@angular/cli: 1.2.1
node: 8.1.2
os: linux x64
@angular/animations: 4.3.0
@angular/common: 4.3.0
@angular/compiler: 4.3.0
@angular/core: 4.3.0
@angular/forms: 4.3.0
@angular/http: 4.3.0
@angular/platform-browser: 4.3.0
@angular/platform-browser-dynamic: 4.3.0
@angular/router: 4.3.0
@angular/cli: 1.2.1
@angular/compiler-cli: 4.3.0
@angular/language-service: 4.3.0How to reproduce (assuming angular-cli is properly installed):
create new angular app and enter its directory
ng new angular-solid-client
cd angular-solid-clientinstall solid-client
npm install --save solid-clientadd lib import and usage into file: src/app/app.component.ts
import { Component } from '@angular/core';
import * as SolidClient from 'solid-client'; // import
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'app';
solid = SolidClient; // using SolidClient
}run ng build
Or you can clone my seed repo in tag v0.1.0:
git clone https://github.com/tomasklapka/angular-solid-client-seed test
cd test
git checkout tags/v0.1.0
npm install
ng buildWorkaround
'../package' resolve error can be fixed simply by adding ".json" extension to a filename required in node_modules/solid-client/lib/meta.js:7.
Change:
var lib = require('../package');to
var lib = require('../package.json');'child_process' error is caused by removed package replaced by empty nameholder. This module seems to be required only for synchronous calls but since it is empty it should be safe to just comment 'spawn' require in xmlhttprequest/lib/XMLHttpRequest.js:15.
Change:
var spawn = require("child_process").spawn;so it looks like this
var spawn; // = require("child_process").spawn;
Activity
dmitrizagidulin commentedon Jul 18, 2017
Hi Tomáš,
Part of the issue here is that this is meant to be an isomorphic library (able to be used either in the browser or in Node.js), and so the build step has to substitute node-only libraries for browser equivalents. Basically, you need to add an "ignore" list to whatever build tool you're using, Browserify or Webpack etc. For example, if you're using Webpack, you should add the following items to the
externalssection:tomasklapka commentedon Jul 20, 2017
I see. Thank you Dmitri.
It's weird that angular-cli does not allow to change webpack's configuration by design (angular/angular-cli#1656).
To change the webpack config it is possible to avoid serving through angular-cli: Run
ng ejectto get the config file and then usenpm run build & npm run startinstead ofng serve(see answer https://stackoverflow.com/a/42406194/883894)