I have a webpack-dev-server running that compiles and serves some Babel/React code. I have gotten as far as to have it serve the compiled client.js over localhost:3001.
But when I try to include the script in my HTML, I get the following error in Chrome's developer console:
routerWarning.js:19 Uncaught SyntaxError: Unexpected token :
That line belongs to react-router and contains the following code:
process.env.NODE_ENV !== 'production' ? _warning2['default'].apply(undefined, [falseToWarn, message].concat(args)) : undefined;
First, I don't see how that line of code would cause a syntax error. And second, I don't understand how it got in, because this looks like a piece of compiled (babelified) code to me. And finally, I don't know how to fix it! :(
Any help would be greatly appreciated.
I was using webpack's DefinePlugin to set process.env.BABEL_ENV like this:
new DefinePlugin({
'process.env': {
BABEL_ENV: JSON.stringify('client')
}
});
This resulted in webpack replacing all instances of process.env in the code with {"BABEL_ENV":"client"}. The SyntaxError was caused in this part, not in the ternary expression.
I fixed it by setting process.env.BABEL_ENV like this:
new DefinePlugin({
'process.env.BABEL_ENV': JSON.stringify('client')
});
Related
I'm encountering a problem with Tauri plugins (I'm using Tauri 1.2.2).
I've created a basic app with
npx create-tauri-app
with npm as its package manager.
I've left everything the way it was installed, except for the fact that I'm trying to use the Plugin-Log plugin for Tauri.
(https://github.com/tauri-apps/tauri-plugin-log)
To install it, I've added
tauri-plugin-log = { git = "https://github.com/tauri-apps/plugins-workspace", branch = "dev" }
in src-tauri/Cargo.toml, then ran
npm add https://github.com/tauri-apps/tauri-plugin-log
then I updated my main() function in src-tauri/src/main.rs:
use tauri_plugin_log::{LogTarget};
fn main() {
tauri::Builder::default()
.plugin(tauri_plugin_log::Builder::default().targets([
LogTarget::LogDir,
LogTarget::Stdout,
LogTarget::Webview,
]).build())
.invoke_handler(tauri::generate_handler![greet])
.run(tauri::generate_context!())
.expect("error while running tauri application");
}
However, when I attempt to import anything (the line of code below was written inside main.js):
import { trace, info, error, attachConsole } from "tauri-plugin-log-api";
I get the following error:
Uncaught TypeError: Failed to resolve module specifier "tauri-plugin-log-api". Relative references must start with either "/", "./", or "../".
Even imports taken straight from the documentation, such as this one, fail:
import { ask } from '#tauri-apps/api/dialog';
const yes = await ask('Are you sure?', 'Tauri');
and result in the same TypeError:
Uncaught TypeError: Failed to resolve module specifier "#tauri-apps/api/dialog". Relative references must start with either "/", "./", or "../".
despite the fact that I've added the following to tauri.conf.json
{
"tauri": {
"allowlist": {
"dialog": {
"all": true,
"open": true,
"save": true
},
...
}
}
}
The only workaround for the above problem I have found is this:
const { ask } = window.__TAURI__.dialog;
const yes = await ask('Are you sure?', 'Tauri');
which ends up working.
Unfortunately, I remain at a loss trying to use the Plugin-Log described earlier in this post.
I tried using a relative path i.e.
import { trace, info, error, attachConsole } from "../node_modules/tauri-plugin-log-api/dist-js/index.min.js";
but then a new error occurs:
Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.
I even tried reproducing the issue in a fresh VM after installing everything and I end up with the same errors.
Could there be something that I'm missing? Please bear with me as I am a literal Tauri noob.
Thank you in advance for any replies.
I made a proyect with typescript (3.9.3) and Node (10.16.3) code but now I want to uglify the code, parsing it to javascript and executing uglifyJS. So when I did this proccess the services that work before are not working now. I has been debugging the code and I know that the problem is when the process executes this line, most concretly when it try to load express.
var v, m, g = require("fs"), y = e(require("path")), w = e(require("cors")), C = e(require("express")), x = e(require("body-parser"))
The error is the following
TypeError: Cannot read property 'kind' of undefined
Someone knows what is happening here?
Thanks to all.
After a few probes with tsc I solved the problem.
Caution with typescript imports sometimes in transpilation process could be a huge headhache if package.json and tsconfig.json has configuration with incorrect parameters
It's not always obvious from stack trace where error occurred.
So, maybe it's not meaningless to log where error has been thrown.
throw new Error(ErrorsMessagesBuilder.buildErrorMessage({
errorType: ErrorsMessagesBuilder.ErrorsTypes.invalidParameterValue,
functionInvocationExpression: function.name,
description: `Tasks set: '${targetTagsSetID}' is not defined in config file.`
}));
Unfortunately, function.name will be lost because of Webpack code minification. Does Webpack suggest some solutions for it?
I recently started using the eslint module to help clean-up some JavaScript files. The following error is being reported when I lint one of my files:
127:17 error Unexpected alias 'me' for 'this' consistent-this
After checking the documentation, I understand the error is being reported because my code is assigning the value of this to a variable named me instead of that.
What is the proper way to configure my project's .eslintrc.json to make it so the following line of code is not reported as an error: var me = this;?
The rule should be like this in your .eslintrc
{
"rules" : {
"consistent-this": ["error", "me"]
}
}
I recently tried to use the gulp Gist posted here:
Everything builds fine, but in the browser I get an error in the generated templates.js file:
global.Handlebars = require("handlebars");
module.exports = Ember.TEMPLATES["index"] = Ember.Handlebars.template(function anonymous(Handlebars,depth0,helpers,partials,data) {
The error claiming, basically, that 'module' is undefined...
I'm getting a strong feeling that I'm missing something extremely trivial here.
Thanks in advance
Because this causes the file to be wrap in some shim javascript:
'templates': {
path: 'public/js/templates.js',
exports: 'Ember.TEMPLATES'
},
Remove it and you'll be fine.
And requiring Ember in the prebundle is useless if you are also requiring it from your code.