Skip to content

"Could not load TypeScript. Try installing with npm install -g typescript" #35

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
ldminoc opened this issue Aug 26, 2015 · 24 comments
Closed

Comments

@ldminoc
Copy link

ldminoc commented Aug 26, 2015

I updated to 0.5.2 from 0.5.0 this morning but still seem to be having the same issue although the new error message is less useful for problem identification. After receiving the error message, I updated typescript to the latest nightly build using 'npm install -g typescript@next'.

Any insights would be appreciated.

Here's my webpack.config.js:

'use strict';

var webpack = require('webpack');
var WebpackNotifierPlugin = require('webpack-notifier');

module.exports = {
  entry: './server/server.ts',
  output: {
    path: './build/',
    filename: 'server.js'
  },
  plugins: [
    new webpack.optimize.OccurenceOrderPlugin(),
    new WebpackNotifierPlugin()
  ],
  resolve: {
    extensions: ['', '.webpack.js', '.web.js', '.js', '.jsx', '.ts', '.tsx']
  },
  module: {
    loaders: [
      {
        test: /\.jsx$/,
        exclude: ['./node_modules/'],
        loader: 'babel-loader'
      },
      {
        test: /\.ts(x?)$/,
        exclude: ['./node_modules/'],
        loader: 'ts-loader'
      }
    ]
  }
};

And here is the tsconfig.js:

{
    "compilerOptions": {
        "module": "commonjs",
        "noImplicitAny": true,
        "removeComments": true,
        "preserveConstEnums": true,
        "target": "ES5",
        "sourceMap": true
    }
}

With 0.5.0, the error message was:
ERROR in ./server/server.ts

Module build failed: Error: Cannot find module 'typescript'
at Function.Module._resolveFilename (module.js:336:15)
at Function.Module._load (module.js:278:25)
at Module.require (module.js:365:17)
at require (module.js:384:17)
at ensureTypeScriptInstance (partial path elided .../node_modules/ts-loader/index.js:69:20)
at Object.loader (partial path elided .../node_modules/ts-loader/index.js:228:14)

@jbrantly
Copy link
Member

In both cases it just means that node can't resolve typescript for some reason. Usually if you have it installed globally it will "just work", which is why there is the new message in 0.5.2. You could try installing locally. Go to your project root and use npm install typescript. Maybe there is some weird configuration that is preventing node from being able to resolve typescript globally. I've run into weird resolution issues in the past on Windows with older versions of node. Maybe try updating node and npm if the local install doesn't work.

@ldminoc
Copy link
Author

ldminoc commented Aug 26, 2015

Wow impressive response time!
Your suggestion of installing typescript locally works, but it does not feel like a very satisfying solution ;-).
I'm running node v0.12.6, npm 2.11.2 on a mac so have no idea what the issue is.
Thanks for the help.

@jbrantly
Copy link
Member

It's possible I should change the messaging to "Please install using npm install typescript" instead based on this. In any case, glad it's working for you.

@ldminoc
Copy link
Author

ldminoc commented Aug 27, 2015

Sorry, should have closed this earlier.

@ldminoc ldminoc closed this as completed Aug 27, 2015
@jbrantly
Copy link
Member

No worries :)

@jbrantly
Copy link
Member

jbrantly commented Sep 1, 2015

FYI, I changed the message in the latest release to no longer have the -g flag.

@OldrichDlouhy
Copy link

Another approach that worked for me is to install typescript globally (npm install -g typescript) and then link to it from the local folder (npm link typescript).

@jbrantly
Copy link
Member

jbrantly commented Oct 6, 2015

Just for documentation purposes: The preferGlobal flag was removed in TS 1.6.

@slavovojacek
Copy link

@OldrichDlouhy linking through npm link typescript works perfectly, thanks!

@ArgTang
Copy link

ArgTang commented Dec 19, 2015

@jbrantly
I found the link option that is suggested as a noce solution thats more elegant, when typescript is installed globally. maybe change the message again to reflect this?

@jbrantly
Copy link
Member

@ArgTang sure, sounds good.

@jbrantly
Copy link
Member

Resolved in #127

@jbrantly
Copy link
Member

Published in v0.8.0

@uglycoyote
Copy link

uglycoyote commented May 24, 2017

It does not seem resolved at all. I still get this issue.

Attempted to resolve the problem using the prescribed methods in the error message (npm install typescript and npm link typescript) neither of these got rid of the problem.

awesome-typescript-loader does not have this issue. Switching to the alternative.

@plandem
Copy link

plandem commented Jul 5, 2017

same issue here. after install of any module via npm install I have to re-run npm link typescript

@johnnyreilly
Copy link
Member

I'd be very interested to see your repo - do you have one you can share?

@plandem
Copy link

plandem commented Jul 6, 2017

not sure how repo will helps. here are files:

package.json

