I am simply trying to change the root folder name from /app to /src, however, when I do and run npm start I get an error:
fs.js:582
return binding.open(pathModule._makeLong(path), stringToFlags(flags), mode);
^
Error: ENOENT: no such file or directory, open '/Users/colinsygiel/liquidtool/liquid-tool-system-ui/lts-admin/app/index.html'
I went into the index.html and changed the corresponding app to src, yet I continue to get the same error.
I think it has something to do with that it is still trying to look for index.html in the /app, when it should be looking in /src.
If it help, here are my package.json scripts:
"scripts": {
"analyze:clean": "rimraf stats.json",
"preanalyze": "npm run analyze:clean",
"analyze": "node ./internals/scripts/analyze.js",
"extract-intl": "babel-node --presets latest,stage-0 -- ./internals/scripts/extract-intl.js",
"npmcheckversion": "node ./internals/scripts/npmcheckversion.js",
"preinstall": "npm run npmcheckversion",
"postinstall": "npm run build:dll",
"prebuild": "npm run build:clean",
"build": "cross-env NODE_ENV=production webpack --config internals/webpack/webpack.prod.babel.js --color -p --progress",
"build:clean": "npm run test:clean && rimraf ./build",
"build:dll": "node ./internals/scripts/dependencies.js",
"start": "cross-env NODE_ENV=development node server",
"start:tunnel": "cross-env NODE_ENV=development ENABLE_TUNNEL=true node server",
"start:production": "npm run test && npm run build && npm run start:prod",
"start:prod": "cross-env NODE_ENV=production node server",
"presetup": "npm i chalk shelljs",
"setup": "node ./internals/scripts/setup.js",
"postsetup": "npm run build:dll",
"clean": "shjs ./internals/scripts/clean.js",
"clean:all": "npm run analyze:clean && npm run test:clean && npm run build:clean",
"generate": "plop --plopfile internals/generators/index.js",
"lint": "npm run lint:js",
"lint:eslint": "eslint --ignore-path .gitignore --ignore-pattern internals/scripts",
"lint:js": "npm run lint:eslint -- . ",
"lint:staged": "lint-staged",
"pretest": "npm run test:clean && npm run lint",
"test:clean": "rimraf ./coverage",
"test": "cross-env NODE_ENV=test jest --coverage",
"test:watch": "cross-env NODE_ENV=test jest --watchAll",
"coveralls": "cat ./coverage/lcov.info | coveralls"
},
server.js:
const express = require('express');
const logger = require('./logger');
const argv = require('minimist')(process.argv.slice(2));
const setup = require('./middlewares/frontendMiddleware');
const isDev = process.env.NODE_ENV !== 'production';
const ngrok = (isDev && process.env.ENABLE_TUNNEL) || argv.tunnel ? require('ngrok') : false;
const resolve = require('path').resolve;
const app = express();
// If you need a backend, e.g. an API, add your custom backend-specific middleware here
// app.use('/api', myApi);
// In production we need to pass these values in instead of relying on webpack
setup(app, {
outputPath: resolve(process.cwd(), 'build'),
publicPath: '/',
});
// get the intended host and port number, use localhost and port 3000 if not provided
const customHost = argv.host || process.env.HOST;
const host = customHost || null; // Let http.Server use its default IPv6/4 host
const prettyHost = customHost || 'localhost';
const port = argv.port || process.env.PORT || 3001;
// Start your app.
app.listen(port, host, (err) => {
if (err) {
return logger.error(err.message);
}
// Connect to ngrok in dev mode
if (ngrok) {
ngrok.connect(port, (innerErr, url) => {
if (innerErr) {
return logger.error(innerErr);
}
logger.appStarted(port, prettyHost, url);
});
} else {
logger.appStarted(port, prettyHost);
}
});
Related
I am working on the create-react-app project with typescript. I am trying to use _ (lodash) globally. I followed manuals step by step trying to figure out how to do it, but without any success.
I followed this tutorial https://www.npmjs.com/package/customize-cra. My package.json contains between dependecies:
"babel-plugin-transform-decorators-legacy": "^1.3.5",
"react-app-rewired": "^2.1.8",
"save-dev": "^0.0.1-security"
In devDependencies:
"customize-cra": "^1.0.0"
Based on tutorials I changed also scripts:
"scripts": {
"start": "react-app-rewired start",
"build": "react-app-rewired build",
"test": "react-app-rewired test",...
My config-overrides.js is located in root folder:
const { addDecoratorsLegacy, override, disableEsLint } = require('customize-cra')
const webpack = require('webpack')
function myOverrides(config) {
if (!config.plugins) {
config.plugins = []
}
config.plugins.push(
new webpack.ProvidePlugin({
_: 'lodash',
}),
)
return config
}
module.exports = override(
addDecoratorsLegacy(),
disableEsLint(),
myOverrides
)
I try to use join(['Hello', 'webpack'], ' ') but failed with error.
TypeScript error in C:/Users/.../webapp/src/index.tsx(27,1): Cannot find name 'join'. TS2304
Does anybody have any idea what should go wrong?
Thank you.
I have developed one app using angular 6. now I want to make Build Desktop Apps With Electron. I have followed all the steps to make a build. when I run 'npm run electron-build' it makes a build & displays me empty white window it shows nothing. I don't even understand what is the problem.
Thank you in advance.
// main.js
const { app, BrowserWindow } = require('electron')
let win;
function createWindow () {
win = new BrowserWindow({
width: 600,
height: 600,
backgroundColor: '#ffffff',
icon: `file://${__dirname}/dist/assets/logo.png`
})
win.loadURL(`file://${__dirname}/dist/index.html`)
win.on('closed', function () {
win = null
})
}
app.on('ready', createWindow)
app.on('window-all-closed', function () {
if (process.platform !== 'darwin') {
app.quit()
}
})
app.on('activate', function () {
if (win === null) {
createWindow()
}
})
// package.json
"name": "demo-electron",
"version": "0.0.0",
"main": "main.js",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"electron": "electron .",
"electron-build": "ng build --prod && electron ."
}
index.html
<base href="./">
I have created a main.js, made changes in the index.html & package.json.
System configuration
OS: Linux x64 (Ubuntu 16),
node 8.11.1
Angular CLI: 6.2.9
Angular: 6.1.10.
Try checking your index.html location in the dist folder and update the win.loadurl path accordingly. Worked for me
use below commands
1) npm install nw --nwjs_build_type=sdk
if above command not worked
2)yarn add --dev nw#0.23.6-sdk-1
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "webpack-dev-server --mode development --open --progress --config webpack.dev.config.js",
"build": "webpack --progress --mode production --config webpack.prod.config.js"
},
module.exports = ({env}) => ({
plugins: {
'cssnano': env === 'production' ? {} : false
}
});
when I run "npm run build", the env is always "development",so the "cssnano" doesn't run.
How to let the postcss knows that I'm in the "production"?
Try
module.exports = (env, argv) => ({
…
plugins: {
'cssnano': argv.mode === 'production' ? {} : false
}
…
Does this help?
"build": "NODE_ENV=production webpack --progress --mode production --config webpack.prod.config.js"
I have this package.json script:
"scripts": {
"build": "nwb build-react-component",
"clean": "nwb clean-module && nwb clean-demo",
"start": "nwb serve-react-demo --host 127.0.0.1 --port 3000",
"test": "nwb test-react",
"test:coverage": "nwb test-react --coverage",
"test:watch": "nwb test-react --server"
},
If i use npm start this rune me server at http://127.0.0.1:3000
How i can run https?
I try HTTPS=true npm start
but its not working :(
Please help
You can do this via devServer.https configuration, either in your nwb.config.js module…
{
devServer: {
https: true
}
}
…or via the CLI:
nwb serve-react-demo --devServer.https
config in nwb.config.js
module.exports = {
devServer: {
host: "sso-admin-presit.hktdc.com",
port: 443,
https: true
},
}
I am using Gulp to start a web application. I have the following basic code for my gulpfile.js:
var gulp = require('gulp'),
nodemon = require('gulp-nodemon');
gulp.task('default', function () {
nodemon({
script: 'server.js'
, ext: 'js html'
, env: { 'NODE_ENV': 'development' }
})
})
Using Gulp, I want to check for dependencies and if they are not available then install them and then run 'script.js'. How can this be done?
I have the following package.json:
{
"name": "sample-project",
"version": "1.0.0",
"description": "Displays users and user details",
"main": "server.js",
"dependencies": {
"jquery" : “>=1.5.1",
“bootstrap”: ">= 3.0.0”
}
"directories": {
"test": "test"
},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "node server.js"
},
"author": "Arihant Jain",
"license": "ISC"
}
You can run npm install independently from an executing task using node's child_process as such:
var gulp = require('gulp');
var nodemon = require('gulp-nodemon');
var child_process = require('child_process');
gulp.task('default', function () {
// Run npm install from the child process
child_process.exe('npm install', function(err, stdout, stderr){
// if everything goes well
if(!err){
// run nodemon
nodemon({
script: 'server.js'
, ext: 'js html'
, env: { 'NODE_ENV': 'development' }
})
}
});
})
Given your requirement:
Using Gulp, I want to check for dependencies and if they are not
available then install them...
That is exactly what npm install does. It checks the local package.json and proceeds to install missing packages.
So, I worked it around in a way by using gulp-run. I actually run the command npm install.
gulpfile looks like this:
var gulp = require('gulp'),
nodemon = require('gulp-nodemon')
run = require('gulp-run')
runSequence = require('run-sequence')
open = require('gulp-open');
gulp.task('default', function() {
runSequence('dependencies',
'start',
'uri');
});
gulp.task('dependencies', function() {
return run('npm install').exec();
})
gulp.task('uri', function(){
gulp.src(__filename)
.pipe(open({uri: 'http://localhost:3000/index.html'}));
});
gulp.task('start', function () {
nodemon({
script: 'server.js'
, ext: 'js html'
, env: { 'NODE_ENV': 'development' }
})
})