weex-plugins / Chart-for-Apache-Weex

Chart for Apache Weex is a third party plugin, and is not developed nor maintained by Apache Weex.
Apache License 2.0
35 stars 12 forks source link

cannot compile `we` file type #9

Closed NoraGithub closed 6 years ago

NoraGithub commented 6 years ago

I installed by weex plugin add weex-chart and I used it by script

<template>
    <chart id="c1" width="750" height="400"></chart>
</template>

<script>
    var G2=require('weex-chart')('g2');//使用g2这个chart 目前只支持g2-mobile
    export default {
            ready:function(){
                var chart = new GM.Chart({
                        id: 'c1'
                });
                chart.render()
            }
    }
</script>

and now while I npm run dev & npm run serve in my project It return message below, which there seems to be somethings wrong.

    ERROR in ./~/weex-chart/chart.we
    Module parse failed: /Users/NoraChan/Desktop/geekhacker.tech/datahub_weex/node_modules/weex-chart/chart.we Unexpected token (4:0)
    You may need an appropriate loader to handle this file type.
    | * Created by godsong on 16/11/3.
    | */
    | <template>
    |     <gcanvas id="wxc_gcanvas" style="width:{{width}};height:{{height}};background-color:#ffffff"></gcanvas>
    | </template>
     @ ./~/weex-chart/index.js 4:0-21
     @ ./~/babel-loader/lib!./~/vue-loader/lib/selector.js?type=script&index=0!./src/components/pivot.vue
     @ ./src/components/pivot.vue
     @ ./src/router.js
     @ ./src/entry.js

Hope to get your message.

NoraGithub commented 6 years ago

My webpack.config.js is a default one.

...
...
const webConfig = {
  context: pathTo.join(__dirname, ''),
  entry: entry,
  output: {
    path: pathTo.join(__dirname, 'dist'),
    filename: '[name].web.js',
  },
  module: {
    // webpack 2.0 
    rules: [
      {
        test: /\.js$/,
        use: [{
          loader: 'babel-loader'
        }],
        exclude: /node_modules/
      },
      {
        test: /\.vue(\?[^?]+)?$/,
        use: [{
          loader: 'vue-loader'
        }]
      }
    ]
  },
  plugins: plugins
};
const weexConfig = {
  entry: weexEntry,
  output: {
    path: pathTo.join(__dirname, 'dist'),
    filename: '[name].js',
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        use: [{
          loader: 'babel-loader',
        }],
        exclude: /node_modules(?!\/.*(weex).*)/
      },
      {
        test: /\.vue(\?[^?]+)?$/,
        use: [{
          loader: 'weex-loader'
        }]
      },
      {
        test: /\.we(\?[^?]+)?$/,
        use: [{
          loader: 'weex-loader'
        }]
      }
    ]
  },
  plugins: plugins,
};

var exports = [webConfig, weexConfig];

if (fileType === '.we') {
  exports = weexConfig;
}
module.exports = exports;
NoraGithub commented 6 years ago

In my opinion , weex plugin add weex-chart is the same asweexpack plugin add weex-chart. Hope that doesn't matter.

NoraGithub commented 6 years ago

The legacy Weex DSL 1.0 (.we) front-end framework is deprecated! https://issues.apache.org/jira/browse/WEEX-90

Please use Vue.js instead.