{
  "name": "catapult",
  "version": "1.0.0",
  "description": "",
  "dependencies": {
    "antd": "^2.11.2",
    "babel-register": "^6.24.1",
    "firebase": "^4.1.3",
    "lodash": "^4.17.4",
    "polyglot": "^0.5.0",
    "react": "^15.6.1",
    "react-dom": "^15.6.1",
    "react-redux": "^5.0.5",
    "redux": "^3.7.1",
    "redux-multi": "^0.1.12",
    "redux-thunk": "^2.2.0",
    "type-to-reducer": "^1.0.3"
  },
  "devDependencies": {
    "@types/react": "^15.0.34",
    "@types/react-dom": "^15.5.1",
    "babel-loader": "^7.1.1",
    "babel-plugin-import": "^1.2.1",
    "babel-plugin-lodash": "^3.2.11",
    "babel-plugin-minify-dead-code-elimination": "^0.1.7",
    "babel-plugin-module-resolver": "^2.7.1",
    "babel-preset-electron": "^1.4.15",
    "cross-env": "^5.0.1",
    "css-loader": "^0.28.4",
    "electron": "1.6.11",
    "env-cmd": "^5.1.0",
    "extract-text-webpack-plugin": "^2.1.2",
    "file-loader": "^0.11.2",
    "less": "^2.7.2",
    "less-loader": "^4.0.4",
    "react-hot-loader": "^3.0.0-beta.7",
    "ts-loader": "^2.2.2",
    "uglify-es": "git://github.com/mishoo/UglifyJS2.git#harmony",
    "uglifyjs-webpack-plugin": "^0.4.6",
    "webpack": "^3.0.0",
    "webpack-bundle-tracker": "^0.2.0",
    "webpack-dev-server": "^2.5.0"
  },
  "scripts": {
    "build:desktop": "env-cmd ./env/prod.json tsc -p ./src/desktop",
    "build:web": "env-cmd ./env/prod.json webpack",
    "start": "npm run build:desktop && npm run start:desktop",
    "start:desktop": "env-cmd ./env/dev.json electron -r babel-register ./dist/desktop/main.js",
    "start:web": "env-cmd ./env/dev.json webpack-dev-server"
  },
  "author": "",
  "license": "ISC"
}

webpack.config.js

const webpack = require('webpack');
const path = require('path');
const ExtractTextPlugin = require('extract-text-webpack-plugin');

const config = {
	entry: {
		app: './src/web/index.tsx',
		common: [
			'react',
			'react-dom',
			'moment',
			'lodash',
			'react-redux',
			'redux',
			// 'polyglot',
		],
		ui: 'antd',
		// "locale-ru": './src/web/i18n/ru.js',
		// "locale-en": './src/web/i18n/en.js',
	},

	output: {
		filename: './[name].js',
		path: path.resolve(__dirname, 'dist/web'),
		publicPath: '/'
	},

	devServer: {
		hot: true,
		contentBase: path.resolve(__dirname, 'dist/web'),
		publicPath: '/',
		port: 8001,
		stats: { modules:false }
	},

	resolve: {
		extensions: ['.ts', '.tsx', '.js', '.jsx'],
		alias: {
			web: process.cwd() + '/src/web',
			shared: process.cwd() + '/src/shared',
		},
	},
	module: {
		rules: [
			{ test: /\.tsx?$/, use: 'ts-loader'},
			{ test: /\.html?$/, use: { loader: 'file-loader', query: { name: '[name].[ext]'}}},
			{ test: /\.less$/i, use: ExtractTextPlugin.extract([ 'css-loader', 'less-loader' ])},
		]
	},
	plugins: [
		new ExtractTextPlugin('app.css'),
		new webpack.optimize.CommonsChunkPlugin({
			names: ['common', 'ui'],
			minChunks: Infinity,
		}),
	],
};

if (process.env.NODE_ENV === 'production') {
	config.devtool = false;
	config.plugins.push(new webpack.LoaderOptionsPlugin({
		minimize: true,
		debug: false
	}));
	config.plugins.push(new webpack.optimize.OccurrenceOrderPlugin());
	config.plugins.push(new webpack.optimize.UglifyJsPlugin({
		compress: {
			warnings: false,
			screw_ie8: true,
			conditionals: true,
			unused: true,
			comparisons: true,
			sequences: true,
			dead_code: true,
			evaluate: true,
			if_return: true,
			join_vars: true,
		},
		output: {
			comments: false,
		},
	}));
} else {
	config.plugins.push(new webpack.HotModuleReplacementPlugin());
}

module.exports = config;

and here is tsconfig.json:

{
  "compilerOptions": {
    "jsx": "react",
    "outDir": "../../dist/web",
    "paths": {
      "web/*": ["../web/*"],
      "shared/*": ["../shared/*"]
    }
  },
  "extends": "../../tsconfig.base"
}

tsconfig.base.json

{
  "compilerOptions": {
    "target": "es6",
    "module": "es6",
    "moduleResolution": "node",
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true,
    "allowJs": true,
    "strictNullChecks": true,
    "noImplicitAny": false,
    "allowSyntheticDefaultImports": true,
    "baseUrl": "src"
  },
  "exclude": [
    "node_modules"
  ]
}

@johnnyreilly
Copy link
Member

You don't seem to have TypeScript installed as a devDependency?

@plandem
Copy link

plandem commented Jul 6, 2017

@johnnyreilly yep, it installed globally. As I wrote - after any npm install I have to link it again :(

@johnnyreilly
Copy link
Member

Install it as a devDependency and you shouldn't have an issue. That's how I use it.

@johnnyreilly
Copy link
Member

I'm not sure why it wouldn't pick up the global - this could be something to do with your path?

@plandem
Copy link

plandem commented Jul 6, 2017

@johnnyreilly of course I can install everything as local, but I would prefer to use globals for common things like webpack, typescript and etc.

@plandem
Copy link

plandem commented Jul 6, 2017

@johnnyreilly I don't know why, but as I said - after any npm install (e.g. added a new package), I'm getting this error and have to link typescript.

@P0oOOOo0YA
Copy link

P0oOOOo0YA commented Aug 15, 2018

linking with npm is not a solution, i have typescript and electron globally installed by npm in /usr/lib/node_modules and in the tsconfig.json basedir is set to it. Running tsc works without complainig about paths. To use ts-loader i need to symlink everything installed globally. :(

tsc --version
Version 2.9.2

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

9 participants