angular2 app cpexcel not found #453

New Issue

2016-08-10T20:59:30Z

Adtiv commented

2016-08-10 20:59:30 +00:00

(Migrated from github.com)

getting a 404 error for cpexcel.js and fs.js in my Anuglar2 app using the Angular2 cli. I can see cpexcel in my vendor folder but for some reason its not finding it. I downloaded the library through npm

👍 1

tonymk commented

2016-09-02 12:14:34 +00:00

(Migrated from github.com)

I got the same error, have not found a work around yet :/

Adtiv commented

2016-09-02 18:16:27 +00:00

(Migrated from github.com)

I've been using the library by including the cdn files in index.html

👍 1 😕 1

paustint commented

2017-01-05 04:34:15 +00:00

(Migrated from github.com)

I am having the same issue. I am using Typescript and I really liked having the typings available, but this is not possible to use because importing the typings will automatically import the library. Very annoying to jump through all these hoops when most libraries are very easy to include into a an A2 project.

Here is how I solved:

In angular-cli.json, I added the following:

      "scripts": [
        "../node_modules/xlsx/dist/xlsx.core.min.js"
      ],

Then I copied the typings index.ds.t (from @types/xlsx) file contents into my project.

From here, I was able to use by importing the following:

declare var XLSX: any;
import { ICell, IWorkBook, IWorkSheet, IWorkSheetCell, IRange } from './models/XLSX.models';

Then here is an example function from one of my Angular 2 services to create a worksheet:

  createSheetFromNestedArrays(header: any[], data: any[][], options?: {offsetRows?: number, offsetCols?: number}): IWorkSheet {
    let ws: IWorkSheet = {};
    const offsetRows = options && options.offsetRows ? options.offsetRows : 0;
    const offsetCols = options && options.offsetCols ? options.offsetCols : 0;
    let endRow = offsetRows;
    let endCol = 0;
    const startCol = offsetCols;
    let currRow = offsetRows;
    let currCol = startCol;
    var range: IRange = {s: {c:currCol, r:currRow}, e: {c:0, r:0 }};
    let maxCols: number[] = [];

    header.forEach(headerVal => {
      this.addCellToWs({c: currCol, r: currRow}, headerVal, ws);
      currCol ++;
    });
    // Increment row
    currRow ++;
    // reset column
    currCol = startCol;
    // Complete body
    data.forEach(rowArray => {
      rowArray.forEach(colData => {
        this.addCellToWs({c: currCol, r: currRow}, colData, ws);
        currCol ++;
        endRow ++;
      });
      currRow ++;
      maxCols.push(currCol);
      currCol = startCol;
    });
    range.e.r = endRow;
    range.e.c = Math.max(...maxCols);
    this.log.debug('ws', ws);
    this.log.debug('range', range);
    ws['!ref'] = XLSX.utils.encode_range(range);
    return ws;
  }

I am having the same issue. I am using Typescript and I really liked having the typings available, but this is not possible to use because importing the typings will automatically import the library. Very annoying to jump through all these hoops when most libraries are very easy to include into a an A2 project. ### Here is how I solved: In angular-cli.json, I added the following: ``` "scripts": [ "../node_modules/xlsx/dist/xlsx.core.min.js" ], ``` Then I copied the typings index.ds.t (from `@types/xlsx`) file contents into my project. From here, I was able to use by importing the following: ``` declare var XLSX: any; import { ICell, IWorkBook, IWorkSheet, IWorkSheetCell, IRange } from './models/XLSX.models'; ``` Then here is an example function from one of my Angular 2 services to create a worksheet: ``` createSheetFromNestedArrays(header: any[], data: any[][], options?: {offsetRows?: number, offsetCols?: number}): IWorkSheet { let ws: IWorkSheet = {}; const offsetRows = options && options.offsetRows ? options.offsetRows : 0; const offsetCols = options && options.offsetCols ? options.offsetCols : 0; let endRow = offsetRows; let endCol = 0; const startCol = offsetCols; let currRow = offsetRows; let currCol = startCol; var range: IRange = {s: {c:currCol, r:currRow}, e: {c:0, r:0 }}; let maxCols: number[] = []; header.forEach(headerVal => { this.addCellToWs({c: currCol, r: currRow}, headerVal, ws); currCol ++; }); // Increment row currRow ++; // reset column currCol = startCol; // Complete body data.forEach(rowArray => { rowArray.forEach(colData => { this.addCellToWs({c: currCol, r: currRow}, colData, ws); currCol ++; endRow ++; }); currRow ++; maxCols.push(currCol); currCol = startCol; }); range.e.r = endRow; range.e.c = Math.max(...maxCols); this.log.debug('ws', ws); this.log.debug('range', range); ws['!ref'] = XLSX.utils.encode_range(range); return ws; } ```

SheetJSDev commented

2017-03-23 17:13:04 +00:00

(Migrated from github.com)

The current recommendation is to use the minified files in the dist directory. We will be adding a demo shortly

SheetJSDev commented

2017-03-23 17:14:20 +00:00

(Migrated from github.com)

@paustint would it be easier to split off the definitions to something outside the module? I think there are DT defs but I cannot speak to the quality

Sign in to join this conversation.