I was wondering how to use a simple function using Symfony + Webpack + Encore.
I have my file accentsDelete.js with :
export default function accentsDelete(string) {
...
}
And in my app.js file :
import accentsDeletefrom './accentsDelete';
But I still get the error when I try to use accentsDelete('éléphant') in my Twig templates :
Uncaught ReferenceError: accentsDeleteis not defined
My Webpack config is almost the original one, do I need to specify a scope or something ?
Related
In some popular NodeJS libraries, e.g. ssh2 or node-pty, there is natively compiled code as part of the library.
Creating the project with
vue create my-project
vue add electron-builder
yarn add ssh2
then importing and using ssh2's Client in the background process results in following errors during
electron:build
ERROR Failed to compile with 1 errors 5:29:10 PM
error in ./node_modules/cpu-features/build/Release/cpufeatures.node
Module parse failed: Unexpected character '�' (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
(Source code omitted for this binary file)
# ./node_modules/cpu-features/lib/index.js 1:16-60
# ./node_modules/ssh2/lib/protocol/constants.js
# ./node_modules/ssh2/lib/client.js
# ./node_modules/ssh2/lib/index.js
...
This error occurs with many other libs or transitive dependencies and the reason for it is absence of native-ext-loader on Webpack chain. I understand why it is not included by default, and I would like to see what is the best way to add it.
One solution I found is this:
Add yarn add -D native-ext-loader (my version is 2.3.0 and electron is at 13.x)
Adjust vue.config.js and add the chainWebpackMainProcess like this:
const path = require('path')
module.exports = {
pluginOptions: {
electronBuilder: {
builderOptions: {
// options placed here will be merged with default
mac: {
target: 'dmg',
icon: 'build/icon.icns',
asar: true
}
},
preload: 'src/preload.ts',
chainWebpackMainProcess(config) {
config.module
.rule("node")
.test(/\.node$/)
.use("native-ext-loader")
.loader("native-ext-loader")
.options(
process.env.NODE_ENV === "development"
? {
rewritePath: path.resolve(__dirname, "native"),
}
: {}
)
}
}
}
}
Both, electron:build and electron:serve are now working and ssh2 client is happily delivering the stdout to renderer via ipcMain. Not sure it is the most elegant way of solving it, though.
I followed https://www.npmjs.com/package/jsonpath. Tried a way to include external js file, but no luck.
import jsonPath worked after -
import * as jsonPath from 'jsonpath/jsonpath';
JsonPath plush also worked JSONPath-plus which is same as of Jsonpath. I have following coding snippet which is working for me-
install JSONPath-plus
npm install jsonpath-plus
angular.json file
"scripts": [
"node_modules/jsonpath-plus/dist/index-umd.js",
"src/assets/js/jsonpath.js"
]
jsonpath.js have following code -
function jsonPath() {
return JSONPath;
}
Now use this function in ts file with declaring it like below -
declare const jsonPath: any;
// use it like
jsonPath().JSONPath(path, json);
I am having trouble with scss module imports when I am running flow check. I have tried out various approaches including
.flowconfig
[options]
module.name_mapper.extension='scss' -> '<PROJECT_ROOT>/flow-typed/stub/css-module.js'
and I have
// #flow
type CSSModule = { [key: string]: string }
const emptyCSSModule: CSSModule = {}
export default emptyCSSModule
in the css-module.js. Do you know why it's happening?
I believe I had a similar issue when trying to use .styl files for stylus.
You might be able to solve this issue by doing the following which had worked for me:
Remove the css-module.js file.
Remove that module.name_mapper.extension line that you have in your .flowconfig
Add the following to the [options] in your .flowconfig:
module.file_ext=.js
module.file_ext=.jsx
module.file_ext=.json
module.file_ext=.scss
I am working on the Angular 2.0-Meteor tutorial and on step 20 "Handling Files with CollectionFS" I am getting an error.
"Cannot find module 'meteor/jalik:ufs'." I have tried removing and adding jalik:ufs and calling meteor reset but this error seems to persist.
I get the error when trying to run the sample code included before Step 21 as well.
It is related with typings. Right now I don't think there is an existing typings for this package.
So you can write your own typings.
Or use the temporary way to remove the warning:
Remove import { UploadFS } from 'meteor/jalik:ufs';. Then add declare const UploadFS: any; in any file.
Tutorial was updated in between:
See Point 21.22 Declare meteor/jalik:
Link
declare module "meteor/jalik:ufs" {
interface Uploader {
start: () => void;
}
interface UploadFS {
Uploader: (options: any) => Uploader;
}
export var UploadFS;
}
I want to use autoprefixer in my node application to compile css.
For my specific needs, I want to call autoprefixer without callback or promise.
Just plain:
var result = autoprefixer.process(css);
or
var result = myPrefixerWrap(css);
I am fighting with this for a while, can you help me please?
ps: I already tried postcss-js, but it result an json object for react use, and not pure css. For example {borderRadius:"5px"}
var prefixer = postcssJs.sync([ autoprefixer ]);
var cssCompiled = postcss.parse(css);
var cssObject = postcssJS.objectify(cssCompiled);
var autoResult = prefixer(cssObject);
PostCSS has an API for synchronously getting the results of Processor#process (process().css, aliased as toString()), which will work as long as all of the PostCSS plugins being used are synchronous (like Autoprefixer). The code to do that is as simple as:
var postcss = require('postcss'); // import postcss from 'posts';
var autoprefixer = require('autoprefixer'); // import autoprefixer from 'autoprefixer';
postcss([autoprefixer]).process(styleString).css;
Note: I had issues with using postcss-js in Webpack, so for those who see errors like:
Module parse failed: /path/to/node_modules/autoprefixer/node_modules/caniuse-db/features-json/css-regions.json Line 2: Unexpected token :
You may need an appropriate loader to handle this file type.
Or:
ERROR in ./~/autoprefixer/~/browserslist/index.js
Module not found: Error: Cannot resolve module 'fs' in /path/to/node_modules/autoprefixer/node_modules/browserslist
# ./~/autoprefixer/~/browserslist/index.js 3:14-27
Check out the Troubleshooting section of the postcss-js GitHub readme to find out what you need to add to your Webpack config to get it working.