reactjs - TypeScript with React typings will not compile -


i tried following setup on typescript page, couple of errors. here files:

tsconfig:

{   "compileroptions": {     "outdir": "../scripts/",     "noimplicitany": false,     "noemitonerror": true,     "removecomments": true,     "sourcemap": true,     "target": "es5",     "jsx": "react",     "lib": [       "es6",       "es5",       "dom"     ]   },   "exclude": [     "node_modules",     "wwwroot",     "scripts"   ] }

package.json:

{   "version": "1.0.0",   "name": "asp.net",   "private": true,   "devdependencies": {     "@types/react": "latest",     "@types/react-dom": "latest",     "typescript": "2.4.2",     "awesome-typescript-loader": "3.2.3",     "source-map-loader": "0.2.1",     "gulp": "3.9.1",     "del": "2.2.2",     "gulp-concat": "2.6.1",     "gulp-sourcemaps": "2.6.0",     "gulp-uglify": "2.1.2",     "@types/jquery": "2.0.41",     "pump": "1.0.2",     "@types/bootstrap": "3.3.33",     "gulp-typescript": "3.1.7",     "@types/knockout": "3.4.41",     "ts-loader": "2.3.2",     "webpack": "3.5.4",     "webpack-stream": "4.0.0"   },   "dependencies": {     "react": "latest",     "react-dom": "latest"   } }

webpack.config.js:

module.exports = {     entry: "./typescripts/index.tsx",     output: {         filename: "bundle.js",         path: __dirname + "/scripts"     },     devtool: "source-map",         resolve: {         extensions: [".ts", ".tsx", ".js", ".json"]     },         module: {         rules: [             { test: /\.tsx?$/, loader: "awesome-typescript-loader" },             { enforce: "pre", test: /\.js$/, loader: "source-map-loader" }         ]     },     externals: {         "react": "react",         "react-dom": "reactdom"     }

my tsx files copy/pasted page linked above.

the first error getting awesome-typescript-loader. 

error in ./typescripts/index.tsx module parse failed: c:\documents\visual studio 2017\projects\devsln\webapplication4\node_modules\awesome-typescript-loader\dist\entry.js!c:\documents\visual studio 2017\projects\devsln\webapplication4\typescripts\index.tsx unexpected token (6:16) may need appropriate loader handle file type. | var reactdom = require("react-dom"); | var hello = require("./hello"); | reactdom.render(<hello.hello compiler="typescript" framework="react"/>, document.getelementbyid("example")); |

this error goes away if switch loader ts-loader, still know if i'm doing wrong.

the second error @types\react type definition. throwing me types of errors. first 1 in list is:

severity    code    description project file    line    suppression state error       build:module '"c:/documents/visual studio 2017/projects/devsln/webapplication4/node_modules/@types/react/index"' has no exported member 'domattributes'.    webapplication4 c:\documents\visual studio 2017\projects\devsln\webapplication4\node_modules\@types\react-dom\index.d.ts    15

this preventing me building solution. using vs2017. appreciated.

don't know if correct answer, works , didn't lose typings. in order fix it, removed "@types/react": "latest" , "@types/react-dom": "latest" packages.json


Comments

Post a Comment

Popular posts from this blog

PHP and MySQL WP -

i trying accomplish 2 things here code. writing php directly wp page using insert php plugin. 1) query mysql database , return results 1 column 4 columns. 2) make each result own hyperlink directs user new wp page runs new query on page. i able query show results , turn results dynamic hyperlink, cannot formatting down. right returns result 1 column. here have: [insert_php] $servername = "localhost"; $username = "login"; //edited privacy $password = "password"; //edited privacy $database = "database"; //edited privacy // create connection $conn = new mysqli($servername, $username, $password, $database); // check connection if ($conn->connect_error) { die("connection failed: " . $conn->connect_error); } echo "connected successfully"; //get results database $result = mysqli_query($conn,"select mine mines order mine"); $all_property = array(); //declare array saving property //showing proper...
Read more

android - InAppBilling registering BroadcastReceiver in AndroidManifest -

i'm implementing inapp billing in android app. works well, however, i'm trying decouple broadcast receiver activity manifest. suggestion in android's trivialdrive sample: // important: dynamically register broadcast messages updated purchases. // register receiver here instead of <receiver> in manifest // because call getpurchases() @ startup, therefore can ignore // broadcasts sent while app isn't running. // note: registering listener in activity bad idea, done here // because sample. regardless, receiver must registered after // iabhelper setup, before first call getpurchases(). currently there's class extends broadcastreceiver : public class iabbroadcastreceiver extends broadcastreceiver { /** * intent action receiver should filter for. */ public static final string action = "com.android.vending.billing.purchases_updated"; private final iabbroadcastlistener mlistener; public iabbroadcastreceiver(iabbroadcastlistener listener) { m...
Read more

go - golang pprof for c library code -

i have been trying profile golang application pprof, seems details of c code(linked static library) missed in output result. flame graph from frame graph can see c code time consuming reported within "runtime._externalcode", no details @ all. , sure static library compiled debug enable. so there way make pprof details(like stack trace) of 3rd party c code? or there other golang profiling tool this?
Read more