Is it possible to reference local files within an npm package? Will these references still work correctly when the package is installed by a different consumer? For example, let's say I have developed an npm package for Angular which includes some HTML and CSS files from a third party not using Angular packages. During the package publish, I ensure that these files are copied to `...dist\thirdparty`. Now, I want to access these files in my package using relative paths or other methods.
For instance,
@Component({
selector: 'ng2-my-library',
template: '<div></div>'
})
export class MyLibraryComponent {
.....
var newWindowUrl = "./thirdparty/some.html"; **// Need to find the location of some.html relatively here**
window.open(newWindowUrl);
.....
}
Once I install `my-package` in a sample Angular application, the above code results in `"localhost:3000/thirdparty/some.html"`, which is incorrect.
How can I resolve this issue?
Upon installing my package, the structure for the consumer would look like this:
consumerApp
node_modules(Folder)
ng2-my-library(Folder)
ng2-pdfjs-viewer.umd.js // This is where I need to access some.html
thirdparty(Folder)
some.htmlI have considered advising consumers to use instructions like the following, but this would rely heavily on other build tools to copy or redirect the HTML, which is not ideal:
var TransferWebpackPlugin = require('transfer-webpack-plugin');
...
plugins: [
new TransferWebpackPlugin([
{ from: 'node_modules/my-package/assets', to: path.join(__dirname, 'my/public') }
])
]
I also attempted to utilize the package mentioned below, but it did not yield accurate results for HTML content: https://www.npmjs.com/package/static-reference