Within this query, there are three distinct meanings for the term "module", so feel free to seek clarification if needed.
I am dealing with a TypeScript project that heavily relies on a node_module which I want to modify. To achieve this, I have replicated the source code of this dependency as a Git submodule. Notably, this dependency is also constructed using TypeScript.
The layout of my directories is structured as such:
root/
- source/
- app.tsx (my starting point)
- ...
- vendor/
- dependency/ (git submodule)
- node_modules/
- (dependencies of the dependency)
- source/
- index.ts
- ...
- package.json
- tsconfig.json
- webpack.config.js
- tsconfig.json
- package.json
The file
root/source/vendor/dependency/source/index.tsMy objectives are:
- To be able to refer to my dependency in my .ts files as if it still were a node_module dependency (e.g.
.import { class1, class2 } from "dependency" - To configure webpack to bundle my dependency together with my project
I am encountering challenges primarily with the first objective. I am struggling to make tsc recognize the module name "dependency".
I suspect the issue lies within my tsconfig.json configuration – yet, the resolution eludes me. Despite setting baseUrl and paths to what I believed would suffice, the compiler continues to report being unable to locate the module.
Details of my current tsconfig.json
{
"compileOnSave": false,
"compilerOptions": {
"target": "es5",
"module": "commonjs",
"isolatedModules": false,
"jsx": "react",
"experimentalDecorators": true,
"emitDecoratorMetadata": true,
"declaration": false,
"noImplicitAny": false,
"sourceMap": true,
"removeComments": true,
"noLib": false,
"preserveConstEnums": false,
"suppressImplicitAnyIndexErrors": true,
"outDir": "./lib",
"types": [
"es6-promise",
"google.analytics"
],
"baseUrl": ".",
"paths": {
"dependency": "vendor/dependency/source/index.ts"
}
},
"exclude": [
"**/node_modules",
"vendor/dependency/node_modules/"
]
}
Information from my current webpack.config.js
var path = require("path");
var tsConfigPath = path.resolve("tsconfig.json");
module.exports = {
devtool: "source-map",
entry: {
web: path.resolve(path.join("source", "app.tsx"))
},
resolve: {
extensions: [".ts", ".tsx", ".js", ".scss"],
modules: [
"node_modules",
"vendor"
]
},
output: {
path: path.resolve(path.join("proxy", "static")),
filename: "[name]/[name].js",
publicPath: "/"
},
module: {
rules: [
{
test: /\.tsx?$/,
loader: "awesome-typescript-loader"
},
{
test: /\.scss$/,
loaders: ["style-loader", "css-loader", "sass-loader"]
},
{ // Re-process any sourcemaps for all '.js' files.
enforce: "pre",
test: /\.js$/,
loader: "source-map-loader"
}
]
},
plugins: [
require("webpack-fail-plugin")
],
externals: {
"react": "React",
"react-dom": "ReactDOM"
}
};
If I'm approaching this incorrectly, kindly inform me...all I desire is to amend my local dependency without necessitating its release on npm.