Closed pandreason closed 6 years ago
pandreason
commented
7 years ago I have resolved the issue by forcing a clean checkout on the build server. I would still like to know if there is any explanation as to why the postcss-loader in the general webpack config provided by angular-cli was failing.
alexandre-tobia
commented
7 years ago @pandreason Hi, what do you mean by "forcing a clean checkout", i'm encountering the same issue actually.
Thanks
nudemeth
commented
7 years ago Hi
I'm not using ng but now I'm facing this issue as well. I've found that it is from postcss-merge-rules v2.1.x. You can fall back to v2.0.x to avoid the issue until it gets fixed.
Hope it helps!
pandreason
commented
7 years ago @Steingate Team City has the idea of a clean checkout. This enforces a delete of the working directory and a clone of the repository, instead of a pull, ensuring that there are no artifacts of the build, such as the node_modules folder and contents. In addition to this being configurable on the Team City build definition, Team City will occasionally do this on its own, if the delta between the branch currently in the working directory and the branch being pulled is significant. A clean build can also be requested by the user by navigating to the build agent(s) assigned to the build definition and selecting "Clean sources on this agent" under Agent Summary > Miscellaneous.
I hope this helps,
Cheers
nudemeth
commented
7 years ago According to a description on Browserslist, it will try to search a query from browserslist config file.
Browserslist will use browsers query from one of this sources:
- Tool options. For example browsers option in Autoprefixer.
- BROWSERSLIST environment variable.
- browserslist config file in current or parent directories.
- browserslist key in package.json file in current or parent directories.
- If the above methods did not produce a valid result Browserslist will use defaults: > 1%, last 2 versions, Firefox ESR.
I'm not sure for this part but when installing browserlist module via npm on Windows, it seems that it generates the file named browserlist (no extension) along with browserlist.cmd. That means if your working directory is in the same or a child folder that browserlist file exists, it will try to read the configuration from the file which is invalid.
To avoid this:
You may not be using this module directly but it may be a dependency of other modules such as autoprefixer, caniuse-api, postcss-merge-rules, etc.
filipesilva
commented
7 years ago Nice job tracking down the cause. I can't repro this myself though. If there's a dependency we can upgrade here to fix this let me know.
mfoitzik
commented
7 years ago @nudemeth you just saved me from 24 hours of getting nowhere. I am a newbie following vue.js (I know it is not angular, but I landed on this page from searching for solutions) installation guidelines and was experiencing an error on a Windows 7 machine (although I was getting things to wok fine on a Windows 10 machine). The key error I received and was searching on was: Module build failed: BrowserslistError: Unknown browser query basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
filipesilva
commented
7 years ago Thanks for reporting this issue. This issue is now obsolete due to changes in the recent releases. Please update to the most recent Angular CLI version.
If the problem persists after upgrading, please open a new issue, provide a simple repository reproducing the problem, and describe the difference between the expected and current behavior.
vageesans
commented
7 years ago @filipesilva, I still face the same issue when I try to setup using angular cli.
I followed the steps angular.io to setup angular4.
But ng serve throws "Unknown browser query basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")"
Note: I get an error after ng new project_name > cd project_name > ng -v
@angular/cli: 1.2.1 node: 6.11.1 os: win32 x64 @angular/animations: error @angular/common: error @angular/compiler: error @angular/core: error @angular/forms: error @angular/http: error @angular/platform-browser: error @angular/platform-browser-dynamic: error @angular/router: error @angular/cli: error @angular/compiler-cli: error @angular/language-service: error
Hence I ran npm install which sets up @angular/cli: 1.2.1 node: 6.11.1 os: win32 x64 @angular/animations: 4.3.0-rc.0 @angular/common: 4.3.0-rc.0 @angular/compiler: 4.3.0-rc.0 @angular/core: 4.3.0-rc.0 @angular/forms: 4.3.0-rc.0 @angular/http: 4.3.0-rc.0 @angular/platform-browser: 4.3.0-rc.0 @angular/platform-browser-dynamic: 4.3.0-rc.0 @angular/router: 4.3.0-rc.0 @angular/cli: 1.2.1 @angular/compiler-cli: 4.3.0-rc.0 @angular/language-service: 4.3.0
but ng serve --open throws error "Unknown browser query basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")"
papiermache
commented
7 years ago ditto - just installed latest cli, created an app as per: http://codingthesmartway.com/angular-4-3-httpclient-accessing-rest-web-services-with-angular/ , get above error "unknown browser query"
filipesilva
commented
7 years ago Reopening for investigation.
papiermache
commented
7 years ago update - deleted 'browserlist' and 'browserlist.cmd' scripts that npm created in my root folder, problem is resolved.
masaanli
commented
7 years ago Got the same error and can confirm that removing the 'browserlist' and 'browserlist.cmd' has worked.
sreejithsrk
commented
7 years ago Just delete the "browserlist" (text file) from project directory, and also delete "browserlist.cmd" file. (it worked for me)
BabiShreema
commented
7 years ago I also got the same error and can confirm that removing the 'browserlist' and 'browserlist.cmd' has worked. Thanks for the solution
gnsalok
commented
6 years ago Yes, it's resolving the issue by deleting the both file ie. browserlist and browerlist.cmd
bcharfi
commented
6 years ago I got the same error, but in my project directory i don't have the 'browserlist' and 'browserlist.cmd' file. I use :
hmozaffari
commented
6 years ago Another way is to set BROWSERSLIST environment variable before running the build. Then it takes what is set there instead of browswerlist file. For example: SET BROWSERSLIST=last 2 versions
kdubious
commented
6 years ago I don't have those files in the root, but I do have them in \node_modules.bin\ @hmozaffari, where would I put "SET BROWSERSLIST=last 2 versions" in an Angular 5.x project on Windows?
hmozaffari
commented
6 years ago @kdubious, BROWSERSLIST is an environment variable. Simply execute "SET BROWSERSLIST=last 2 versions" before running your command in your batch file or set this environment variable in Windows environment.
levarberry
commented
6 years ago set needs to be lowercase
akinhwan
commented
6 years ago Does anyone know why browserlist and browserlist.cmd cause the module build error when npm run dev ? Im fine with deleting but just wondering why it comes in vue init webpack
babelshift
commented
6 years ago So why is this happening? I confirmed that deleting browserslist and browserslist.cmd from node_modules\.bin solved the issue.
ng build --prod results in:
BrowserslistError: Unknown browser query `basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")`@angular/cli: 1.5.0
@angular-devkit/build-optimizer: 0.0.32
@angular-devkit/core: 0.0.20
@angular-devkit/schematics: 0.0.35
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.8.0
@schematics/angular: 0.1.2
typescript: 2.3.4
webpack: 3.8.1
krearthur
commented
6 years ago I can confirm that deleting browserlist and browserlist.cmd from
node_modules\.bin does NOT solve the issue in my newly created ng app.
ng serve results in:
ERROR in ./~/css-loader?{"sourceMap":false,"importLoaders":1}!./~/postcss-loader?{"ident":"postcss"}!./~/bootstrap/dist/css/bootstrap.min.css
Module build failed: BrowserslistError: Unknown browser query `>= 1%`
at....
@ ./~/bootstrap/dist/css/bootstrap.min.css 4:14-127
@ multi ./~/bootstrap/dist/css/bootstrap.min.css ./src/styles.css@angular/cli: 1.2.6
node: 8.2.1
os: win32 x64
@angular/animations: 4.4.7
@angular/common: 4.4.7
@angular/compiler: 4.4.7
@angular/core: 4.4.7
@angular/forms: 4.4.7
@angular/http: 4.4.7
@angular/platform-browser: 4.4.7
@angular/platform-browser-dynamic: 4.4.7
@angular/router: 4.4.7
@angular/cli: 1.2.6
@angular/compiler-cli: 4.4.7
@angular/language-service: 4.4.7After deinstalling and updating node.js, npm, angular.js and angular/cli to the newest versions, the error is now gone.
Angular CLI: 6.0.8
Node: 8.11.3
OS: win32 x64
Angular: 6.0.9
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router
Package Version
-----------------------------------------------------------
@angular-devkit/architect 0.6.8
@angular-devkit/build-angular 0.6.8
@angular-devkit/build-optimizer 0.6.8
@angular-devkit/core 0.6.8
@angular-devkit/schematics 0.6.8
@angular/cli 6.0.8
@ngtools/webpack 6.0.8
@schematics/angular 0.6.8
@schematics/update 0.6.8
rxjs 6.2.1
typescript 2.7.2
webpack 4.8.3> ng serve
** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
Date: 2018-07-15T09:30:02.665Z
Hash: 8d4abbf34c64a47192c6
Time: 10401ms
chunk {main} main.js, main.js.map (main) 15.2 kB [initial] [rendered]
chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 227 kB [initial] [rendered]
chunk {runtime} runtime.js, runtime.js.map (runtime) 5.22 kB [entry] [rendered]
chunk {styles} styles.js, styles.js.map (styles) 161 kB [initial] [rendered]
chunk {vendor} vendor.js, vendor.js.map (vendor) 3.06 MB [initial] [rendered]
i ｢wdm｣: Compiled successfully.
clydin
commented
6 years ago Closing as 6.0+ resolves this issue.
angular-automatic-lock-bot[bot]
commented
5 years ago This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.
Read more about our automatic conversation locking policy.
This action has been performed automatically by a bot.
OS?
Versions.
Repro steps.
The log given by the failure.
Mention any other details that might be useful.
The key lines in the trace, as far as I can tell, are: ERROR in ./~/css-loader!./~/postcss-loader!./src/styles.css Module build failed: BrowserslistError: Unknown browser query
basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")EXEC error (D: \TCBuildAgent2\BuildAgent\work\4fbc14a897a46199\AppTier\CMH.Retail.SES.AppTier.Facade.Web\node_modules\browserslist\index.js:29:11)ERROR in ./src/styles.css Module build failed: ModuleBuildError: Module build failed: BrowserslistError: Unknown browser query
basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")EXEC error (D: \TCBuildAgent2\BuildAgent\work\4fbc14a897a46199\AppTier\CMH.Retail.SES.AppTier.Facade.Web\node_modules\browserslist\index.js:29:11)ERROR in D:\TCBuildAgent2\BuildAgent\work\4fbc14a897a46199\AppTier\CMH.Retail.SES.AppTier.Facade.Web\node_modules\extract-text-webpack-plugin\loader.js?{"omit":1,"remove":false}!D:\TCBuildAgent2\BuildAgent\work\4fbc14a897a46199\AppTier\CMH.Retail.SES.AppTier.Facade.Web\node_modules\style-loader\index.js!D:\TCBuildAgent2\BuildAgent\work\4fbc14a897a46199\AppTier\CMH.Retail.SES.AppTier.Facade.Web\node_modules\css-loader\index.js!D:\TCBuildAgent2\BuildAgent\work\4fbc14a897a46199\AppTier\CMH.Retail.SES.AppTier.Facade.Web\node_modules\postcss-loader\index.js!D:\TCBuildAgent2\BuildAgent\work\4fbc14a897a46199\AppTier\CMH.Retail.SES.AppTier.Facade.Web\src\styles.css doesn't export content