Assistance/Instructions for vue-cli webpack

[msmarino]

I just cannot get this to work.

The closest I get is

SyntaxError: import declarations may only appear at top level of a module
    import './500px'

Readme states

Change the exclude value from /node_modules/ to /node_modules(?!/vue-awesome/ to fix the problem.**

which seems to be a bad regular expression and should be /node_modules(?!\/vue-awesome\/)/ ???

My main.js currently starts

import Vue from 'vue'
import Icon from 'vue-awesome/components/Icon.vue'

import 'vue-awesome/icons'

Vue.component('icon', Icon)

but I have tried multiple combinations, both in main.js and App.vue all without success.

Just as an observation, if I import a single icon with

import 'vue-awesome/icons/sign-out'

I get

SyntaxError: import declarations may only appear at top level of a module
    import Icon from '../components/Icon.vue'

npm run build returns

ERROR in static/js/vendor.1724b56a402d6484b6c1.js from UglifyJs
SyntaxError: Unexpected token: name (Icon) [./~/vue-awesome/icons/sign-out.js:1,0]

[msmarino]

Further to this, I can't even get the cloned project to run!

C:\Users\Usuario\Documents\Dev\Vue\vue-awesome>npm install

> vue-awesome@2.0.2 prepublish C:\Users\Usuario\Documents\Dev\Vue\vue-awesome
> npm run icons && npm run build && cp -r ./src/* . && rm index.js


> vue-awesome@2.0.2 icons C:\Users\Usuario\Documents\Dev\Vue\vue-awesome
> node build/icons.js

694 icon modules generated.

> vue-awesome@2.0.2 build C:\Users\Usuario\Documents\Dev\Vue\vue-awesome
> cross-env NODE_ENV=production webpack --progress --hide-modules

[0] Hash: 9ceb1b1128f8ff024686ec2498a550fe1a26c37a
Version: webpack 2.1.0-beta.22
Child
    Hash: 9ceb1b1128f8ff024686
    Version: webpack 2.1.0-beta.22
    Time: 25279ms
        Asset    Size  Chunks             Chunk Names
    bundle.js  498 kB       0  [emitted]  main
Child
    Hash: ec2498a550fe1a26c37a
    Version: webpack 2.1.0-beta.22
    Time: 25262ms
             Asset    Size  Chunks             Chunk Names
    vue-awesome.js  443 kB       0  [emitted]  main

npm ERR! Windows_NT 10.0.14393
npm ERR! argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "run" "build"
npm ERR! node v7.0.0
npm ERR! npm  v3.10.8
npm ERR! code ELIFECYCLE
npm ERR! vue-awesome@2.0.2 build: `cross-env NODE_ENV=production webpack --progress --hide-modules`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the vue-awesome@2.0.2 build script 'cross-env NODE_ENV=production webpack --progress --hide-modules'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the vue-awesome package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     cross-env NODE_ENV=production webpack --progress --hide-modules
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs vue-awesome
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls vue-awesome
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     C:\Users\Usuario\Documents\Dev\Vue\vue-awesome\npm-debug.log

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0.0 (node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.0.14: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN vue-awesome@2.0.2 No repository field.
npm ERR! Windows_NT 10.0.14393
npm ERR! argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "install"
npm ERR! node v7.0.0
npm ERR! npm  v3.10.8
npm ERR! code ELIFECYCLE
npm ERR! vue-awesome@2.0.2 prepublish: `npm run icons && npm run build && cp -r ./src/* . && rm index.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the vue-awesome@2.0.2 prepublish script 'npm run icons && npm run build && cp -r ./src/* . && rm index.js'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the vue-awesome package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     npm run icons && npm run build && cp -r ./src/* . && rm index.js
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs vue-awesome
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls vue-awesome
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     C:\Users\Usuario\Documents\Dev\Vue\vue-awesome\npm-debug.log

[Justineo]

Oops I found the problem here. The exclude regex should be /node_modules(?![\\/]vue-awesome[\\v])/ ?? because on Windows the path separator is \.

[msmarino]

Spot on! Thx

[bmwertman]

I'm seeing this same issue running on my Mac but updating the exclude in /build/webpack.base.conf.js to /node_modules(?![\\/]vue-awesome[\\/])/ isn't getting rid of the;

ERROR in static/js/vendor.1724b56a402d6484b6c1.js from UglifyJs SyntaxError: Unexpected token: name (Icon) [./~/vue-awesome/icons/sign-out.js:1,0]

[bmwertman]

Nevermind. I didn't update it for loaders, only preloaders.

[antonioreyna]

hello, where exactly should you change that regex? im having that issue when trying to do gulp --production on my laravel project.

[Justineo]

@antonioreyna #8 (comment)